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

# Get Started

> Installation and setup for the React Native SDK reference for Crossmint authentication

### Latest React Native SDK version - <a href="https://www.npmjs.com/package/@crossmint/client-sdk-react-native-ui" target="_blank" rel="noopener" style={{display: "inline-block", verticalAlign: "middle", textDecoration: "none", borderBottom: "none"}}><img src="https://img.shields.io/npm/v/@crossmint/client-sdk-react-native-ui" alt="npm" style={{display: "inline-block", verticalAlign: "middle", margin: 0}} noZoom /></a>

The Crossmint React Native SDK (`@crossmint/client-sdk-react-native-ui`) provides React Native providers and hooks for integrating Crossmint authentication into your mobile application, including email OTP, social login (OAuth), and session management.

## Installation

<Snippet file="client-sdk-react-native-ui-installation-cmd.mdx" />

## Provider Setup

Wrap your application with the required providers:

```tsx theme={null}
import {
    CrossmintProvider,
    CrossmintAuthProvider,
} from "@crossmint/client-sdk-react-native-ui";

function App() {
    return (
        <CrossmintProvider apiKey="YOUR_CLIENT_API_KEY">
            <CrossmintAuthProvider appSchema="myapp://">
                {/* Your app components */}
            </CrossmintAuthProvider>
        </CrossmintProvider>
    );
}
```

## Quick Example

Once providers are set up, use the `useCrossmintAuth` hook to access auth state:

```tsx theme={null}
import { useCrossmintAuth } from "@crossmint/client-sdk-react-native-ui";
import { View, Text, TouchableOpacity } from "react-native";

function LoginScreen() {
    const { loginWithOAuth, logout, user, status } = useCrossmintAuth();

    if (status === "initializing") return <Text>Loading...</Text>;

    if (user == null) {
        return (
            <TouchableOpacity onPress={() => loginWithOAuth("google")}>
                <Text>Sign in with Google</Text>
            </TouchableOpacity>
        );
    }

    return (
        <View>
            <Text>Welcome, {user.email}</Text>
            <TouchableOpacity onPress={logout}>
                <Text>Log out</Text>
            </TouchableOpacity>
        </View>
    );
}
```

## Next Steps

* [Providers](/sdk-reference/auth/react-native/providers) — Configure providers and their options
* [Hooks](/sdk-reference/auth/react-native/hooks) — Access SDK state via React hooks
