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.

Get started

After you complete the Get started process, follow these instructions to start using the LaunchDarkly SDK in your React Native code:

• Understand version compatibility
• Install the SDK
• Initialize the client and identify a context

Understand version compatibility

The following table describes the LaunchDarkly React Native SDK version compatibility:

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

Install the SDK

To install the SDK:

1. Install the LaunchDarkly SDK as a dependency.

yarn add @launchdarkly/react-native-client-sdk
COPY

2. The LaunchDarkly React Native SDK version 10 uses @react-native-async-storage/async-storage for bootstrapping:

• If you are using Expo, skip this step and continue to step 3.

• If you are not using Expo, you must explicitly add @react-native-async-storage/async-storage as a dependency to your project.

  Adding the async storage dependency

  yarn add @react-native-async-storage/async-storage
  COPY

3. Run npx pod-install.

4. Next, import the SDK into your project:

import { LDProvider, ReactNativeLDClient } from '@launchdarkly/react-native-client-sdk';
COPY

5. After the SDK is imported, create a single, shared instance of ReactNativeLDClient. To create this, you need your environment's mobile key. This authorizes your application to connect to a particular environment within LaunchDarkly.

6. After you instantiate ReactNativeLDClient, pass it to LDProvider. LDProvider uses the React context API to store and pass data to child components through hooks. It requires the client.

Initialize the client and identify a context

In version 10 of the SDK, you do not specify a context when you initialize the client. Instead, you must provide the context in an identify() call, for example on application mount. The identify() method returns a promise that can be awaited. End users will receive fallback values until you specify a context by calling identify().

The following example shows the simplest way to create a shared instance of ReactNativeLDClient, and identify a context:

const client = new ReactNativeLDClient('mobile-key-123abc', AutoEnvAttributes.Enabled, options);
const context = { kind: 'user', key: 'user-key-123abc' }
const App = () => {
  // call identify on App mount or later in some other component
  useEffect(() => {
    client.identify(context).catch((e: any) => console.log(e));
  }, []);
  return (
    <LDProvider client={client}>
      /* your application code here */
      <YourComponent />
    </LDProvider>
  );
};
export default App;
COPY

To learn more about the specific configuration options available in this SDK, read LDOptions.

Background fetch

In version 10, the React Native SDK defaults to a streaming connection mode. In this mode, your application receives updates when it is in the foreground and does not when it is in the background. To learn more, read Offline mode.

In previous versions, the SDK defaulted to the background fetch behavior for the platform it was 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
• Context configuration
• Evaluating flags
• Flag evaluation reasons
• Flushing events
• Getting all flags
• Identifying and changing contexts
• Logging
• Monitoring SDK status
• Multiple environments
• Offline mode
• Private attributes
• Relay Proxy configuration, using proxy mode
• Sending custom events
• Shutting down
• Subscribing to flag changes