Firebase Authentication Example for React Native

Thank you for trying the Firebase Authentication example 👏

Just want to try it? It's live right here. Go play!

Please note that limited support is offered for this example though we will happily accept PRs.

The following authentication features are ready for use in this example:

Sign In
Sign Out
Create account
Forgot Password
Sign in with social auth providers
Sign in with phone auth (with country selection)
Linking social profiles
Change Password
Email verification
Updating user profile
Firebase email templates configured to match device locale

and the following providers:

Email / Password Sign In
Phone Auth via SMS
Apple (Native, iOS only, PRs needed for web support)
Facebook (Native only, PRs needed for web support)
Google (Native only, PRs needed for web support)

This template creates an app that comes out of the box ready with typescript and react-native-web support, based on the Luna template

This template also has single-source theme configuration and light/dark switching configured to follow system preference, as well as dynamic detection of user locale and an included translation system (English and Spanish translations to demonstrate how it works)

It's ready to go for a modern-looking international app.

Getting started

Ensure your development environment is set up for React Native by following the React Native documentation.

Create an app using the template

For a quick demonstration, this template is pre-configured with a firebase project called ProjectName, if you just want to see it work, run `npx react-native init ProjectName --template invertase/react-native-firebase-authentication-example
For a real project, replace ProjectName in the init command with your new project's real name, then follow the configuration instructions below

Android: Setting up App Signing

Google Sign-In requires a keystore file to be added to your project and the Firebase console for both debug and release builds, we've included a debug one by default. To setup a new keystore file, follow the guide here.

Add your Firebase credentials

Choose your existing Firebase project from the Firebase console.

Creating a new project? Check out the React Native Firebase documentation.
Replace the native Firebase credentials template files to your project by following documentation for Android and iOS.
Copy the web config from Firebase console into src/shims/firebase-init.ts

Run the app

Start the metro javascript bundler: yarn start
For android: yarn android
For apple: yarn ios
For web: yarn web
For testing (jest): yarn test:all
For linting (format, lint, typescript): yarn lint:all

Authentication Providers

The Firebase Authentication Example supports multiple authentication providers.

Follow the links below for documentation on setting up each provider: