Mixpanel Integration Guide

Step-by-step guide to implementing Mixpanel for product analytics. Track user behavior, analyze funnels, and understand how users interact with your product.

What is Mixpanel?

Mixpanel is a product analytics platform that helps you understand user behavior through event-based tracking. Unlike pageview-focused analytics, Mixpanel tracks specific actions users take in your application.

Key Features:

  • Event-based tracking for granular user actions
  • Funnel analysis to identify drop-off points
  • User segmentation and cohort analysis
  • Real-time data and insights
  • Retention analysis and user lifecycle tracking

Step 1: Create Mixpanel Account

1

Sign Up

Go to mixpanel.com and create a free account.

2

Create Project

After signing up, create a new project for your application. Give it a descriptive name.

3

Get Project Token

In Project Settings, copy your Project Token. You'll need this for integration.

Important: Keep your Project Token secure. It's used to send data to your Mixpanel project.

Step 2: Install Mixpanel SDK

Choose the installation method for your platform:

JavaScript/Web Installation

Option 1: CDN (Quick Start)

Add the Mixpanel script to your HTML <head> section. Get the latest snippet from your Mixpanel project settings and replace YOUR_PROJECT_TOKEN with your actual Mixpanel project token.

Option 2: NPM Package

Install the mixpanel-browser package via npm and initialize it in your code with your project token.

React Installation

Install Package

Install the mixpanel-browser package via npm.

Initialize in App.js

Initialize Mixpanel in your App.js file with your project token. Enable debug mode in development for troubleshooting.

Server-Side Installation

Node.js

Install the mixpanel package via npm and initialize it with your project token.

Python

Install the Mixpanel Python library and initialize it with your project token.

Step 3: Track Events

Start tracking user actions with events:

Basic Event Tracking

Track simple events to capture user actions in your application.

E-commerce Events

Track purchase events and other e-commerce activities to understand conversion funnels.

User Identification

Identify users for better tracking and user-level analysis across sessions.

Step 4: Common Events to Track

Essential events for product analytics:

User Actions

  • Sign Up
  • Login
  • Logout
  • Profile Updated
  • Settings Changed

Product Engagement

  • Feature Used
  • Page Viewed
  • Button Clicked
  • Form Submitted
  • Search Performed

E-commerce

  • Product Viewed
  • Added to Cart
  • Checkout Started
  • Purchase Completed
  • Subscription Started

Content

  • Article Read
  • Video Watched
  • Download Started
  • Share Clicked
  • Comment Posted

Step 5: Verify Integration

Confirm events are being tracked:

Live View

In Mixpanel, go to "Live View" to see events in real-time as they occur.

Event Explorer

Use "Events" in the left sidebar to see all tracked events and their properties.

Browser Console

Enable debug mode to see events logged in the browser console for troubleshooting.

Best Practices

✅ Do

  • Use consistent event naming (camelCase or snake_case)
  • Include relevant properties with each event
  • Identify users when they log in
  • Track events that represent user goals
  • Use descriptive event and property names

❌ Don't

  • Track too many events (focus on what matters)
  • Use inconsistent naming conventions
  • Send sensitive data (passwords, credit cards)
  • Track events on every page load (use meaningful actions)
  • Forget to identify users for user-level analysis

Next Steps

Now that Mixpanel is integrated, explore funnels, retention analysis, and user segmentation to gain deeper insights.

Learn More About Mixpanel Analytics Best Practices