JotReviewJotReview
Sign Inarrow_forward

React Native SDK Quick Start

Add JotReview to your React Native app — iOS and Android from one codebase.

Requirements

The JotReview React Native SDK is written in TypeScript and requires no native modules, so it works in both Expo (managed and bare) and plain React Native apps.

  • •React Native 0.71+ (New Architecture supported)
  • •React 18+
  • •Expo SDK 49+ (optional — no config plugin required)

The SDK talks to the same public JotReview API as our web and Swift SDKs, so there is nothing to configure on the backend.

Installation

Install the SDK and its one peer dependency — @react-native-async-storage/async-storage, used to persist an anonymous visitor ID across launches:

1npm install @jotreview/react-native @react-native-async-storage/async-storage
2# or
3yarn add @jotreview/react-native @react-native-async-storage/async-storage

For bare React Native apps, install pods after adding the package:

1npx pod-install

Expo users don't need any additional setup — the SDK is pure JavaScript and runs in Expo Go and EAS builds without a config plugin.

Set up the provider

Wrap your app in JotReviewProvider and pass your project ID. Do this once at the root of your app. The provider initializes the SDK and mounts the modal host used by the imperative API.

1

export default function App() { return ( <JotReviewProvider projectId="a1b2c3d4-5e6f-4a7b-8c9d-0e1f2a3b4c5d"> <RootNavigator /> </JotReviewProvider> ); } `

Your Project ID is in your JotReview dashboard under Settings > Login & SSO. It's a UUID (e.g. a1b2c3d4-5e6f-4a7b-8c9d-0e1f2a3b4c5d) and is safe to ship in your app.

> ⚠️ The Project Secret shown next to it is server-side only — it signs Secure Mode identity signatures. Never put it in your app, commit it, or bundle it. The SDK never needs the secret; only your backend does.

Show the feedback sheet

With the provider mounted, open JotReview from anywhere using the imperative API:

1

// Feedback (default) JotReview.showFeedback();

// Open a specific section JotReview.showRoadmap(); JotReview.showChangelog(); `

Each call presents a native modal on top of your content. Users dismiss it with a swipe-down gesture or the close button.

Prefer a declarative component? See the React Native Integration article for <JotReviewFeedback />, <JotReviewRoadmap />, and <JotReviewChangelog />.

Identify users

Call JotReview.identify after login to associate feedback and votes with a specific user:

1JotReview.identify({
2 userId: "usr_7x9k2m",
3 email: "ada@example.com",
4 firstName: "Ada",
5 lastName: "Lovelace",
6});

See the Identify Users article for the full parameter reference and secure authentication.

Complete example

A minimal app with JotReview fully integrated:

1import React from "react";
2import { View, Button } from "react-native";

export default function App() { return ( <JotReviewProvider projectId="a1b2c3d4-5e6f-4a7b-8c9d-0e1f2a3b4c5d"> <HomeScreen /> </JotReviewProvider> ); }

function HomeScreen() { return ( <View style={{ flex: 1, justifyContent: "center", padding: 24, gap: 12 }}> <Button title="Share Feedback" onPress={() => JotReview.showFeedback()} /> <Button title="Roadmap" onPress={() => JotReview.showRoadmap()} /> <Button title="What's New" onPress={() => JotReview.showChangelog()} /> </View> ); } `