An HTTP traffic monitor for React Native including in app interface

react-native-network-logger

An HTTP traffic monitor for React Native including in app interface.

An alternative to Wormholy but for both iOS and Android and with zero native dependencies.

Features

• Log networks requests on iOS and Android
• View network requests made with in app viewer
• Debug network requests on release builds
• Individually view headers sent, received and body sent and received
• Copy or share headers, body or full request
• Share cURL representation of request
• Zero native or JavaScript dependencies
• Built in TypeScript definitions

Screenshots

iOS

Android

Setup

Install

yarn add react-native-network-logger

or

npm install --save react-native-network-logger

Start Logging

Call startNetworkLogging in your apps entry point to log every request, or call it on a button press to manually trigger it.

import { startNetworkLogging } from 'react-native-network-logger';

startNetworkLogging();
AppRegistry.registerComponent('App', () => App);

Display Requests and Responses

import NetworkLogger from 'react-native-network-logger';

const MyScreen = () => <NetworkLogger />;

Themes

You can change between the dark and light theme by passing the theme prop with "dark" or "light".

import NetworkLogger from 'react-native-network-logger';

const MyScreen = () => <NetworkLogger theme="dark" />;

Contributing

Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests.

Download Details:

Author: alexbrazier

Live Demo: https://github.com/alexbrazier/react-native-network-logger/tree/master/example

GitHub: https://github.com/alexbrazier/react-native-network-logger

#react-native #react #mobile-apps