How can I implement authentication with email and password and also (optionally) google?
Answered
African Slender-snouted Crocodil… posted this in #help-forum
African Slender-snouted CrocodileOP
How can I implement authentication with email and password and also (optionally) google? I'm using nextjs 15 and app router. Is there any tutorial to do this with nextjs 15? I didn't find it. I couldn't understand how to use next auth in nextjs 15.
Answered by B33fb0n3
you can use next.auth the same in nextjs15 as you done it in nextjs14. There is no difference. so integrate it like you would in nextjs14. The documentation is pretty straight forward
--- Edit
Translate the pages router documentation to the equivalent of the app router: https://nextjs-forum.com/post/1320843443676643393#message-1320855780945166417
--- Edit
Translate the pages router documentation to the equivalent of the app router: https://nextjs-forum.com/post/1320843443676643393#message-1320855780945166417
13 Replies
@African Slender-snouted Crocodile How can I implement authentication with email and password and also (optionally) google? I'm using nextjs 15 and app router. Is there any tutorial to do this with nextjs 15? I didn't find it. I couldn't understand how to use next auth in nextjs 15.
you can use next.auth the same in nextjs15 as you done it in nextjs14. There is no difference. so integrate it like you would in nextjs14. The documentation is pretty straight forward
--- Edit
Translate the pages router documentation to the equivalent of the app router: https://nextjs-forum.com/post/1320843443676643393#message-1320855780945166417
--- Edit
Translate the pages router documentation to the equivalent of the app router: https://nextjs-forum.com/post/1320843443676643393#message-1320855780945166417
Answer
@B33fb0n3 you can use next.auth the same in nextjs15 as you done it in nextjs14. There is no difference. so integrate it like you would in nextjs14. The documentation is pretty straight forward
--- Edit
Translate the pages router documentation to the equivalent of the app router: https://discord.com/channels/752553802359505017/1320843443676643393/1320855780945166417
African Slender-snouted CrocodileOP
So in the same way? Do I create an api folder, [...nextauth].... etc...? Is there any tutorial or guide that you would recommend?
But i need to install nextauth@beta correct?
@African Slender-snouted Crocodile So in the same way? Do I create an api folder, [...nextauth].... etc...? Is there any tutorial or guide that you would recommend?
yes, the same way. I like to use this guide when I setup next-auth for any new project: https://next-auth.js.org/getting-started/example
@African Slender-snouted Crocodile But i need to install nextauth@beta correct?
No, DONT install the beta version. And no, also DONT install authjs. Both are pretty buggy
@B33fb0n3 No, DONT install the beta version. And no, also DONT install authjs. Both are pretty buggy
African Slender-snouted CrocodileOP
Just run
npm install next-auth@African Slender-snouted Crocodile Just run npm install next-auth then?
yea, follow the guide that I just linked. It shows you step by step what you need to do. You can also see, that you would install it for "Version 4" (orange arrow)
@B33fb0n3 yea, follow the guide that I just linked. It shows you step by step what you need to do. You can also see, that you would install it for "Version 4" (orange arrow)
African Slender-snouted CrocodileOP
ok, i'll try now
@African Slender-snouted Crocodile ok, i'll try now
take your time. Let me know when you are done 👍
African Slender-snouted CrocodileOP
@B33fb0n3 this guide shows a configuration in _app.jsx, but next15 doesn't have this file. Wouldn't next15 be equivalent to layout.js?
@African Slender-snouted Crocodile <@301376057326567425> this guide shows a configuration in _app.jsx, but next15 doesn't have this file. Wouldn't next15 be equivalent to layout.js?
Oh I forgot to tell you: the guide is mostly made for the
pages router. So hopefully your knowledge is enought to know on how to translate these kind of stuff to know what's the equivalent to an api route is. Or an _app.jsx. I am using the SessionProvider inside my global provider. That's a common pattern in nextjs. If you are interested you can read about it here: https://nextjs.org/docs/app/building-your-application/rendering/composition-patterns#using-context-providersAfrican Slender-snouted CrocodileOP
Ahhh I see, I think that's why I got confused, I tried to repeat some things, I'll try to adjust here