Skip to main content
The way Dynamic integrates with React Native is by extending our client with the React Native Extension. This adds the reactNative module, which provides access to a webview component that must be rendered to your app.
Since our client was built with a modular approach, each extension must be installed as a separate package, so to keep the client’s package size to a minimum.

​
Installation

Simply run the following in your terminal:
Shell
npx expo install @dynamic-labs/react-native-extension react-native-webview expo-web-browser expo-linking expo-secure-store

​
Prebuild (Expo) / Native linking

Since our SDK relies on native modules (e.g. react-native-webview, expo-secure-store), you need to rebuild the native layer of your app after installing.
This SDK is not compatible with Expo Go. Expo Go does not support custom native modules. You must use a development build, EAS Build, or a bare React Native workflow.
If you’re using Expo with a managed workflow, run:
Shell
npx expo prebuild
Then rebuild your app with npx expo run:ios or npx expo run:android.

​
Usage with React Native

First, extend your client with our extension: 
import { ReactNativeExtension } from '@dynamic-labs/react-native-extension';

export const dynamicClient = createClient({
  environmentId: 'YOUR-ENVIRONMENT-ID',
}).extend(ReactNativeExtension());
Next, render the webview injected into the client by the extension: 
import { dynamicClient } from '<path to client file>';

export function App() {
  return (
    <>
      <dynamicClient.reactNative.WebView />

      <SafeAreaView>
        { ... }
      </SafeAreaView>
    </>
  )
}
You can read more about our react native package here.