Free GitHub Source Code: https://www.papareact.com/otpcode
Join the world’s BEST developer course & community “Zero to Full Stack Hero” NOW: https://www.papareact.com/course
LOOKING FOR THE CODE FROM MY OTHER BUILDS?
https://links.papareact.com/github
Join me as I show you how to implement Phone OTP Authentication using Firebase Authentication. You'll learn the following in this video:
What is Firebase Authentication and How to Set it up
How to Implement Firebase Authentication to send an OTP SMS to any Phone Number
How to Implement the ability to verify the OTP sent to your phone to Login the User
How to Implement reCAPTCHA for the OTP Form
Implementing Error Handling for the OTP Input Form
How to Implement HigherOrder Components to get the User's Authentication State
WANT TO LISTEN TO THE EXCLUSIVE PAPAFAM PLAYLIST?
Sign up for the PAPAFAM Newsletter here https://links.papareact.com/newsletter
FOLLOW ME HERE:
Instagram: https://links.papareact.com/instagram
Facebook: https://links.papareact.com/facebook
LinkedIn: https://links.papareact.com/linkedin
Twitter: https://links.papareact.com/twitter
Discord: https://links.papareact.com/discord
WANT TO SUPPORT THE CHANNEL?
Donate here: https://links.papareact.com/donate
Grab some PAPAFAM Merch: https://links.papareact.com/merch
TIMESTAMPS:
00:00 Introduction
00:23 Setting Up Firebase Authentication
03:15 Implementing Shadcn
04:17 Building the OTP Login Component
06:21 Implementing the OTP Count Down Timer
07:41 Implementing reCAPTCHA
08:30 Implementing the OTP SMS Feature
16:14 Implementing the OTP Verification Feature
23:14 How to Implement a HigherOrder Component to get the User’s Authentication State
28:53 Full OTP Feature Demo
29:56 Lesson Summary
30:16 Zero to Full Stack Hero
30:35 Outro
Let’s get it PAPAFAM .
#nextjs #OTP #firebase #ios #android #google #tutorial #typescript #testing #reactjs #javascript #nextjs15 #phone #shadcn