mixpanel-react-native

Table of Contents

• Introduction
• Quick Start Guide
  • Installation
  • Integration
• I want to know more!

Introduction

Welcome to the official Mixpanel React Native library. The Mixpanel React Native library is an open-source project, and we'd love to see your contributions! We'd also love for you to come and work with us! Check out Jobs for details

Quick Start Guide

Mixpanel's React Native SDK is a wrapper around Mixpanel’s native iOS and Android SDKs and it supports offline tracking. Check out our official documentation for more in depth information on installing and using Mixpanel on React Native.

Installation

Prerequisite

• React Native v0.6+
• Setup development environment for React Native

Steps

1. Under your app's root directory, install Mixpanel React Native SDK npm install mixpanel-react-native
2. Under your application's ios folder, run pod install At this point, you are ready to use Mixpanel React Native SDK. Note: If you experience compile issues in iOS under Xcode 12.5+ and iOS 14.5+, please refer to this workaround.

Integration

Initialization

To start tracking with the library you must first initialize with your project token. To initialize the library, first add import { Mixpanel } and call Mixpanel.init(token) with your project token as it's argument.

import { Mixpanel } from 'mixpanel-react-native';
...
class YourClass extends React.Component {
    constructor(props) {
        super(props);
        this.configMixpanel();
    }

    configMixpanel = async () => {
        this.mixpanel = await Mixpanel.init("Your mixpanel token");
    }
...

Once you've called this method once, you can access mixpanel throughout the rest of your application.

Tracking

Once you've initialized the library, Mixpanel will automatically collect common mobile events. You can enable/ disable automatic collection through your project settings. With the mixpanel object created in the last step a call to track is all you need to send additional events to Mixpanel.

// Track with event-name
mixpanel.track('Sent Message');
// Track with event-name and property
mixpanel.track('Plan Selected', {'Plan': 'Premium'});

You're done! You've successfully integrated the Mixpanel React Native SDK into your app. To stay up to speed on important SDK releases and updates, star or watch our repository on Github.

I want to know more!

No worries, here are some links that you will find useful:

• Sample app
• Full API Reference

Have any questions? Reach out to Mixpanel Support to speak to someone smart, quickly.

Changelog

v1.2.3 (2021-05-20)

• Bump Mixpanel Andriod dependency to 5.9.1 (Migrate to Airship 12.x for the integration) https://github.com/mixpanel/mixpanel-react-native/pull/59