Skip to content

Mobile user authentication flow with React Native, Expo, and AWS Amplify: Sign In, Sign Up, Confirm Sign Up, Forget Password, Reset Password.

License

Notifications You must be signed in to change notification settings

youneshenniwrites/ReactNativeAuth

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

71 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React Native Authentication App

overview

Complete user authentication flow for mobile applications with React Native, Expo, AWS Amplify, react-navigation, and native-base.

Overview

The technologies used in this app are the following:

Authentication flow

  • Users are taken to the welcome screen.

  • Users can sign up, sign in, request a password change, navigate between screens.

  • International phone input is included in the sign up screen.

  • Users are redirected to the home screen after log in.

  • Users can navigate between screens using the bottom tab navigator or the drawer navigator.

  • Users are kept logged in until they sign out from the app.

Prerequisites

Configuring the project

  1. Clone this repo to your local machine.
git clone https://github.com/yhenni1989/ReactNativeAuth.git

cd ReactNativeAuth
  1. Initialise the AWS Amplify project.
amplify init

Follow the same instructions as below.

init

  1. Configure an Amazon Cognito User Pool to store users credentials.
amplify add auth

# When prompt, choose: Yes, use the default configuration.
  1. Time to deploy your project to AWS.
amplify push

Are you sure you want to continue? Yes

After few minutes of automated operations, the Amplify CLI will create an Amazon Cognito User Pool and Identity Pool to store users crendentials.

Running the application

  1. Install client dependencies.
yarn

# or

npm install
  1. Launch the React Native app in your simulator under your project directory.
expo start --ios

# or

expo start --android

Step by step tutorial

  • A full series of articles detailing the building process of this app can be found here.

  • A demo video of the authentication flow is found here.