A Rozenite plugin that provides comprehensive network activity monitoring for React Native applications.

The Rozenite Network Activity Plugin provides real-time network request monitoring, detailed request/response inspection within your React Native DevTools environment. It offers comprehensive network debugging capabilities similar to browser DevTools Network panel.

Features

• Real-time Network Monitoring: Track all HTTP/HTTPS requests in real-time
• Request Details: View request headers, method, URL, and timing information
• Response Inspection: Examine response headers, status codes, and timing data
• Performance Analysis: Analyze request duration, connection timing, and performance metrics
• Request History: Maintain a searchable history of network activity
• Chrome DevTools Protocol: Built on CDP for accurate network event capture
• Production Safety: Automatically disabled in production builds

Installation

Install the Network Activity plugin as a dependency:

npm install @rozenite/network-activity-plugin

Quick Start

1. Install the Plugin

npm install @rozenite/network-activity-plugin

2. Integrate with Your App

Add the DevTools hook to your React Native app:

// App.tsx
import { useNetworkActivityDevTools } from '@rozenite/network-activity-plugin';

function App() {
  // Enable Network Activity DevTools in development
  useNetworkActivityDevTools();

  return <YourApp />;
}

3. Access DevTools

Start your development server and open React Native DevTools. You'll find the "Network Activity" panel in the DevTools interface.

Made with ❤️ at Callstack

rozenite is an open source project and will always remain free to use. If you think it's cool, please star it 🌟.

Callstack is a group of React and React Native geeks, contact us at [email protected] if you need any help with these or just want to say hi!

Like the project? ⚛️ Join the team who does amazing stuff for clients and drives React Native Open Source! 🔥