Add Login to your React Native App

This Quickstart is for the Expo framework. To integrate Auth0 into your React Native application, please refer to the React Native Quickstart

To use Auth0 services, you need to have an application set up in the Auth0 Dashboard. The Auth0 application is where you will configure authentication in your project.

Configure an application

Use the interactive selector to create a new Auth0 application or select an existing application that represents the project you want to integrate with. Every application in Auth0 is assigned an alphanumeric, unique client ID that your application code will use to call Auth0 APIs through the SDK.

Any settings you configure using this quickstart will automatically update for your Application in the Dashboard, which is where you can manage your Applications in the future.

If you would rather explore a complete configuration, you can view a sample application instead.

Configure Callback URLs

A callback URL is the application URL that Auth0 will direct your users to once they have authenticated. If you do not set this value, Auth0 will not return users to your application after they log in.

Configure Logout URLs

A logout URL is the application URL Auth0 will redirect your users to once they log out. If you do not set this value, users will not be able to log out from your application and will receive an error.

In this section, you will learn how to install the React Native Auth0 module.


yarn add react-native-auth0

Was this helpful?



npm install react-native-auth0 --save

Was this helpful?


The Auth0 package runs custom native code that must be configured at build time. Use Expo Config Plugin to achieve this.

The react-native-auth0 plugin will be added in the Expo config

You must generate the native code for the above configuration to be set. To do this, run the following command:

expo prebuild

Was this helpful?


You will be prompted to provide the Android package and iOS bundle identifier if they are not already present in the Expo config:

? What would you like your Android package name to be? > com.auth0samples

? What would you like your iOS bundle identifier to be? > com.auth0samples

Was this helpful?


These values are used to set the callback and logout URLs.

The useAuth0 hook relies on a React Context to provide state management. This context is provided by the Auth0Provider component.

Import the useAuth0 hook and Auth0Provider component from the react-native-auth0 package:

import {useAuth0, Auth0Provider} from 'react-native-auth0';

Was this helpful?


For the SDK to function properly, you must wrap your application in the Auth0Provider component, and set the following properties:

  • domain: The domain of your Auth0 tenant. Generally, you can find this in the Auth0 Dashboard under your Application's Settings in the Domain field. If you are using a custom domain, you should set this to the value of your custom domain instead.
  • clientId: The ID of the Auth0 Application you set up earlier in this quickstart. You can find this in the Auth0 Dashboard under your Application's Settings in the Client ID field.

Your Auth0Provider component should now be properly configured. Run your application to verify that:

  • the SDK is initializing correctly
  • your application is not throwing any errors related to Auth0

Authenticate the user by calling the authorize method provided by the useAuth0 hook. This redirects the user to the Auth0 Universal Login page for authentication, then back to your app.

For confirmation that the user was logged in successfully, check that the user property provided by the hook is not null.


Add a button component that calls authorize when clicked. Verify that you are redirected to the login page and then back to your application.

To log the user out, redirect them to the Auth0 logout endpoint by calling clearSession. This will remove their session from the authorization server and log the user out of the application.


Add a logout button that calls clearSession and observe that you are redirected to the Auth0 logout endpoint and back again. You should no longer be logged in to your application.

The useAuth0 hook exposes a user object that contains information about the authenticated user. You can use this to access user profile information about the authenticated user that has been decoded from the ID token.

If a user has not been authenticated, this property will be null.


Log in and inspect the user property on the result. Verify the current user's profile information, such as email or name.

Next Steps

Excellent work! If you made it this far, you should now have login, logout, and user profile information running in your application.

This concludes our quickstart tutorial, but there is so much more to explore. To learn more about what you can do with Auth0, check out:

Did it work?

Any suggestion or typo?

Edit on GitHub
Sign Up

Sign up for an or to your existing account to integrate directly with your own tenant.