React Native SDK reference

Overview

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

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.

Getting started

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
COPY

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';
COPY

After the SDK is imported, create a single, shared instance of LDClient, passing in the client and context 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.

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

let client = new LDClient();
let config: ld.LDConfig = {
  mobileKey: 'mobile-key-123abc',
  enableAutoEnvAttributes: true
};
let context: ld.LDContext = { key: 'user-key-123abc', kind: 'user' };
await client.configure(config, context);
COPY

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

let client = new LDClient();
let config = {
  mobileKey: 'mobile-key-123abc',
  enableAutoEnvAttributes: true
};
let context = { key: 'user-key-123abc', kind: 'user' };
await client.configure(config, context);
COPY

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:

client.configure(config, context, 5)
COPY

Limitations on reloading native modules

The hot reloading behavior of the React Native SDK does not automatically reload React's native modules. Because hot reloading is not fully supported by the React Native SDK, in some cases performing a hot reload throws an error indicating that the LaunchDarkly SDK is already initialized. It is safe to catch this error and proceed, however, you must decide whether that is an appropriate behavior in your application.

Here's how:

let ldClient = new LDClient();
try {
  await ldClient.configure(config, context);
} catch (err) {
  console.log(err);
}
COPY

Background fetch

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

Shut down the client

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:

• Anonymous contexts and users
• Automatic environment attributes
• Configuration, including
  • Application metadata configuration
  • Service endpoint configuration
• Evaluating flags
• Flag evaluation reasons
• Flushing events
• Getting all flags
• Identifying and changing contexts
• Inspectors
• Monitoring SDK status
• Offline mode
• Private attributes
• Relay Proxy configuration, using proxy mode
• Sending custom events
• Shutting down
• Subscribing to flag changes
• User and context configuration