JSPM

Flows React SDK

The better way to build product adoption.

Documentation · Changelog · Examples · SDKs

Installation

For full setup instructions, see our Quickstart guide.

npm install @flows/react @flows/react-components

@flows/react SDK handles the lightweight embedding of Flows, while @flows/react-components provides a set of built-in components to get you started quickly. Alternatively, you can bring your own components.

Wrap your app with FlowsProvider component to wrap your application and pass in your Organization ID and Environment.

import { FlowsProvider } from "@flows/react";
import * as components from "@flows/react-components";
import * as tourComponents from "@flows/react-components/tour";
import "@flows/react-components/index.css";

const App = () => {
  return (
    <FlowsProvider
      organizationId="YOUR_ORGANIZATION_ID" // Find this in Settings > General
      userId="YOUR_USER_ID" // Identify the user
      environment="production" // Default environment
      components={{ ...components }}
      tourComponents={{ ...tourComponents }}
    >
      {/* Your app code here */}
    </FlowsProvider>
  );
};

Features

Meet Flows, the flexible platform for building in-app experiences. Focus on your product, not creating one-off logic.

• Build powerful in-app experiences to drive product growth
• Embed components directly into your app
• Create onboarding, product adoption, in-app messaging, growth experiments, and more
• Bring your own UI components or use Flows' built-in components

Visit our website to learn more about Flows

Get started for free

The fastest and most reliable way to get started with Flows is signing up for free. Your first 250 MTUs (monthly tracked users) are free every month, after which you pay based on usage. See our pricing for more details.

Contributing

We ❤️ contributions big and small. If you have any ideas for improvements, either submit an issue or create a pull request.

Created by rbnd.studio.