Documentation

Get Started in
5 Minutes

Integrate beautiful onboarding flows into your React Native app with just a few lines of code.

Step 1

Create Your Account

Sign up for a free OnboardKit account and get your API key from the dashboard.

Get Your API Key

After signing up, navigate to your dashboard and copy your API key. You'll need this to connect your app.

Create Free Account→
Step 2

Build Your Flow

Use our visual builder to create your onboarding flow. Add steps, customize styling, and preview in real-time.

Welcome screens
Text inputs
Email & password fields
Single & multi-select
Value propositions
Completion screens

Tip: Once you've created your flow, copy the Flow ID from the flow settings. You'll use this in your code.

Step 3

Install the SDK

Add the OnboardKit SDK to your React Native project using npm or yarn.

1npm install react-native-onboard-kit
2# or
3yarn add react-native-onboard-kit

Peer Dependencies Required

Make sure you also install AsyncStorage:

1npm install @react-native-async-storage/async-storage
Step 4

Render Your Flow

Import the OnboardKitFlow component and render it with your flow ID and API key. That's it!

1import { OnboardKitFlow } from "react-native-onboard-kit";
2
3function OnboardingScreen({ navigation }) {
4  return (
5    <OnboardKitFlow
6      flowId="your-flow-id"
7      apiKey="your-api-key"
8      onFinish={async (responses) => {
9        console.log("Onboarding complete!", responses);
10        // Handle completion - create account, save data, etc.
11        await createAccount(responses);
12        navigation.navigate("Home");
13      }}
14      onBack={() => navigation.goBack()}
15    />
16  );
17}

flowId

Required

Your flow ID from the dashboard

apiKey

Required

Your API key from the dashboard

onFinish

Required

Callback when flow completes

Step 5

Handle Responses

The onFinish callback receives all user responses. Use this data to create accounts, save preferences, or navigate to your app.

1{
2  "name": "John Doe",
3  "email": "john@example.com",
4  "interests": ["fitness", "nutrition"],
5  "experience_level": "intermediate",
6  "newsletter": true
7}

Note: Response keys match the field keys you defined in your flow. Single-field steps return the value directly, while multi-field steps return an object.

Built-in Features

Zero Configuration

No init() calls needed. Just render the component and it works.

Built-in Analytics

Automatic session tracking, completion rates, and drop-off analysis.

Resume Support

Users can pick up where they left off if they exit mid-flow.

Customizable Theming

Colors, fonts, and styling configured from your dashboard.

TypeScript Support

Fully typed with complete TypeScript definitions.

Multiple Screen Types

Text inputs, selects, value props, and more out of the box.

Ready to Get Started?

Create your free account and start building beautiful onboarding flows in minutes.

Get Started Free→