Get Started

npx expo install @crossmint/client-sdk-react-native-ui expo-constants expo-device expo-secure-store expo-web-browser react-native-get-random-values react-native-webview

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>
    );
}

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>
    );
}