event-sdk-react-native

Event SDK for React Native

This React Native SDK helps with tracking events and user behaviors automatically or manually, as well as identifying users and managing their groupings. It provides features like tracking events, user identification, SDK opt-out, and reset functionalities.

Installation

To install the package:

npm install your-package-name

## Usage
Initialization
Before using any of the features, you must initialize the SDK with your API key. This is typically done in your App component's useEffect.

## REQUIRED DEPENDENCIES TO USE: 
- npm install @react-native-async-storage/async-storage
- npm install react-native-device-info
- npm install @react-navigation/native
- npm install @react-navigation/stack
- npm install react-native-gesture-handler
- npm install react-native-safe-area-context
- npm install react-native-screens

import React, { useEffect, useRef } from 'react';
import EventSDK from 'your-package-name';
import { NavigationContainer } from '@react-navigation/native';

const App = () => {
  const navigationRef = useRef(null);

  useEffect(() => {
    const apiKey = 'your-api-key';
    EventSDK.initializeSDK(apiKey, { trackScreenViews: true });

    if (navigationRef.current) {
      EventSDK.setNavigationRef(navigationRef.current);
    }
  }, []);

  return (
    <NavigationContainer ref={navigationRef}>
      {/* Your navigation setup */}
    </NavigationContainer>
  );
};

export default App;


## initializeSDK(apiKey, options)
Initializes the SDK with the provided API key. Options can be used to enable automatic screen tracking.

## trackEvent(eventName, eventData)
Tracks a manual event with a specific event name and additional data.

## setNavigationRef(navigationRef)
Sets the navigation reference for tracking screen views automatically.

## getAnalyticsContext()
Fetches the current analytics context.

## group(groupId, traits)
Groups users under a specific group (e.g., a team or role).

## reset()
Resets the SDK, clearing any stored data or settings.

## optOut(isOptOut)
Opts the user out of tracking, passing true for opt-out or false for opt-in.

## identify(userId, traits)
Identifies a user by their unique ID and associated traits.


## COMPLETE CODE EXAMPLE: 

import React, { useState, useEffect, useRef } from 'react';
import EventSDK from 'your-package-name';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';

const Stack = createStackNavigator();

const HomeScreen = ({ navigation }) => {
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>Home Screen</Text>
      <Button title="Go to Form" onPress={() => navigation.navigate('Form')} />
    </View>
  );
};

const FormScreen = () => {
  const [userId, setUserId] = useState('');
  const [firstName, setFirstName] = useState('');
  const [lastName, setLastName] = useState('');

  const handleIdentifyEvent = () => {
    const traits = { firstName, lastName };
    EventSDK.identify(userId, traits);
  };

  return (
    <View style={{ flex: 1 }}>
      {/* Form UI */}
      <Button title="Identify User" onPress={handleIdentifyEvent} />
    </View>
  );
};

const App = () => {
  const navigationRef = useRef(null);

  useEffect(() => {
    const apiKey = 'your-api-key';
    EventSDK.initializeSDK(apiKey, { trackScreenViews: true }); // For automatic Tracking
    if (navigationRef.current) { // For automatic Tracking 
      EventSDK.setNavigationRef(navigationRef.current);
    }
  }, []);

  return (
    <NavigationContainer ref={navigationRef}>
      <Stack.Navigator initialRouteName="Home">
        <Stack.Screen name="Home" component={HomeScreen} />
        <Stack.Screen name="Form" component={FormScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
};

export default App;