Super simple React Native wrapper for Mixpanel tracking
##Installation iOS##
npm install react-native-mixpanel --save- Install Mixpanel iOS SDK via either Cocoapods or manually more info here
- In XCode, in the project navigator, right click
Libraries➜Add Files to [your project's name] - Go to
node_modules➜react-native-mixpaneland addRNMixpanel.xcodeproj - In XCode, in the project navigator, select your project. Add
libRNMixpanel.ato your project'sBuild Phases➜Link Binary With Libraries - Click
RNMixpanel.xcodeprojin the project navigator and go theBuild Settingstab. Make sure 'All' is toggled on (instead of 'Basic'). Look forHeader Search Pathsand make sure it contains both$(SRCROOT)/../react-native/Reactand$(SRCROOT)/../../React- mark both asrecursive. - Run your project (
Cmd+R)
##Installation Android##
- In
android/setting.gradle
... include ':RNMixpanel', ':app' project(':RNMixpanel').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-mixpanel/android')- In
android/app/build.gradle
... dependencies { ... compile project(':RNMixpanel') }- register module (in MainActivity.java)
On newer versions of React Native (0.18+):
import com.kevinejohn.RNMixpanel.*; // <--- import public class MainActivity extends ReactActivity { ...... /** * A list of packages used by the app. If the app uses additional views * or modules besides the default ones, add more packages here. */ @Override protected List<ReactPackage> getPackages() { return Arrays.<ReactPackage>asList( new RNMixpanel(), // <------ add here new MainReactPackage()); } }##Usage##
//Require the module var Mixpanel = require('react-native-mixpanel'); //Init Mixpanel SDK with your project token Mixpanel.sharedInstanceWithToken(YOUR_PROJECT_TOKEN); //Send and event name with no properties Mixpanel.track("Event name"); //Track event with properties Mixpanel.trackWithProperties('Click Button', {button_type: 'yellow button', button_text: 'magic button'}); //Create Alias from unique id Mixpanel.createAlias(UNIQUE_ID) //Identify Mixpanel.identify(UNIQUE_ID) //Set People properties Mixpanel.set({"$email": "elvis@email.com"}); //Set People Properties Once Mixpanel.setOnce({"$email": "elvis@email.com", "Created": new Date().toISOString()}); // Timing Events // Sets the start time for an action, for example uploading an image Mixpanel.timeEvent("Image Upload"); // to be followed by a tracking event to define the end time Mixpanel.track("Image Upload"); // Register super properties Mixpanel.registerSuperProperties({"Account type": "Free", "User Type": "Vendor"}); // Register super properties Once Mixpanel.registerSuperPropertiesOnce({"Gender": "Female"}); // track Revenue Mixpanel.trackCharge(399); // track with properties Mixpanel.trackCharge(399, {"product": "ACME Wearable tech"}); // increment property Mixpanel.increment("Login Count", 1); // Mixpanel reset method Mixpanel.reset(); // get the last distinct id set with identify or, if identify hasn't been // called, the default mixpanel id for this device. Mixpanel.getDistinctId(function(id){}) ##Notes## For more info please have a look at the [official Mixpanel reference](https://mixpanel.com/help/reference/ios) for iOS