@launchdarkly/react-native-client-sdk
TypeScript icon, indicating that this package has built-in type declarations

10.1.2 • Public • Published

LaunchDarkly React Native SDK

NPM Actions Status Documentation NPM NPM

The LaunchDarkly React Native SDK is designed primarily for use in mobile environments. It follows the client-side LaunchDarkly model for multi-user contexts.

This SDK is a complete rewrite of the React Native SDK and replaces launchdarkly-react-native-client-sdk. The APIs are based on the JS SDK rather than the iOS and Android SDKs. It is not a wrapper of the iOS and Android SDKs. It is implemented purely in JS and supports Expo. Please consider updating your application to use this package instead.

For more information, see the complete reference guide for this SDK.

Known Android identify issue

On Android, Flipper interferes with the SDK's streaming connections. As a result the identify call never resolves. The long term solution is the removal of Flipper from react-native. The Facebook team are working on this.

In the meantime, we recommend one of these workarounds:

  • If you are using Expo, you'll need to do a native build in release expo run:android --variant release.

  • If you are using Expo and want to debug and hot reload, you'll need to do a native build in debug expo run:android --variant debug and then go to the android folder and manually find and remove all references to flipper. This is a reported issue in the Flipper repo.

  • If you are using the expo-go app on Android, unfortunately there is no known easy way to disable Flipper in Expo Go. Please use one of two previous native build options.

  • If you are not using Expo, go to the android folder and manually find and remove all references to flipper.

Install

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

Additionally, the LaunchDarkly React-Native SDK uses @react-native-async-storage/async-storage for bootstrapping. This is a native dependency.

If you are using expo, then installing this package from npm like above and re-running pod install should suffice.

If you are not using expo, you will need to explicitly add @react-native-async-storage/async-storage as a dependency to your project and re-run pod install for auto-linking to work.

Quickstart

  1. Wrap your application with LDProvider and set the client prop to an instance of ReactNativeLDClient. Call identify at a later time to get flags. In the example below, identify is called on App mount:
// App.tsx
import { LDProvider, ReactNativeLDClient } from '@launchdarkly/react-native-client-sdk';

const featureClient = new ReactNativeLDClient('mobile-key', AutoEnvAttributes.Enabled);
const userContext = { kind: 'user', key: 'test-user-1' };

const App = () => {
  useEffect(() => {
    featureClient.identify(userContext).catch((e) => console.error(e));
  }, []);

  return (
    <LDProvider client={featureClient}>
      <YourComponent />
    </LDProvider>
  );
};

export default App;
  1. Then in a child component, evaluate flags with useBoolVariation:
import { useBoolVariation } from '@launchdarkly/react-native-client-sdk';

export default function Welcome() {
  const flagValue = useBoolVariation('flag-key', false);

  return (
    <View style={styles.container}>
      <Text>Welcome to LaunchDarkly</Text>
      <Text>Flag value is {`${flagValue}`}</Text>
    </View>
  );
}

See the full example app.

Developing this SDK

  1. Build all the code in the js-core repo:
# at js-core repo root
yarn && yarn build
  1. The example app uses react-native-dotenv to manage environment variables. Under packages/sdk/react-native/example create an .env file and add your mobile key:
echo "MOBILE_KEY=mob-abc" >> packages/sdk/react-native/example/.env
  1. Run the example app. This will link the local react-native sdk code to the example app for development:
# in react-native/example
yarn && yarn ios-go

Privacy manifest

At WWDC23, Apple introduced the concept of Privacy Manifests. The privacy manifest describes our data usage with respect to the minimum case of data collection. You will have to update your own privacy manifest if you choose to collect more data in your implementation than the minimum for our SDK to function.

For the LaunchDarkly React Native SDK, you can use the privacy manifest included in the LaunchDarkly iOS Client SDK. The data usage information is the same for the two SDKs.

To learn more about Privacy Manifests, please refer to Apple Developer Documentation.

To learn more about Privacy Manifests specifically for React Native, please refer to this discussion.

Verifying SDK build provenance with the SLSA framework

LaunchDarkly uses the SLSA framework (Supply-chain Levels for Software Artifacts) to help developers make their supply chain more secure by ensuring the authenticity and build integrity of our published SDK packages. To learn more, see the provenance guide.

About LaunchDarkly

  • LaunchDarkly is a continuous delivery platform that provides feature flags as a service and allows developers to iterate quickly and safely. We allow you to easily flag your features and manage them from the LaunchDarkly dashboard. With LaunchDarkly, you can:
    • Roll out a new feature to a subset of your users (like a group of users who opt-in to a beta tester group), gathering feedback and bug reports from real-world use cases.
    • Gradually roll out a feature to an increasing percentage of users, and track the effect that the feature has on key metrics (for instance, how likely is a user to complete a purchase if they have feature A versus feature B?).
    • Turn off a feature that you realize is causing performance problems in production, without needing to re-deploy, or even restart the application with a changed configuration file.
    • Grant access to certain features based on user attributes, like payment plan (eg: users on the ‘gold’ plan get access to more features than users in the ‘silver’ plan).
    • Disable parts of your application to facilitate maintenance, without taking everything offline.
  • LaunchDarkly provides feature flag SDKs for a wide variety of languages and technologies. Read our documentation for a complete list.
  • Explore LaunchDarkly

Package Sidebar

Install

npm i @launchdarkly/react-native-client-sdk

Weekly Downloads

8,456

Version

10.1.2

License

Apache-2.0

Unpacked Size

165 kB

Total Files

113

Last publish

Collaborators

  • launchdarkly