Browse docs

Install via npm

Updated June 4, 2026

On this page

To make published onboarding guides visible to your users, you need to install the FlowNavi SDK in your app. This article covers the full npm setup including passing custom user and company properties used for segmentation and analytics.

You’ll need your project’s API key from the dashboard.

Install the package

Install the FlowNavi SDK via npm:

npm install @flownavi/sdk

Initialize the SDK

Call FlowNavi.init once at your app’s entry point:

Replace YOUR_API_KEY with your key:

import { FlowNavi } from "@flownavi/sdk";

FlowNavi.init({ apiKey: "YOUR_API_KEY" });

Pass debug: true for non-production environments to keep test events out of your analytics. Guides still run normally, only the analytics writes are skipped:

import { FlowNavi } from "@flownavi/sdk";

FlowNavi.init({
  apiKey: "YOUR_API_KEY",
  debug: true
});

Identify users

Call FlowNavi.identify with the user ID your app uses for the signed-in user:

FlowNavi.identify("USER_ID_FROM_YOUR_APP");

Without this call, your onboarding guides won’t show. You can call identify again whenever a user’s properties change. More on properties below.

Pass user properties

To show different onboarding guides to different users, pass a second argument to identify with attributes about who the user is:

FlowNavi.identify("USER_ID_FROM_YOUR_APP", {
  role: "admin",
  department: "sales",
  signedUpAt: "2026-01-15"
});

Properties are arbitrary key-value pairs. We recommend naming them however your app already names them.

Supported value types:

TypeExamples
Strings"admin", "sales"
Numbers25, 1.5
Dates (ISO)"2026-01-15", "2026-01-15T10:00:00Z"

Don’t send personally identifiable information (email, name, or phone number) as properties. Stick to attributes you want to use for targeting and segmentation.

Pass company properties

You can optionally pass the user’s company data by nesting a company object in the identify call.

FlowNavi.identify("USER_ID_FROM_YOUR_APP", {
  role: "admin",
  department: "sales",
  signedUpAt: "2026-01-15",
  company: {
    id: "COMPANY_ID_FROM_YOUR_APP",
    plan: "pro",
    seatCount: 25
  }
});

company.id is required when you pass a company object. Use the same ID your app uses internally. Everything else is arbitrary, with the same supported value types as user properties: strings, numbers, and ISO date strings.

Verify the installation

On any page in your app, click the FlowNavi extension icon in your browser bar. The popup shows FlowNavi SDK is installed on this page when it’s working. If you see a warning instead, double-check your initialization code runs on app start.