Learn how to use the Credential Provider from the Next-Auth Version 5. In this step-by-step video tutorial, you will learn to set it up and log in using email and password.
Hey, welcome back to another informative video from the "Full Stack With Next.js App Router" series. Let us build an app with social authentications. The video is your step-by-step tutorial on how to build a credential-based authentication system with server action and form handling.
I hope you enjoy this one the same way you liked the previous videos from the series.
Let's GO 🚀
- Catch up with the previous video on Next-Auth V5 Authentication with Google and GitHub Oauth2: https://www.youtube.com/watch?v=O8Ae6MC5bf4
I take special care to provide you the best quality. Please SUBSCRIBE to the channel to show your support. Also, could you like/comment on this video so that it reaches others? Thanks! 🫶
Timecodes
0:00 - Intro
00:46 - A Needed Refactoring
02:03 - Create Login Form
03:05 - Configure Credential Provider
04:24 - Local Data Store - Users
06:32 - Session Strategy
07:17 - The authorize Function
10:42 - The Server Action
13:28 - Update Login Form With Server Action
15:31 - Handle Successful Login
18:11 - Handle Login Error
19:21 - A Quick Recap
## Source Code on tapaScript GitHub:
- https://github.com/tapascript/learn-next-auth/tree/03-credential-auth
## Join tapaScript Discord
- https://discord.gg/YzUe4DbNAz
## 🤝 My Links:
- Blog: https://blog.greenroots.info/
- Follow on X(Twitter): https://twitter.com/tapasadhikary
- Connect on LinkedIn: https://www.linkedin.com/in/tapasadhikary/
- Follow My Work on GitHub: https://github.com/atapas
- Follow on Facebook: https://www.facebook.com/tapasadhi
## Special Links:
- Are you looking for the best NextJS templates to start your project development? Download and use them for FREE: https://www.wrappixel.com/templates/category/nextjs-templates/?ref=305&campaign=NextJStemplate
- If you are looking for the best content management system, here is something for FREE that you can rely on: https://app.caisy.io/app/signup/mwiyyiglk2er
## 👋 Like my work? Thank You. You can sponsor me from here:
- Sponsor Me: https://github.com/sponsors/atapas
- Sponsor my Blog: https://blog.greenroots.info/sponsor
## About Me:
Tapas Adhikary is an Educator at tapaScript, Tech enthusiast, Writer, YouTuber, and Open Source projects maintainer/contributor. He is a full-stack developer with vast experience in building SaaS solutions. He is the founder of the ReactPlay platform, which is driven by open-source projects and a fast-growing community.
You can find more about him at https://tapasadhikary.com.
#nextjstutorial
#next
#nextjs14
#nextauth
#authentication
#nextjs
#nextjs13
#nextjsapprouter
#thinkinginnextjs
#nextjstutorial
#next-auth
#authjs
## Credit
- The thumbnail uses a login form image that is by "sign in PNG Designed By 祭二 from https://pngtree.com/freepng/gradient-gray-login-interface_6523000.html?sol=downref&id=bef"