Install the SDK

Download Leanplum JavaScript SDK

Add leanplum.js to your project

<script type="text/javascript" src="leanplum.js"></script>

Add sw.min.js to your project

To utilize web push in your app, you must add the Service Worker file sw.min.js from our SDK to your root directory, then register the Service Worker and user for push notifications. For more, see Messaging.

Initialize Leanplum

// This value should be set to true only if you're developing on your server.
var isDevelopmentMode = true;

// Sample variables. This can be any JSON object.
var variables = {
 items: {
   color: 'red',
   size: 20,
   showBadges: true
 showAds: true

// We've inserted your Test API keys here for you :)
if (isDevelopmentMode) {
 Leanplum.setAppIdForDevelopmentMode("YOUR_APP_ID", "YOUR_DEVELOPMENT_KEY");
} else {
 Leanplum.setAppIdForProductionMode("YOUR_APP_ID", "YOUR_PRODUCTION_KEY");

Leanplum.start(function(success) {
 console.log('Success: ' + success);
 console.log('Variables', Leanplum.getVariables());

Verify the setup

For testing purposes, run your app in Debug/development mode using the Development key. The Production key should be used when the app is pushed live and used by real users in production.

The Development key is used to:

  • Send data to the development/test pipeline (via an open web socket in real-time)
  • Log processes in the debugger for validation
  • See and register your developer devices in the dashboard
  • Force your test device into specific A/B test variants
  • Keep your data segregated from the live users (instead it will show up in the Developer Activity section)
  • Update custom templates and variables to the content management system

Never use a development key in a production/live build.

Using a development key utilizes an open socket for real-time analytics, but this pipeline cannot support real users (in a production build). Additionally, any user data will be lost as it is not captured in analytics.

Register your device

Be sure to run your app in development mode. From the Leanplum dashboard, go to Devices then hover over your device and click Register.

Track events

How to track events in your app:

Leanplum.track("View Cart");
Leanplum.track("View Cart", {itemsInCart: 4});
Leanplum.track("Purchase", 4.99, {itemCategory: 'Apparel', itemName: 'Shoes'});

How to track states transitions. These are sections of your app the user is in.


// The 'null' state. Causes the user to leave the current state and not enter another one.

Passing custom user IDs.


Passing user attributes. User attributes are applied to the user, so they're saved across sessions. If an attribute no longer applies, you can set it to null.

Leanplum.start({hasFacebookProfile: true});
Leanplum.start('userId', {age: 20, gender: 'Male'}, callback);

Starts Leanplum by simply loading the cached variables, and doesn't log a new session. Useful for subsequent page loads inside the app.


How to track the session lifecycle.

Leanplum.pauseSession();  // Pauses the current session.
Leanplum.resumeSession();  // Resumes the current session.
Leanplum.stop();  // Ends the current session. Sessions will automatically timeout after 2 hours if stop isn't called explicitly (30 minutes if paused).


Users and Devices: Learn how to handle users, signing in, and user attributes.

Variables: Learn how to set up Leanplum variables for use in A/B tests.

Events: Learn how to track Events in Leanplum.

Messaging: Learn how to setup your app to receive Messages from Leanplum.

Callbacks: Learn how to handle the asynchronous nature of Leanplum in your app.