> ## Documentation Index
> Fetch the complete documentation index at: https://dynamic-docs-feat-sidebar-revamp.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Adding React Native support

The way Dynamic integrates with React Native is by extending our [client](/react-native/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.

<Note>
  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.
</Note>

## Installation

Simply run the following in your terminal:

<Tabs>
  <Tab title="expo">
    ```bash Shell
    npx expo install @dynamic-labs/react-native-extension react-native-webview expo-web-browser expo-linking expo-secure-store
    ```
  </Tab>

  <Tab title="npm">
    ```bash Shell
    npm install @dynamic-labs/react-native-extension react-native-webview expo-web-browser expo-linking expo-secure-store
    ```
  </Tab>

  <Tab title="yarn">
    ```bash Shell
    yarn install @dynamic-labs/react-native-extension react-native-webview expo-web-browser expo-linking expo-secure-store
    ```
  </Tab>
</Tabs>

## Usage with React Native

First, extend your client with our extension:

```typescript
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:

```typescript
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](/react-native/package-references/react-native-extension).