react-native-edgee

For React Native applications, we provide a comprehensive SDK that enables seamless data collection with rich native context. This SDK automatically collects 30+ device and app data points while maintaining privacy compliance and optimal performance.

Installation

Step 1: Install Package and Dependencies

# npm
npm install react-native-edgee @react-native-async-storage/async-storage @react-native-community/netinfo

# yarn
yarn add react-native-edgee @react-native-async-storage/async-storage @react-native-community/netinfo

# Expo
npx expo install react-native-edgee @react-native-async-storage/async-storage @react-native-community/netinfo

Step 2: Platform Setup

Choose your platform setup based on your React Native environment:

React Native CLI

iOS:

cd ios && pod install && cd ..

Android:

1. Add native module to android/app/src/main/java/.../MainApplication.java:

import com.reactnativeedgee.EdgeeReactNativePackage;

public class MainApplication extends Application implements ReactApplication {
  // ... existing code ...

  @Override
  protected List<ReactPackage> getPackages() {
    @SuppressWarnings("UnnecessaryLocalVariable")
    List<ReactPackage> packages = new PackageList(this).getPackages();

    packages.add(new EdgeeReactNativePackage()); // Add this line

    return packages;
  }
}

2. Add permission to android/app/src/main/AndroidManifest.xml:

<manifest xmlns:android="http://schemas.android.com/apk/res/android">
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <!-- Your existing manifest content -->
</manifest>

3. Rebuild your app:

npx react-native run-android

Expo Development Build

# Install the package
npx expo install react-native-edgee @react-native-async-storage/async-storage @react-native-community/netinfo

# Create development build (this compiles native modules)
npx expo run:ios     # For iOS
npx expo run:android # For Android

Note: Native modules require a development build, not Expo Go.

Expo Go

npx expo install react-native-edgee @react-native-async-storage/async-storage @react-native-community/netinfo

Limitations: Native context collection is disabled. Only basic JavaScript context (screen size, platform, locale) will be available.

Step 3: Verify Installation

Test that native modules are working:

import { isNativeModuleAvailable } from 'react-native-edgee';

console.log('Native modules available:', isNativeModuleAvailable());
// Should log: true (React Native CLI, Expo Dev Build)
// Should log: false (Expo Go)

Quick Start

import { EdgeeClient } from 'react-native-edgee';

// Create client instance
export const edgee = new EdgeeClient({
  host: "https://your-edgee-host.com",
  debug: false, // Set to true to enable debug logging and debugger in the Edgee console
  collectDeviceId: false, // Set to true if you need unique device tracking
});

Replace https://your-edgee-host.com with the URL provided in the Edgee console, in the project overview section.

Events

Screen event

The edgee.screen() method expects the following parameters:

field | type | description ----- | ---- | --- screen_obj (required) | object | A free-form dictionary object containing properties of the screen event. This object has to include the screen_name field, and can include the screen_class and properties fields. components (optional) | object | Specifies which analytics components should receive the event data. This allows for targeted data sending based on your configured components within the Edgee platform.

Example:

// Track screen views
edgee.screen({
  screen_name: 'Home Screen',
  screen_class: '/',
  properties: {
    category: 'main',
    loaded_time: Date.now()
  }
});

Track event

The edgee.track() method expects the following parameters:

field | type | description ----- | ---- | --- track_obj (required) | object | A free-form dictionary object containing properties of the track event. This object has to include the name field, and can include the screen_name and screen_class fields, and the properties field. components (optional) | object | Specifies which analytics components should receive the event data. This allows for targeted data sending based on your configured components within the Edgee platform.

Example:

// Track events (automatically includes rich native context)
edgee.track({
  name: 'App Launched',
  screen_name: 'Home Screen',
  screen_class: '/',
  properties: {
    source: 'cold_start',
    version: '1.0.0'
  }
});

User event

The edgee.user() method expects the following parameters:

field | type | description ----- | ---- | --- user_obj (required) | object | A free-form dictionary object containing properties of the user event. This object has to include the user_id field, and can include the properties field. components (optional) | object | Specifies which analytics components should receive the event data. This allows for targeted data sending based on your configured components within the Edgee platform.

Example:

// Track user information
edgee.user({
  user_id: '123',
  properties: {
    email: '[email protected]',
    plan: 'premium'
  }
});

Consent (Optional)

To define the consent status, you can use the edgee.consent() method.

// Set consent - all tracking calls automatically respect this setting
// 'granted', 'denied', or 'pending'
await edgee.consent('granted');

// Check consent status
console.log('Current consent:', edgee.getConsent());

// Listen for consent changes
const unsubscribe = edgee.onConsentChange((status) => {
  console.log('Consent changed to:', status);
});

// Reset consent
await edgee.resetConsent();

Configuration

interface EdgeeConfig {
  host: string;                    // Your Edgee endpoint URL (required)
  debug?: boolean;                 // Enable debug logging (default: false)
  collectDeviceId?: boolean;       // Collect unique device ID (default: false)
  cookieName?: string              // Name of the cookie used by Edgee (it must be identical to the one on the console. Do not change it if you are unsure).
}

Debug Mode

Enable debug logging to see what's happening:

const edgee = new EdgeeClient({
  host: "https://your-edgee-host.com",
  debug: true, // This will log all events and native context
});

Compatibility

| Platform | Version | Native Context | Auto-Linking | |----------|---------|----------------|--------------| | React Native | 0.72+ | Full | iOS: Yes, Android: Manual | | iOS | 11.0+ | Full | CocoaPods | | Android | API 21+ | Full | Manual setup | | Expo Dev Build | Latest | Full | Automatic | | Expo Go | Latest | Fallback | N/A |

Next Steps

After integrating the React Native SDK, you are ready to start using Edgee's services.

In the Services section, you will find guides on activating and customizing features such as advanced analytics, A/B testing, security, and more: https://www.edgee.cloud/docs/proxy/services/overview

For more details about the React Native SDK, visit: https://github.com/edgee-cloud/react-native-edgee