# React Native surveys installation - Docs

1.  1

    ## Install the package

    Required

    Install the PostHog React Native library and its dependencies:

    PostHog AI

    ### Expo

    ```bash
    npx expo install posthog-react-native expo-file-system expo-application expo-device expo-localization
    ```

    ### yarn

    ```bash
    yarn add posthog-react-native @react-native-async-storage/async-storage react-native-device-info react-native-localize
    # for iOS
    cd ios && pod install
    ```

    ### npm

    ```bash
    npm i -s posthog-react-native @react-native-async-storage/async-storage react-native-device-info react-native-localize
    # for iOS
    cd ios && pod install
    ```

2.  2

    ## Configure PostHog

    Required

    PostHog is most easily used via the `PostHogProvider` component. Wrap your app with the provider:

    App.tsx

    PostHog AI

    ```jsx
    import { PostHogProvider } from 'posthog-react-native'
    export function MyApp() {
        return (
            <PostHogProvider
                apiKey="<ph_project_token>"
                options={{
                    host: "https://us.i.posthog.com",
                }}
            >
                <RestOfApp />
            </PostHogProvider>
        )
    }
    ```

3.  3

    ## Send events

    Recommended

    Once installed, PostHog will automatically start capturing events. You can also manually send events using the `usePostHog` hook:

    Component.tsx

    PostHog AI

    ```jsx
    import { usePostHog } from 'posthog-react-native'
    function MyComponent() {
        const posthog = usePostHog()
        const handlePress = () => {
            posthog.capture('button_pressed', {
                button_name: 'signup'
            })
        }
        return <Button onPress={handlePress} title="Sign Up" />
    }
    ```

4.  4

    ## Install surveys dependencies

    Required

    Other than the PostHog SDK, Surveys requires a few additional dependencies to be installed.

    PostHog AI

    ### yarn

    ```bash
    yarn add react-native-safe-area-context react-native-svg
    ```

    ### npm

    ```bash
    npm i -s react-native-safe-area-context react-native-svg
    ```

5.  5

    ## Add the surveys provider

    Required

    Add `PostHogSurveyProvider` to your app anywhere inside `PostHogProvider`. This component fetches surveys. It also acts as the root for where popover surveys are rendered.

    App.tsx

    PostHog AI

    ```typescript
    <PostHogProvider /*... your config ...*/>
      <PostHogSurveyProvider>{children}</PostHogSurveyProvider>
    </PostHogProvider>
    ```

    If you're not using the `PostHogProvider`, add `PostHogSurveyProvider` to your app anywhere inside your app root component.

    App.tsx

    PostHog AI

    ```typescript
    <YourAppRoot>
      <PostHogSurveyProvider>{children}</PostHogSurveyProvider>
    </YourAppRoot>
    ```

    You can also pass your `client` instance to the `PostHogSurveyProvider`.

    App.tsx

    PostHog AI

    ```typescript
    <PostHogSurveyProvider client={posthog}>
        {children}
    </PostHogSurveyProvider>
    ```

6.  6

    ## Next steps

    Recommended

    After installing the PostHog SDK, you can create your first survey.

    | Resource | Description |
    | --- | --- |
    | [Creating surveys](/docs/surveys/creating-surveys.md) | Learn how to build and customize your surveys |
    | [Targeting surveys](/docs/surveys/targeting.md) | Show surveys to specific users based on properties, events, or feature flags |
    | [How to create custom surveys](/tutorials/survey.md) | Build advanced survey experiences with custom code |
    | [Framework guides](/docs/surveys/tutorials.md#framework-guides) | Setup guides for React, Next.js, Vue, and other frameworks |
    | [More tutorials](/docs/surveys/tutorials.md) | Other real-world examples and use cases |

    You should also [identify](/docs/product-analytics/identify.md) users and [capture events](/docs/product-analytics/capture-events.md) with PostHog to control who and when to show surveys to your users.

    Not all survey features are available on every SDK. See the [SDK feature support matrix](/docs/surveys/sdk-feature-support.md) for a full comparison.

## Supported Features

Not all survey features are available on every SDK. See the [SDK feature support matrix](/docs/surveys/sdk-feature-support.md) for a full comparison.

## Troubleshooting

-   Update your SDK.
-   Run a clean build if you experience issues.
-   For surveys not shown, be sure to set up the [surveys provider](/docs/surveys/installation/react-native.md#step-three-add-the-surveys-provider).
-   If you have enabled surveys using feature flags, the flags are evaluated on the device once the PostHog SDK starts as early as possible. The SDK might be using the cached flags from the previous SDK start. If you have changed the flag or its condition, kill and reopen the app to force a new SDK start at least once.
    -   This will also happen in production, and you might experience some delay for the new flag/conditions to take effect on your users.
    -   Survey feature flag evaluation does not capture `$feature_flag_called` events, so the `Usage` tab on the feature flag page won't show anything.

### Community questions

Ask a question

### Was this page useful?

HelpfulCould be better