React Native SDK reference

Read time: 2 minutes

Last edited: May 20, 2022

Overview

This topic documents how to get started with the React Native SDK, and links to reference information on all of the supported features.

SDK quick links

LaunchDarkly's SDKs are open source. In addition to this reference guide, we provide source, API reference documentation, and sample applications:

Resource	Location
SDK API documentation	SDK API docs
GitHub repository	react-native-client-sdk
Sample application	hello-react-native (JavaScript) hello-react-native-typescript (TypeScript)
Published module	npm

The sample code snippets for this SDK are available in both JavaScript and TypeScript, where the sample code differs. To learn more, read Using LaunchDarkly with TypeScript.

SDK version compatibility

The LaunchDarkly React Native SDK is compatible with Xcode 12.2 or higher and React Native 0.64 or higher.

If you need support for earlier versions of React Native, use older versions of the LaunchDarkly React Native SDK. To learn more, read Releases.

Getting started

Expo usage

The LaunchDarkly React Native client-side SDK is not compatible with the Expo managed workflow because the SDK uses native modules. Consider using the bare workflow instead.

After you complete the Getting Started process, follow these instructions to start using the LaunchDarkly SDK in your React Native code.

First, install the LaunchDarkly SDK as a dependency. Add the LaunchDarkly npm dependency to your project and link it to your React Native project.

To add the LaunchDarkly npm dependency:

npm install --save launchdarkly-react-native-client-sdk
npx pod-install

You must have a Podfile in your ios/ directory. After you write the Podfile, run pod install in the ios/ directory. This SDK requires Xcode 12.2 or higher and compiles against Swift 5.

After setting up the SDK, import the SDK into your project:

import LDClient from 'launchdarkly-react-native-client-sdk';

After the SDK is imported, create a single, shared instance of LDClient, passing in the client and user configuration objects. To create a client instance, you need your environment's mobile key. This authorizes your application to connect to a particular environment within LaunchDarkly. Your mobile key is available in the Projects tab of your Account settings page. Mobile keys are not secret and you can expose them in your client-side code without risk. Never embed a server-side SDK key into a client-side application.

LDClient must be a singleton

It's important to make LDClient a singleton. The client instance maintains internal state that allows LaunchDarkly to serve feature flags without making any remote requests. Do not instantiate a new client with every request.

The following example shows the simplest way to create a shared instance of LDClient:

let client = new LDClient();
let config = { mobileKey: 'YOUR_MOBILE_KEY' };
let user = { key: 'user_key' };
await client.configure(config, user);

You can give .configure a timeout parameter. If it receives flag values before the timeout, the returned promise will resolve. Otherwise, it will be rejected.

Here is an example with a timeout of five seconds:

let client = new LDClient();
let config = { mobileKey: 'YOUR_MOBILE_KEY' };
let user = { key: 'user_key' };
client.configure(config, user, 5.0)

Making feature flags available to this SDK

You must make feature flags available to mobile SDKs before the SDK can evaluate those flags. If an SDK tries to evaluate a feature flag that is not available, the user will receive the default value for that flag.

To make a flag available to this SDK, check the SDKs using Mobile key checkbox during flag creation, or on the flag's Settings tab. To make all of a project's flags available to this SDK by default, check the SDKs using Mobile key checkbox in your project Settings.

Background fetch

The React Native SDK defaults to the background fetch behavior for the platform it's running on.

Shutting down

Shut down the client when your application terminates. To learn more, read Shutting down.

Data collection

To learn more about data collection within this SDK and implications on submissions to the Apple App Store, read Apple App Store data collection policy.

Supported features

This SDK supports the following features: