Installation
Install the package
npm install mixpanel-react-native
Install iOS dependencies
Navigate to your iOS folder and install pods: Initialize Mixpanel
import { Mixpanel } from 'mixpanel-react-native';
const trackAutomaticEvents = false;
const mixpanel = new Mixpanel('YOUR_PROJECT_TOKEN', trackAutomaticEvents);
mixpanel.init();
Configuration Options
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)
JavaScript Mode supports Expo and React Native for Web.
Install AsyncStorage
npm install @react-native-async-storage/async-storage
Initialize with useNative: false
const useNative = false;
const mixpanel = new Mixpanel(
'YOUR_PROJECT_TOKEN',
false,
useNative
);
mixpanel.init();
Track Events
mixpanel.track('Video Played', {
video_title: 'Introduction to Mixpanel',
duration: 120,
quality: 'HD'
});
Timing Events
mixpanel.timeEvent('Image Upload');
// 15 seconds later
mixpanel.track('Image Upload');
// Duration property automatically set
Flush Events
// Flush immediately
mixpanel.flush();
// Adjust batch size
mixpanel.setFlushBatchSize(100);
Identify Users
// User signs in
mixpanel.track('sign in');
mixpanel.identify('12345');
Reset on Logout
mixpanel.track('log out');
mixpanel.reset();
User Profiles
mixpanel.identify('12345');
// Set properties
mixpanel.getPeople().set('plan', 'Premium');
// Set multiple properties
let properties = {
plan: 'Premium',
company: 'Acme Inc'
};
mixpanel.getPeople().set(properties);
setOnce()
increment()
append()
union()
mixpanel.getPeople().setOnce('name', 'John');
mixpanel.getPeople().setOnce('email', '[email protected]');
mixpanel.getPeople().increment('age', 1);
mixpanel.getPeople().increment('login_count', 1);
mixpanel.getPeople().append('roles', 'admin');
// Add without duplicates
mixpanel.getPeople().union('skills', 'React');
Super Properties
mixpanel.registerSuperProperties({
'App Version': '2.0.1',
'Platform': 'React Native'
});
mixpanel.registerSuperPropertiesOnce({
'First App Open': new Date().toISOString()
});
Group Analytics
// 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
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
// EU
mixpanel.setServerURL('https://api-eu.mixpanel.com');
// India
mixpanel.setServerURL('https://api-in.mixpanel.com');
Disable Geolocation
mixpanel.setUseIpAddressForGeolocation(false);
Debug Mode
mixpanel.setLoggingEnabled(true);
- 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
JavaScript Mode does not support legacy auto-tracked events.
Resources