I am telling you this seriously. I have watched 20+ videos on RUclips about the same. All the time things didn`t worked out. But today i completed your video and trust me on this, your tutorial is the best tutorial in the whole world. Just wanted to say you thank You friend............
Just found your channel and subscribed, i like how your tutorials are long and in depth about concepts to understand instead of just project tutorials, and i dont think 10 or 15 minute short videos can do the same.
Wow I just happily spend 5 hours watching and rewatching this video and I learned a lot. I don't know why I enjoyed some much. Thank Brett, you just earn a new loyal suscriber❤
Hey Brett, I wanted to thank you for the very comprehensive video. Authentication is always a messy topic, and it's very appreciable how you explained not only credentials but also social login. Thanks again
Thank you for the video! When registering, you need to block the form submit button after clicking, since you can spam the button and there will be many identical users in the database, you also need to add a check on the server when creating. Also, do not add your .env file to the repository. Now you have data that other users can use for authorization, be careful
@@brettwestwooddeveloper I have come across simple role based authentication videos but not ultimate guide per say. Role based authentication of user and admin using mongodb, prisma and next-auth. The major point of learning can be how to secure pages and then give access to certain routes only to the admin . For example: home and dashboard should be a protected route but only admin can access the dashboard.
Simply FABULOUS !!! THANK YOU SO VERY MUCH !!! I followed along. Perfect. You showed every nitty-gritty, were not too fast, not too slow, did not switch screens/windows suddenly (which confuses us, the beginners), were describing what you were doing, where you were doing, and why you were doing. Once more, THANK YOU !!!
This is a great and very helpful video, going through several different ways of logging in a user. Just one thing though… it’s not Prism. It’s very clearly PrisMA.
Was scratching my head for this, using both credentials and social medias. Dude you just killed it, watched from zero to last seconds. Time to fight with TS into it 😊 Thanks buddy, thanks a lot ❤ Greetings from Tanzania 🇹🇿
Good job sir really impressive content. Thank you very much for sharing. 1. On a purely cosmetic side, in the login page, instead of the h1 "Sign into Github below" , I would rather change the button label to "Sign into Github". Same goes true for Google. 2. Are you planning to add a "reset forgotten passwords" functionality, since this is the "Ultimate" guide ? Best regards.
In the async authorize(credentials) function, I would fetch an API login. It's more clear for me. There is an API to register and there is an API to login.
@@brettwestwooddeveloper I don't understand why it's not working automatically when I am using the adapter. Should I have to change anything for the session table to get populated automatically? plz help
Thank you for the nicely structured and detailed tutorial. I just couldn't understand how the signin to OAuth providers created the Account and User documents in mongodb.
My most recent videos go more in depth about session data/object. I would recommend console logging profile, user, session and all to see what data you get back
Great video. Great job explaining each step and also showing how the network side of things looks in the browser console/tools. Thanks so much! I just subscribed!
Thank you and you just have to create a middleware file on the root of the whole project. export { default } from "next-auth/middleware" export const config = { matcher: ["/dashboard"] } This protects the dashboard page
@@brettwestwooddeveloper Ok thank you. I already watch in another video. It has two option server side or client side. Glad to watch your video and help
Hey Brett, amazing tutorial, one question, why you dind't use the Session model that next-auth provides as a starter code for prisma schema? (I guess its because that if we use jwt, the sessions will not be saved on the db)
@@younkezenger8117 Session only is used when you implement google/github auth options, so instead of only creating a user you also create a session. Hope this helps
I would watch this one first because it goes over everything. There is a new version of Next-Auth which is in beta. However, you can still use this video as a guide and is still relevant. I have other videos as well on my channel going over the session object and much more!
Hey, love the videos. They are really helpful and concise. I was wondering if you could possibly make a video on what changes would have to be made to the application when its being pushed into production (i.e. changing specific environment variables, etc)
at 25:41 when i try to sign in it gives me an error. Says: "Sign in failed. Check the details you provided are correct." But in inspector it has 302 Found
It's a truly informative and well-made video. I still have two lingering questions. First, what difference does it make in the underlying operation of Next Auth if we don't specify 'jwt' as a strategy? Second, why didn't you touch upon the topic of Middleware? It's crucial for user experience.
Great tutorial!!! One of the best I've seen. Quick question : How would you make an admin account that would see all other account is some sort of table?
thank you! and you would have to create a custom value for admin signups through the login functionality. I would have to look into it more, and when I get good with it I can create a video on that topic. That is a very good topic that would be helpful!
i loved this ... and i added next auth to my project. but i still dont know how to protect a sever side page... i am getting error in my seversideprops
This is the best tutorials I have seen on RUclips Awesome! Could you tell me the reason why we need to add "/test" url at the end of the DATABASE_URL? Thank YOu!!
@@brettwestwooddeveloper i just finished and its really alot of information to digest, especially the way the google and github user is added to the database )): but overall I loved it
Excellent tutorial. Unfortunately its not completed without JWT token option. Btw, you must modify your system environment for RUclips tutorials. I mean your display resolution must not exceed 1080 HD Now all your screen texts are very tiny and makes a lot of eye strain.
After route protection, when I write the login route manually in the search bar, it will show the login page for a while and then disappear which is not a good user experience.
If you are calling the user on the client side with the useSession hook. Then it will cause that. You must fetch the user on server with the getServerSession. I am assuming you are calling the session client side?
no I don't but you will have to refactor your code so your page is a server component and then fetch the session on the server. Then any client components necessary. Impot them into the server page. Does that make sense? @@dailyWalker1
Thank you for the explanation, just a question please, when user register he actually doesn't get auth cookies, he needs to signin after that to get them right? If yes, is there a way to tweak that, would be nice if user can register and start using his dashboard for example. Thank you again.
Idk if someone else asked... I don't know much about Prisma, but is there a reason ti pick it over Mongoose? I thought Prisma is more suited for SQL db's. I just started the vid but this seems like it is what I was after.
why cant i get fields other than name , email in the session? i tried returning user object with a field of Contact from [...nextauth] page too. but it is not carried into home page. btw Thanks for such a comprehensive tut. :)
Thank you for tuning in, and by default you only get the name and email in the session. You must use the JWT strategy and then pass the data through the jwt to the session using asyn callbacks. I have a video on this: ruclips.net/video/bkUmN9TH_hQ/видео.html
i have been using this procedure for some apps but now i have been facing an issue. The signup with google isnt working directly in api/auth/signup unless i remove the // adapter: PrismaAdapter(prisma) line in nextauth route. The signin with google isnt working at all from the login page in (site) folder. If there are any changes we should do then itll be really great because i have tried alot of stuff but nothing worked out for me. Youre a great teacher :)@@brettwestwooddeveloper
Hi, can you do a really short video showing us how to setup a DELETE api route handler with and without prisma or at least with prisma. The new way in next13(app) is a bit confusing. Thanks for the content!
Thank you for the great video, it helped a lot, but I have a problem regarding google auth, when I log in with google the first time and log out, the next time i try to login with google it automatically logs in with that account, it doesnt let the user choose another one I already tried a lot of things and nothing seems to work Thanks a lot again, great video!!
@@brettwestwooddeveloper Thank you very much. I'm building a personal project solo. And your video has been very helpful in setting up an auth system. My issue is that I have my nextjs project live now on vercel with a domain name. And I'm confused because I don't know what to set as the authorized redirect url. localhost:3000 or my new domain name. Do we need to click "publish app" for live projects on oauth consent screen?
Hey Brett, I've seen other tutorials where "mongoose" is used. I'm new to react/next etc...am I right in saying "mongoose" and "prisma" help setup schema's ? so we can use one or the other? if this is true, whats the benefits of using prisma ?
Mongoose is a false layer of security, it gives no benefits apart from abstraction of the default mongodb sdk. You can send whatever the frick you want to your mongodb, and that's not ideal, so SQL is usually better than Mongodb. When I say usually, I mean 99.99% of the times.
I want to plzzzz ask u a question. How can I use NextAuth with Google to authenticate the user and then pass the session to NestJS project to authenticate the user there also so I can use the guards' features in NesfJS. There are no guides or tutorials about this at all
is there any way to prompt the custom errors in the register router? because something went wrong doesn't make sense, the user wants to know what is wrong.
Maaaan this literally saved my life. I was struggling to get both credentials with next auth working, but it does now. THANK YOU SOOOO MUCH
WOW THANK YOU this really really helped it was super clear and easy to follow
Thank you so much! I am glad you were able to follow my teachings easily! Thanks for tuning in and the donation!
I am telling you this seriously. I have watched 20+ videos on RUclips about the same. All the time things didn`t worked out. But today i completed your video and trust me on this, your tutorial is the best tutorial in the whole world. Just wanted to say you thank You friend............
Thank you so much! Glad I could help you out
Wow. Great video. I had to go through it twice to get everything right (I used typescript)
you just saved my final year project man!!!! Thank You 1000 times
No problem! Glad I could help you out!
Very useful. Appreciated showing both server and client auth
No problem!
the most comprehensive NextAuth tutorial, well done Brett!
Thank you so much!
One of the best tutorials I have seen on RUclips, you explained everything perfectly and in detail, looking forward to your next videos!
Thank you so much for the kind words!
You don't have no idea how much i need this, thank you. Clear and concise
No problem, glad I could help you!
Just found your channel and subscribed, i like how your tutorials are long and in depth about concepts to understand instead of just project tutorials, and i dont think 10 or 15 minute short videos can do the same.
Welcome aboard!
Wow I just happily spend 5 hours watching and rewatching this video and I learned a lot. I don't know why I enjoyed some much. Thank Brett, you just earn a new loyal suscriber❤
Thank you so much! I am glad you learned a lot!
I think this is what i need to be mid after almost 2 yers of commercial work and more years hobby coding ;)
Ty!
I did this hundred of times, but this is the first time I actually understand how it works. Thanks! you're a great teacher.
Awesome! Thank you! and no problem!
Really Awesome walk through for the Next Auth. Learned alot. Thanks
No problem! Thanks for tuning in!
Hey Brett, I wanted to thank you for the very comprehensive video.
Authentication is always a messy topic, and it's very appreciable how you explained not only credentials but also social login. Thanks again
Thank you so much for the kind comment!
Incredible brother 🙌🙌
Thank you!
My search is over. Thank you Brett, great session
Thank you!
You're an amazing teacher, and this is premium content. The way you explain every step makes it feel like a one on one class. Thank you!
Thank you so much!
Thank you for the video!
When registering, you need to block the form submit button after clicking, since you can spam the button and there will be many identical users in the database, you also need to add a check on the server when creating.
Also, do not add your .env file to the repository. Now you have data that other users can use for authorization, be careful
Your channel deserves more attention!
10/10 explanation!
Thank you!
watching after 1 year but thanks bro learned a lot
Thanks you so much for this video. Can you please make video on role based authentication?
No problem! And yes I can take a look into that, so something like admin login, user login, etc? protecting routes?
@@brettwestwooddeveloper I have come across simple role based authentication videos but not ultimate guide per say.
Role based authentication of user and admin using mongodb, prisma and next-auth. The major point of learning can be how to secure pages and then give access to certain routes only to the admin .
For example: home and dashboard should be a protected route but only admin can access the dashboard.
Great tutorial, Brett! I am glad I found your channel. Thanks!
Awesome, thank you!
By far the best nextAuth tut
Thank you!
This is a great explanation of next-auth , thank you brother.
You are welcome!
this is fucking gold, you earned an instant subscriber!
Thanks for the sub! Appreciate it!
@@brettwestwooddeveloper don't even mention it, you greatly deserved it bruh
Simply FABULOUS !!! THANK YOU SO VERY MUCH !!! I followed along. Perfect. You showed every nitty-gritty, were not too fast, not too slow, did not switch screens/windows suddenly (which confuses us, the beginners), were describing what you were doing, where you were doing, and why you were doing. Once more, THANK YOU !!!
Thank you so much for the kind words and tuning in!
The best tutorial I found so far about Next 13 authentication. Everything was explained clear. Thank you so much ...🙏😍😍
Thank you! You are welcome!
This is a great and very helpful video, going through several different ways of logging in a user. Just one thing though… it’s not Prism. It’s very clearly PrisMA.
Thanks!
Best video on Internet. The latest greatest. I was bit confused about implementation using app/ directory thanks!!!
Thank you so much for the compliment!
Thanks Brett. Your tutorial is quite easy to follow. You've made very simple.
Thank you very much, there are very few tutorials like this one implementing auth with the App Router, and it works perfectly fine!
Thank you! Glad I can help!
Loved the tutorial
Thank you!
Honestly, this guy is dope. I love this tutorial. ❤❤
Thank you!
Was scratching my head for this, using both credentials and social medias. Dude you just killed it, watched from zero to last seconds. Time to fight with TS into it 😊
Thanks buddy, thanks a lot ❤
Greetings from Tanzania 🇹🇿
No problem! Thanks for tuning in!
Love it great work, thank you so much
You are welcome! Thanks for tuning in!
Very detailed video. Thank you so much.
Thank you for the tutorial.
You are welcome!
Thank you for sharing this insightful video.
No Problem!
one of the best tutorials I've seen
Thank you so much!
this is so sick bro thank you
No problem!
this is what I've been looking for after the update of nextjs, now i can implement this to my capstone project, thank you for this tutorial!
Glad I can help!
Good job sir really impressive content. Thank you very much for sharing.
1. On a purely cosmetic side, in the login page, instead of the h1 "Sign into Github below" , I would rather change the button label to "Sign into Github". Same goes true for Google.
2. Are you planning to add a "reset forgotten passwords" functionality, since this is the "Ultimate" guide ?
Best regards.
crystal clear explanation. easily understanding even for non English speaking country. thanks man. more love from india
Thank you! I am glad I can help! Thanks for the support
This is Exactly what i am looking for and great explanation from you, Thank you.
No problem! Glad I could help!
In the async authorize(credentials) function, I would fetch an API login. It's more clear for me. There is an API to register and there is an API to login.
Curious why you didn't use the session model? As is suggested in the Next Auth docs on the Prisma adapter.
Should have for tutorial purpose. But either way is fine. Definitely recommend using the adapter.
@@brettwestwooddeveloper I don't understand why it's not working automatically when I am using the adapter. Should I have to change anything for the session table to get populated automatically? plz help
Thankyou so much sir ,this video is really helped me
No problem! Thank you for watching my video! Don't forget to hit that subscribe!
Thank you for the nicely structured and detailed tutorial. I just couldn't understand how the signin to OAuth providers created the Account and User documents in mongodb.
My most recent videos go more in depth about session data/object. I would recommend console logging profile, user, session and all to see what data you get back
Great video. Great job explaining each step and also showing how the network side of things looks in the browser console/tools. Thanks so much! I just subscribed!
Keep up the good work bro..
Thank you!
Wow, you resolved my problem. Anywhere in the documentation was the error handling with the callback.ok and callback.error
Like and subscription earned as deserved! Thank you Brett, awesome tutorial!
Thank you for the sub!
I love your video. I want to ask about protect the page with user has not been authenticated ?
How to do that ? Thank you
Thank you and you just have to create a middleware file on the root of the whole project. export { default } from "next-auth/middleware"
export const config = { matcher: ["/dashboard"] }
This protects the dashboard page
@@brettwestwooddeveloper Ok thank you. I already watch in another video. It has two option server side or client side. Glad to watch your video and help
Hey Brett, amazing tutorial, one question, why you dind't use the Session model that next-auth provides as a starter code for prisma schema? (I guess its because that if we use jwt, the sessions will not be saved on the db)
As a beginner, I am also struggling on understanding the difference between this two models. Need some help to understand why choose one or another
@@younkezenger8117 Session only is used when you implement google/github auth options, so instead of only creating a user you also create a session. Hope this helps
Hey man, which of these videos should I watch first, this or the one that's titled "Nextauth credentials provider" ?
I would watch this one first because it goes over everything. There is a new version of Next-Auth which is in beta. However, you can still use this video as a guide and is still relevant. I have other videos as well on my channel going over the session object and much more!
Hey, love the videos. They are really helpful and concise. I was wondering if you could possibly make a video on what changes would have to be made to the application when its being pushed into production (i.e. changing specific environment variables, etc)
thankyou so much for this tutorial ......kaap doing
This helped me a lot, thanks. Very clear explanation
Glad I could help!
Best explanation.
Thank you!
I think for protected route we should use middleware page
Yes ideally you should, but you can use it on individual pages as well if you want per the documentation.
Thank you 🙏
You are welcome!
great tutorial! you should do one of these with next-auth-sanity
Great suggestion! Only tried sanity once
Ty for your good tut i have a question what plugin you use that show auto complete before coding?
Thanks and its called github copilot
at 25:41 when i try to sign in it gives me an error. Says: "Sign in failed. Check the details you provided are correct." But in inspector it has 302 Found
I would need more information to help you out there
great content 👌🏼
It's a truly informative and well-made video. I still have two lingering questions. First, what difference does it make in the underlying operation of Next Auth if we don't specify 'jwt' as a strategy? Second, why didn't you touch upon the topic of Middleware? It's crucial for user experience.
Great tutorial!!! One of the best I've seen. Quick question : How would you make an admin account that would see all other account is some sort of table?
thank you! and you would have to create a custom value for admin signups through the login functionality. I would have to look into it more, and when I get good with it I can create a video on that topic. That is a very good topic that would be helpful!
@@brettwestwooddeveloper thank you alot. That would be super helpfull. Keep up the good work and all the best from Zagreb, Croatia!
Please another tuts about next js with typescript, thankyou brother❤
i loved this ... and i added next auth to my project. but i still dont know how to protect a sever side page... i am getting error in my seversideprops
Could you please make a video for laravel sanctum version of this?
Hi, sorry I have never used that
This is the best tutorials I have seen on RUclips Awesome! Could you tell me the reason why we need to add "/test" url at the end of the DATABASE_URL? Thank YOu!!
thank you for the compliment and technically you can have whatever name you what instead of test. This will be your collection name in mongodb
@@brettwestwooddeveloper Really appreciate your answer!! Have a wonderful day!!!!😄😄
Thanks man
You are welcome!
Bro great video but I want to learn more about middleware stuff with google provider. Please help with that
Do you have a video using next-auth and role base access control,. Like basic , admin ... ?
no i do not
If is not too much to ask, can you expand these series of videos of auth by adding password recover and normal and admin user roles?
Yes I can do that, I already have recent videos on next auth jwt session
You're the best thank you ❤️
You are welcome!
@@brettwestwooddeveloper i just finished and its really alot of information to digest, especially the way the google and github user is added to the database )): but overall I loved it
Excellent tutorial.
Unfortunately its not completed without JWT token option.
Btw, you must modify your system environment for RUclips tutorials.
I mean your display resolution must not exceed 1080 HD
Now all your screen texts are very tiny and makes a lot of eye strain.
After route protection, when I write the login route manually in the search bar, it will show the login page for a while and then disappear which is not a good user experience.
If you are calling the user on the client side with the useSession hook. Then it will cause that. You must fetch the user on server with the getServerSession. I am assuming you are calling the session client side?
@@brettwestwooddeveloper
Yes I am using in client as my compo is in client side.
Do you have any repo or a blog post about it ?
no I don't but you will have to refactor your code so your page is a server component and then fetch the session on the server. Then any client components necessary. Impot them into the server page. Does that make sense?
@@dailyWalker1
@@brettwestwooddeveloper
Thank you for the help.
I got it and just solved ..
Hi, nice video btw! Im very thankfull! One doubt, in the object of useSession i am not receiving and status key? is there a reason for that?
nevermind, i got it!
Thank you for the explanation, just a question please, when user register he actually doesn't get auth cookies, he needs to signin after that to get them right?
If yes, is there a way to tweak that, would be nice if user can register and start using his dashboard for example. Thank you again.
Idk if someone else asked... I don't know much about Prisma, but is there a reason ti pick it over Mongoose? I thought Prisma is more suited for SQL db's. I just started the vid but this seems like it is what I was after.
Thanks for tuning in and you can use either honestly
did i miss where the app is going to handle resetting password for credential provider? do you hv a tutorial on how to do that, and to assign role?
Thank you very much... Thank you ...
why cant i get fields other than name , email in the session? i tried returning user object with a field of Contact from [...nextauth] page too. but it is not carried into home page. btw Thanks for such a comprehensive tut. :)
Thank you for tuning in, and by default you only get the name and email in the session. You must use the JWT strategy and then pass the data through the jwt to the session using asyn callbacks. I have a video on this: ruclips.net/video/bkUmN9TH_hQ/видео.html
i have been using this procedure for some apps but now i have been facing an issue. The signup with google isnt working directly in api/auth/signup unless i remove the // adapter: PrismaAdapter(prisma) line in nextauth route. The signin with google isnt working at all from the login page in (site) folder. If there are any changes we should do then itll be really great because i have tried alot of stuff but nothing worked out for me. Youre a great teacher :)@@brettwestwooddeveloper
Hi, can you do a really short video showing us how to setup a DELETE api route handler with and without prisma or at least with prisma. The new way in next13(app) is a bit confusing. Thanks for the content!
Yes I can start working on it
@@brettwestwooddeveloper thanks Brett, you are appreciated.
Thank you for the great video, it helped a lot, but I have a problem regarding google auth, when I log in with google the first time and log out, the next time i try to login with google it automatically logs in with that account, it doesnt let the user choose another one
I already tried a lot of things and nothing seems to work
Thanks a lot again, great video!!
did you sign out?
Yes, and when I sign in again with google it doesnt let me choose another account
If I need to bring me the user id and the roles, how would I do it? Great Video !
How do you configure Google Auth for a production project @all
What do you mean by production project @all?
@@brettwestwooddeveloper Thank you very much. I'm building a personal project solo. And your video has been very helpful in setting up an auth system.
My issue is that I have my nextjs project live now on vercel with a domain name. And I'm confused because I don't know what to set as the authorized redirect url. localhost:3000 or my new domain name. Do we need to click "publish app" for live projects on oauth consent screen?
what about the get refresh token strategy?
Very good video..But dont we need to store the session in db?
don't think so, would have to get back with you on that
Hey Brett, I've seen other tutorials where "mongoose" is used. I'm new to react/next etc...am I right in saying "mongoose" and "prisma" help setup schema's ? so we can use one or the other? if this is true, whats the benefits of using prisma ?
Yes correct, I have seen ways that you can use mongoose and don't have to use prisma. Just a preference when it comes to coding
@@brettwestwooddeveloper ah okay I see. Thanks for the quick reply.
Mongoose is a false layer of security, it gives no benefits apart from abstraction of the default mongodb sdk. You can send whatever the frick you want to your mongodb, and that's not ideal, so SQL is usually better than Mongodb. When I say usually, I mean 99.99% of the times.
I want to plzzzz ask u a question. How can I use NextAuth with Google to authenticate the user and then pass the session to NestJS project to authenticate the user there also so I can use the guards' features in NesfJS. There are no guides or tutorials about this at all
Sorry never have used NestJS
Our next PM will be 👉👉Brett 👏
Thanks!!! 😁
No problem!
Hi Brett, why on folder name u put [...nextauth] - in js that is the way to copy array but don't understand why do we name like that folder
it's called a catch all route when named like that. This allows you to run multiple API requests from that folder
Videos are so good. I just hate when he says prism when it's prismA with a A at the end??😂
hahahah sorry about that. I truly can't pronounce it right even if I wanted to
is there any way to prompt the custom errors in the register router? because something went wrong doesn't make sense, the user wants to know what is wrong.
For security purpose, you should not return the hashed password in the API register code. Just return the name and the email.
correct
Great tutorial, but i'm getting this error:
Error parsing attribute "@default": The current connector does not support the `auto()` function.
I would need more information on the code to help you out there