> ## Documentation Index
> Fetch the complete documentation index at: https://docs.userpilot.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Analytics ReactNative Userpilot

> Userpilot ReactNative SDK enables you to capture user insights and deliver personalized in-app experiences in real time.

Userpilot ReactNative SDK enables you to capture user insights and deliver personalized in-app experiences in real time. With just a one-time setup, you can immediately begin leveraging Userpilot’s analytics and engagement features to understand user behaviors and guide their journeys in-app.

This document provides a step-by-step walkthrough of the installation Userpilot device mode support to your applications via this plugin for [Analytics-ReactNative](https://github.com/segmentio/analytics-react-native).

## Installation

You need to install the `@userpilot/segment-react-native` and the `@userpilot/react-native` dependency.
Userpilot segment react native [latest version](https://www.npmjs.com/package/@userpilot/segment-react-native)

Check [Userpilot ReactNative SDK](../installation/mobile/react-native/installation) for more details.

<CodeGroup>
  ```bash NPM theme={null}
  npm install --save @userpilot/segment-react-native @userpilot/react-native
  ```

  ```bash Yarn theme={null}
  yarn add @userpilot/segment-react-native @userpilot/react-native
  ```
</CodeGroup>

Run `pod install` after the installation to autolink the Userpilot SDK.

## Initialization

In your code where you initialize the analytics client call the `.add(plugin)` method with an `UserpilotPlugin` instance:

```javascript theme={null}
import { createClient } from '@segment/analytics-react-native';
import { Userpilotlugin } from '@userpilot/segment-react-native';

const segmentClient = createClient({
  writeKey: 'SEGMENT_KEY'
});

segmentClient.add({ plugin: new UserpilotPlugin() });
```

## **Configurations (Optional)**

| **Parameter**                             | **Type** | **Description**                                                                                              |
| ----------------------------------------- | -------- | ------------------------------------------------------------------------------------------------------------ |
| logging                                   | Boolean  | Enable or Disable logs for SDK<br /><br />**Default: false**                                                 |
| disableRequestPushNotificationsPermission | Boolean  | Disable request push notifications permission by SDK.<br /><br />**Default: false**                          |
| useInAppBrowser                           | Boolean  | configuration to indicate when to open the URL inside CustomTabsIntent or not.<br /><br />**Default: false** |

Your events will now begin to flow to Userpilot in device mode.

## Userpilot SDK callbacks

To gain full control and utilize the full capabilities of the Userpilot SDK in a React Native environment, you can start listening to Userpilot events using the `startListeningToUserpilotEvents` function from `@userpilot/segment-react-native`.

For example, to handle deep links and other SDK-triggered events, you can implement the appropriate event callbacks like this:

```javascript theme={null}
import {
  startListeningToUserpilotEvents,
  stopListeningToUserpilotEvents,
} from '@userpilot/segment-react-native';

useEffect(() => {
  startListeningToUserpilotEvents({
    onAnalyticsEvent: (event) => {
      console.log('Analytics Event:', event);
    },
    onExperienceEvent: (event) => {
      console.log('Experience Event:', event);
    },
    onNavigationEvent: (event) => {
      console.log('Navigation Event', event);
      if (event?.url) {
        handleDeepLink(event.url);
      }
    },
  });

  return () => stopListeningToUserpilotEvents();
}, [handleDeepLink]);
```

<Frame>
  [**For any questions or concerns please reach out to support@userpilot.com**](mailto:support@userpilot.com)
</Frame>
