Skip to content
This repository has been archived by the owner on Oct 14, 2023. It is now read-only.
/ expo-supertokens Public archive

📱 A template for your next React Native project: Expo, Supertokens Auth, Tamagui, EAS and expo router.

Notifications You must be signed in to change notification settings

lukesthl/expo-supertokens

Repository files navigation

React Native Expo Template with Supertokens Authentication

This project template provides a starting point for developing a React Native application with Expo and Supertokens to authenticate. It includes prebuilt screens for various authentication functionalities such as sign in, sign up, change password, change email, delete account, and forgot password.

Demo

Sign in with Email and Password:

Sign in with Github:

Key Features:

  • Sign in with Apple, GitHub, Google, or Email and Password: The authentication flow supports multiple sign-in options using Supertokens.
  • Role Management: You can manage user roles and permissions within your application using Supertokens.
  • Internationalization: It includes built-in support for internationalization with typesafe i18next.
  • Deep Linking: Connect your app to a website by adding support for deep linking.
  • Expo Router v2: It utilizes Expo Router, a versatile routing solution for navigating between screens in your application.
  • Tamagui: You can leverage the Tamagui library within this template to enhance the UI and user experience of your React Native app.
  • mobx: It uses mobx for state management.
  • iOS Support: The template ensures compatibility and support for iOS devices.

Getting Started

To use this template, follow the steps below:

  1. Clone the repository
    git clone https://github.com/lukesthl/expo-supertokens
  2. Install dependencies
    npm install
  3. Configure the Supertokens Backend with your authentication providers (Apple, GitHub, Google, etc.)
    Backend Setup Guide
  4. Setup environment variables:
  • cp .env.example .env

  • Update the necessary environment variables for Supertokens configuration. For example:

    EXPO_PUBLIC_API_URL=<your-api-url>
    EXPO_PUBLIC_GITHUB_CLIENT_ID=<your-github-client-id>
    ASSOCIATED_DOMAIN=<applinks:your-api-url> // for deep linking (without https://)
    GOOGLE_SERVICES_FILE=<path-to-google-services.json>
    GOOGLE_SIGNIN_IOS_CLIENT_ID=<your-google-signin-ios-client-id>
    
  1. EAS Configure
    eas build:configure
  2. Setup the secrets needed in app.config.ts in Expo's Website
    https://expo.dev/accounts/%5Baccount%5D/projects/%5Bproject%5D/secrets
  3. EAS Build Setup (Simulator)
    eas build -p ios --profile simulator
  4. Select the simulator build and install it on the simulator
    eas build:run
  5. Start Expo Dev Client
    npx expo start --dev-client

Customizing the Prebuilt Screens

The template comes with prebuilt screens for various authentication functionalities. You can customize these screens based on your application's branding and design requirements. The relevant files can be found in the app/(app)/auth directory.

Known Issues

  • expo router deep link broken when app is running in foreground: expo/router#818

Roadmap

  • Add support for Android devices (Deep Linking, Sign in with Apple, etc.)
  • Add support for Expo Web

Learn more

About

📱 A template for your next React Native project: Expo, Supertokens Auth, Tamagui, EAS and expo router.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published