React Native (Expo) SDK

Quick Start

The React Native (Expo) SDK provides React Native components and authentication for integrating Bible content into Expo apps on iOS and Android. It is built on top of the React (web) SDK, wrapping those components as Expo DOM Components while adding native affordances (bottom sheets, secure storage, navigation). See the source on GitHub.

Requirements

Expo SDK 56
A development build — this SDK relies on native modules and does not run in Expo Go.
A YouVersion Platform App Key — register your app to get one for free.

New to Expo? Scaffold an app with npx create-expo-app, then follow Expo's development builds guide to create a dev client. The steps below assume you are adding the SDK to an existing Expo app.

Getting Started

Get your App Key

Sign up at platform.youversion.com to get your free App Key. Expose it to your app, for example as an environment variable:
```
.env
EXPO_PUBLIC_YOUVERSION_APP_KEY=your_app_key
```
Install the SDK packages
- @youversion/platform-react-native-expo-ui — styled components (BibleCard, BibleReader, BibleTextView, VerseOfTheDay) and YouVersionProvider
- @youversion/platform-react-native-expo-core — authentication (useYVAuth) and storage; install both so TypeScript resolves the auth APIs
```
expo
npx expo install @youversion/platform-react-native-expo-ui @youversion/platform-react-native-expo-core
```
Install the peer dependencies

Expo will pick versions compatible with your SDK version:
```
Peer dependencies
npx expo install @gorhom/bottom-sheet @expo/dom-webview expo-secure-store \
  react-dom \
  react-native-gesture-handler react-native-mmkv \
  react-native-nitro-modules react-native-reanimated \
  react-native-safe-area-context react-native-svg \
  react-native-worklets
```
react-native-worklets is required because Expo SDK 56 ships Reanimated 4, which splits worklets into a standalone package.

react-native-webview is an optional peer dependency — install it only if you opt a component out of the default @expo/dom-webview with dom={{ useExpoDOMWebView: false }}.

Expo, React, and React Native are also peer dependencies, but your Expo app already provides them. When integrating into an existing app, make sure these dependencies resolve to a single version. Duplicate or mismatched versions are the most common source of setup issues.

Add the YouVersionProvider

Wrap your app's root with YouVersionProvider, and wrap that in GestureHandlerRootView. The provider's built-in bottom sheets depend on React Native Gesture Handler, so the gesture root must be the outer wrapper.


app/_layout.tsx
import { YouVersionProvider } from "@youversion/platform-react-native-expo-ui";
import { Stack } from "expo-router";
import { GestureHandlerRootView } from "react-native-gesture-handler";

export default function RootLayout() {
  const appKey = process.env.EXPO_PUBLIC_YOUVERSION_APP_KEY;

  if (!appKey) return null;

  return (
    <GestureHandlerRootView style={{ flex: 1 }}>
      <YouVersionProvider appKey={appKey} theme="system">
        <Stack screenOptions={{ headerShown: false }} />
      </YouVersionProvider>
    </GestureHandlerRootView>
  );
}

Common mistake: Forgetting YouVersionProvider, or rendering it outside GestureHandlerRootView, will cause the SDK components and hooks to throw errors that may not have an obvious solution.

Display a Bible verse


app/(tabs)/index.tsx
import { BibleCard } from "@youversion/platform-react-native-expo-ui";
import { SafeAreaView } from "react-native-safe-area-context";

export default function HomeScreen() {
  return (
    <SafeAreaView style={{ flex: 1, justifyContent: "center", padding: 16 }}>
      <BibleCard reference="JHN.3.16" versionId={3034} />
    </SafeAreaView>
  );
}

reference is a USFM reference (BOOK.CHAPTER.VERSE), and versionId is the Bible version (3034 is the Berean Standard Bible). These two identifiers show up across every component, so it's worth understanding them before you integrate further. See Components for the full component reference.

That's it! You now have Bible content in your Expo app.

Next steps

Components — every component and its props
Authentication — sign in with YouVersion
Copyright & Attribution — display required Bible version copyright
Sample app — a working Expo Router app with provider setup, auth, and every component

Last modified on July 20, 2026

Migration from Legacy Authentication Components

Requirements

Expo SDK 56

A development build — this SDK relies on native modules and does not run in Expo Go.

A YouVersion Platform App Key — register your app to get one for free.