Passwordless Authentication Tutorial - Say Goodbye to Passwords
In this tutorial, we'll dive deep into the world of passwordless authentication, revolutionising the user login experience. No more forgetting and resetting passwords! Learn how to implement a full authentication flow solely based on emails. Even if the user is a newbie or a returning visitor, this method automatically tailors the experience for them. We'll guide you through sending a one-time password (OTP) to the user's email using Amazon AWS SES, verifying it, and seamlessly authenticating them in the application. Ready? Let's get started🚀
This video includes a lot of tools and technologies, providing an excellent opportunity to learn about:
- Implementing passwordless authentication with React Native.
- Integration of Amazon AWS's SES for secure email OTPs.
- Streamlining user experience with email-only logins.
- Best practices for AWS SES within a React Native environment.
- Advanced techniques for ensuring secure and seamless authentication flows.
Timecodes:
0:00 Intro
0:27 The Authentication Flow
2:54 Stepzen
3:33 Adjusting and defining the database schema
8:33 Defining the authentication router, generating email tokens
18:03 Implementing the Authentication
19:11 Generating the Email Token
24:41 Validating the User in the Database
35:26 Restricting unauthenticated users from accessing the API; Assigning new objects to the user that is authenticating
55:16 Sending the token(OTP) to the user's email
1:12:58 Creating the User Interface for the paswordlessa authentication
1:15:00 User Interface for the Login Page
1:17:37 User Interface for the Authentication Page
1:22:12 Implementing the Backend requests
1:44:42 Making sure that the API is using the Auth Token from the context provider
1:51:59 Outro
Source code:
Backend: https://github.com/notJust-dev/TwitterBackend
Frontend: https://github.com/notJust-dev/Twitter
🔗 Links mentioned:
https://reactnavigation.org/docs/auth-flow/
https://docs.expo.dev/router/reference/authentication/
#passwordless #reactnative
