1- # react-native-xenon
1+ < div align = " center " >
22
3- A comprehensive tool for analyzing HTTP(S) requests and logs in React Native apps. Designed for use across all environments, it offers an intuitive interface for efficient debugging and issue resolution.
3+ # react-native-xenon :microscope :
4+
5+ ### A comprehensive tool for analyzing HTTP(S) requests and logs in React Native apps.
6+
7+ </div >
8+
9+ <div align =" center " >
10+
11+ [ ![ GitHub Actions Workflow Status] [ github-actions-status-badge ]] [ github-actions-link ]
12+ [ ![ NPM Version] [ npm-version-badge ]] [ npm-version-link ]
13+ [ ![ React Native] [ react-native-badge ]] [ react-native-link ]
14+ [ ![ Runs With Expo] [ runs-with-expo-badge ]] [ runs-with-expo-link ]
15+ [ ![ Types Included] [ types-included-badge ]] [ types-included-link ]
16+ [ ![ Buy Me A Coffee] [ buy-me-a-coffee-badge ]] [ buy-me-a-coffee-link ]
17+
18+ </div >
19+
20+ ## Features
21+
22+ - HTTP/HTTPS request monitoring with support for ** XHR** and ** Fetch API**
23+ - ** WebSocket** connection tracking
24+ - ** Console** logging interception (log, info, warn, error, etc.)
25+ - ** Draggable bubble** interface for quick access
26+ - Request/response inspection with ** detailed information**
27+ - Real-time monitoring capabilities
28+ - Works with both ** React Native** and ** Expo** projects
429
530## Installation
631
32+ ### React Native
33+
734Install the Xenon with ` yarn ` or ` npm ` . You will also need to install ` react-native-safe-area-context ` if you haven't already.
835
936``` sh
@@ -65,7 +92,7 @@ Xenon.hide();
6592
6693## Methods
6794
68- | ** Method** | ** Return type ** | ** Description** |
95+ | ** Method** | ** Return Type ** | ** Description** |
6996| ------------- | --------------- | ------------------------------------------------------------------------------------------- |
7097| ` isVisible() ` | ` boolean ` | Checks whether the debugger is currently visible. |
7198| ` show() ` | ` void ` | Makes the debugger visible. If it is already visible, this method has no additional effect. |
@@ -78,3 +105,18 @@ See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the
78105## License
79106
80107This project is [ MIT] ( ./LICENSE ) licensed.
108+
109+ <!-- badges -->
110+
111+ [ github-actions-status-badge ] : https://img.shields.io/github/actions/workflow/status/purrseus/react-native-xenon/ci.yml?style=for-the-badge&logo=github&label=%20&labelColor=1B1B1D
112+ [ github-actions-link ] : https://github.com/purrseus/react-native-xenon/blob/develop/.github/workflows/ci.yml
113+ [ npm-version-badge ] : https://img.shields.io/npm/v/react-native-xenon?style=for-the-badge&color=CC3F3E&labelColor=1B1B1D&logo=npm&label=%20&logoColor=CC3F3E
114+ [ npm-version-link ] : https://www.npmjs.com/package/react-native-xenon
115+ [ react-native-badge ] : https://img.shields.io/badge/%20react%20native-67DAFB?style=for-the-badge&logo=react&logoColor=67DAFB&labelColor=1B1B1D
116+ [ react-native-link ] : https://reactnative.dev
117+ [ runs-with-expo-badge ] : https://img.shields.io/badge/runs%20with%20Expo-FFFFFF?style=for-the-badge&logo=expo&labelColor=1B1B1D&logoColor=FFFFFF
118+ [ runs-with-expo-link ] : https://expo.dev
119+ [ types-included-badge ] : https://img.shields.io/badge/included-3077C6?style=for-the-badge&logo=typescript&logoColor=3077C6&labelColor=1B1B1D
120+ [ types-included-link ] : https://www.typescriptlang.org
121+ [ buy-me-a-coffee-badge ] : https://img.shields.io/badge/%20-Buy%20me%20a%20coffee-FEDD03?style=for-the-badge&logo=buymeacoffee&labelColor=1B1B1D
122+ [ buy-me-a-coffee-link ] : https://www.buymeacoffee.com/thiendo261
0 commit comments