> ## Documentation Index
> Fetch the complete documentation index at: https://docs.embeddables.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Embed in a React Native app

> How to publish your Embeddable inside a React Native app

Embedding your Embeddable in a React Native app involves using the WebView
component that comes as part of the `react-native-webview` library.

We use `WebView` to embed an Embeddables preview URL, since we can't pass HTML
directly into the `WebView`.

<Tip>
  Looking for other ways to publish your Embeddable? Check out the [Publish to your site](/features/publish-to-your-site) guide.
</Tip>

<Steps>
  <Step title="Install the react-native-webview library">
    If you don't already have it installed, run:

    ```shell theme={null}
    npm i react-native-webview
    ```
  </Step>

  <Step title="Import WebView into your React file">
    ```javascript theme={null}
    import { WebView } from "react-native-webview";
    ```
  </Step>

  <Step title="Insert a WebView">
    ```javascript theme={null}
    <WebView
      source={{
        uri: "https://engine.embeddables.com/preview/flow_abcdefhijklm",
      }}
    />
    ```
  </Step>

  <Step title="Optional: Give it dimensions">
    If you can't see it initially, make sure to give it some styles
    to ensure that it has non-zero zero dimensions:

    ```javascript theme={null}
    <WebView
      style={{
        width: 400,
      }}
      source={{
        uri: "https://engine.embeddables.com/preview/flow_abcdefhijklm",
      }}
    />
    ```
  </Step>

  <Step title="Optional: Pass properties into User Data">
    To pass User Data properties into the Embeddable, include them in the URL as URL params.

    In the Builder, make sure to add those keys into the Embed URL settings of the Embeddable.

    ```javascript theme={null}
    <WebView
      source={{
        uri: "https://engine.embeddables.com/preview/flow_abcdefhijklm?my_key=my_value",
      }}
    />
    ```
  </Step>
</Steps>

## Embedding in a website or React app?

<CardGroup cols={2}>
  <Card title="Embed in your site" icon="code" href="/how-to/embed-in-your-site">
    How to publish your Embeddable to your site
  </Card>

  <Card title="Embed in a Webflow site" icon="webflow" href="/how-to/embed-in-your-webflow-site">
    How to publish your Embeddable to your Webflow site
  </Card>

  <Card title="Embed in a WordPress site" icon="wordpress" href="/how-to/embed-in-your-wordpress-site">
    How to publish your Embeddable to your WordPress site
  </Card>

  <Card title="Embed in a Framer site" icon="framer" href="/how-to/embed-in-your-framer-site">
    How to publish your Embeddable to your Framer site
  </Card>

  <Card title="Embed in a React app" icon="react" href="/how-to/embed-in-react">
    How to publish your Embeddable inside a React app
  </Card>
</CardGroup>

***

<Note>Typescript samples will be added to this page soon</Note>