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

# React Native SDK

> Track events from React Native mobile apps with the Mixpanel SDK

## Installation

<Steps>
  <Step title="Install the package">
    ```bash theme={null}
    npm install mixpanel-react-native
    ```
  </Step>

  <Step title="Install iOS dependencies">
    Navigate to your iOS folder and install pods:

    ```bash theme={null}
    cd ios && pod install
    ```
  </Step>

  <Step title="Initialize Mixpanel">
    ```javascript theme={null}
    import { Mixpanel } from 'mixpanel-react-native';

    const trackAutomaticEvents = false;
    const mixpanel = new Mixpanel('YOUR_PROJECT_TOKEN', trackAutomaticEvents);
    mixpanel.init();
    ```
  </Step>
</Steps>

## Configuration Options

```javascript theme={null}
const trackAutomaticEvents = false;
const useNative = true; // Use Native Mode (iOS/Android)
const serverURL = 'https://api.mixpanel.com';
const optOutTrackingDefault = false;
const superProperties = {
  'data_source': 'react-native-app'
};

const mixpanel = new Mixpanel(
  'YOUR_PROJECT_TOKEN',
  trackAutomaticEvents,
  useNative,
  serverURL,
  optOutTrackingDefault,
  superProperties
);

mixpanel.init();
```

## JavaScript Mode (Expo Support)

<Info>
  JavaScript Mode supports Expo and React Native for Web.
</Info>

<Steps>
  <Step title="Install AsyncStorage">
    ```bash theme={null}
    npm install @react-native-async-storage/async-storage
    ```
  </Step>

  <Step title="Initialize with useNative: false">
    ```javascript theme={null}
    const useNative = false;
    const mixpanel = new Mixpanel(
      'YOUR_PROJECT_TOKEN',
      false,
      useNative
    );
    mixpanel.init();
    ```
  </Step>
</Steps>

## Track Events

```javascript theme={null}
mixpanel.track('Video Played', {
  video_title: 'Introduction to Mixpanel',
  duration: 120,
  quality: 'HD'
});
```

### Timing Events

```javascript theme={null}
mixpanel.timeEvent('Image Upload');

// 15 seconds later
mixpanel.track('Image Upload');
// Duration property automatically set
```

### Flush Events

```javascript theme={null}
// Flush immediately
mixpanel.flush();

// Adjust batch size
mixpanel.setFlushBatchSize(100);
```

## Identify Users

```javascript theme={null}
// User signs in
mixpanel.track('sign in');
mixpanel.identify('12345');
```

### Reset on Logout

```javascript theme={null}
mixpanel.track('log out');
mixpanel.reset();
```

## User Profiles

```javascript theme={null}
mixpanel.identify('12345');

// Set properties
mixpanel.getPeople().set('plan', 'Premium');

// Set multiple properties
let properties = {
  plan: 'Premium',
  company: 'Acme Inc'
};
mixpanel.getPeople().set(properties);
```

<Tabs>
  <Tab title="setOnce()">
    ```javascript theme={null}
    mixpanel.getPeople().setOnce('name', 'John');
    mixpanel.getPeople().setOnce('email', 'john@example.com');
    ```
  </Tab>

  <Tab title="increment()">
    ```javascript theme={null}
    mixpanel.getPeople().increment('age', 1);
    mixpanel.getPeople().increment('login_count', 1);
    ```
  </Tab>

  <Tab title="append()">
    ```javascript theme={null}
    mixpanel.getPeople().append('roles', 'admin');
    ```
  </Tab>

  <Tab title="union()">
    ```javascript theme={null}
    // Add without duplicates
    mixpanel.getPeople().union('skills', 'React');
    ```
  </Tab>
</Tabs>

## Super Properties

```javascript theme={null}
mixpanel.registerSuperProperties({
  'App Version': '2.0.1',
  'Platform': 'React Native'
});

mixpanel.registerSuperPropertiesOnce({
  'First App Open': new Date().toISOString()
});
```

## Group Analytics

```javascript theme={null}
// Assign user to group
mixpanel.setGroup('company', 'Acme Inc');

// Track event (group is included automatically)
mixpanel.track('feature_used');

// Set group properties
mixpanel.getGroup('company', 'Acme Inc').set('industry', 'Technology');
```

## Privacy Controls

### Opt Out

```javascript theme={null}
mixpanel.optOutTracking();

// Initialize with opt-out
const optOutTrackingDefault = true;
const mixpanel = new Mixpanel(
  'YOUR_PROJECT_TOKEN',
  false,
  true,
  'https://api.mixpanel.com',
  optOutTrackingDefault
);
```

### EU/India Data Residency

```javascript theme={null}
// EU
mixpanel.setServerURL('https://api-eu.mixpanel.com');

// India
mixpanel.setServerURL('https://api-in.mixpanel.com');
```

### Disable Geolocation

```javascript theme={null}
mixpanel.setUseIpAddressForGeolocation(false);
```

## Debug Mode

```javascript theme={null}
mixpanel.setLoggingEnabled(true);
```

View logs in Xcode or Android Studio console.

## Platform Considerations

* **Native Mode**: Full iOS/Android SDK features
* **JavaScript Mode**: Cross-platform, Expo compatible
* Events flush every 60 seconds or on app background
* Batch size: 50 events by default
* Local storage persists until app uninstall

<Warning>
  JavaScript Mode does not support legacy auto-tracked events.
</Warning>

## Resources

* [Full API Reference](https://mixpanel.github.io/mixpanel-react-native/Mixpanel.html)
* [GitHub Repository](https://github.com/mixpanel/mixpanel-react-native)
* [Example App](https://github.com/mixpanel/mixpanel-react-native/tree/master/Samples)