Authentication in Next.js 14 is easy...

[@janmarshalcoding]

Quick FYI, supabase changed a few things in regard to their core infrastructure (supervisor). To make the connection with prisma and supabase work, please follow the following guide: supabase.com/partners/integrations/prisma

[@ericsonl_]

any plan to create a tutorial for this? especially for the multischema part

[@Racine14]

I get an error with the adapter: PrismaAdapter

[@laugri]

Thank you for puttin this tutorial together. The NextAuth doc is so broken, I really needed this !

[@somnathgolui2912]

People who are gettign createUser type error in adapter just do "import type { Adapter } from "next-auth/adapters";" It will fix the error for now. Thanks for the awsome video.

[@somnathgolui2912]

Also don't forgot to type cast PrismaAdapter(prisma). like this adapter: PrismaAdapter(prisma) as Adapter,

[@shazeemalichishty7322]

thanks, that works for me@@somnathgolui2912

[@RMHave]

@@somnathgolui2912 THANK YOU so much!!!! I was banging my head over this and his website Auth is not working so I cant get to the repo.

[@dev15811]

@@somnathgolui2912 i was facing this error for two days thank you so much

[@garvitkhulbe7896]

@@somnathgolui2912 hi, if i send you my code repo , can you please check it? its been 2 weeks and i'm just sick and tired of this next auth. i am doing evrything correct , still i ma not able to use adapters ." message: 'getUserByAccount is not a function'," this error is coming. idk what to do

[@shazeemalichishty7322]

Thanks, Marshal that was a smooth sealing I thoroughly enjoyed it. great job

[@chukwuemekamusic663]

hey Jan, great job and thank you for sharing. I really learnt a lot. Had some back and forth with the new documentation but eventually got it all...

[@janmarshalcoding]

Nice one, that's how you learn! Learning how to read and understand documentation is probably one of the most essential skills a developer can have.

[@samparhizkar5221]

Excellent video. This really helped me understand how can I get the authorization going (Even though coming from the latest official nextjs tutorial the imports are a bit outdated). Would be nice to showcase the middleware functionality in a followup video. Also question, does this authorization allow for sigining in from multiple providers at the same time? Similar to how epic games accounts work for example.

[@kariza76record]

Best tuto for NextAuth + Prisma. Thaks 👏🏼👏🏼

[@temitopedavid9508]

My favourite KZbin tech guy!! I learnt alot from your videos bro... keep it up

[@janmarshalcoding]

🫡

[@Racine14]

Me too dude... This man is the best.

[@Racine14]

@@janmarshalcoding Can you build a project with nextjs and cloudinary? A project like a CRUD...

[@DelightBessie]

you sincerely deserve more subcribers and views bruv...Youre really helping

[@janmarshalcoding]

Thank you, I appreciate it!

[@meucaminhodev]

The first thing I have to do is thank you for your excellent video, thanks to your video I finally managed to understand and authenticate using next-auth, thank you very much, even though I'm Brazilian and not fluent in English I managed to understand your video once again thank you very much.

[@janmarshalcoding]

Thank you, I appreciate your comment 😄

[@falasefemi3344]

Best explanation of next auth. Thanks

[@Deus-lo-Vuilt]

Thanks for the next videos, they are super interesting

[@janmarshalcoding]

Appreciate it! 😀

[@ilan117]

Jan ❤ Every tutorial you make is precious. Thank you so much 🙏

[@flipup556]

Top 5 most useful yt vids, Love the detailed explaination on this keep it coming subscribed.

[@ShamimAhsan-zn5hg]

Thank you for your fantastic effort. Your detailed explanation is something rarely found among tech KZbinrs, and it's greatly appreciated. ❤ One thing I noticed missing is what changes we should make after deploying the app to ensure we can receive the magic link with any email.

[@GerardoRoloff]

I´m having an error with the authOptions. this is what it says: Type error: Argument of type '{ adapter: Adapter; providers: (OAuthConfig | EmailConfig)[]; }' is not assignable to parameter of type 'AuthOptions'. Types of property 'adapter' are incompatible. the local app works, even with that error, but just login to github, not login with email

[@1mrnewton]

I had same error but @meucaminhodev 's comment worked: ``` I watched a lot of tutorials, and the only one that really worked for me was this video, but I had to make some changes because in some parts like from 22:30 onwards, in this part the adapter had to do it a little differently. If anyone has a problem with adding the adapter, this is the code that worked for me: import { PrismaAdapter } from "@auth/prisma-adapter" import prisma from './db' import type { Adapter } from "next-auth/adapters" function getPrismaAdapter(): Adapter { return PrismaAdapter(prisma) as Adapter } export const authOptions = { adapter: getPrismaAdapter(), providers:[ ..... I did exactly as it was done in the video the only change I needed to make is this in the auth.ts file .I hope this comment helps someone who has the same error as I did. ```

[@prathmeshvhatkar8801]

Awesome vid, very detailed, subscribed!

[@RabeeRaad]

Amazing tutorial. Thank you for sharing!

[@DagmarJS]

Thank you for the tutorial 💖

[@heniyentertainment]

bro u dont know how ur videos helping me alot thank u very much😂😂😂

[@almedinshala20]

great explanation!

[@mrevergreen9049]

Great tutorial, i was hopping you would handle everything inside the api routes and actually use prisma to check and create users to the database

[@janmarshalcoding]

Why would you want to do that

[@mrevergreen9049]

@@janmarshalcoding for me i like to have an api that can serve any type of app including mobile apps

[@janmarshalcoding]

Interesting, I will keep that in mind for next time

[@GrégoryPerson-i2p]

@@janmarshalcoding I really dont understand the db part of this course as you infact never use it.. How to retrieve signed up customers or interact with them ? I was hoping to see how you add these and retrieve it from the supabase db. This is a nice tutorial to setup nextauth, but it kind of feel useless at the end since we dont control anything from auth users id

[@janmarshalcoding]

@@GrégoryPerson-i2p You literally store the user in the db? What you do from there is your choice

[@arshah246]

Thanks for your effort it would be great for us if you make a video on cart, how to create a cart, how to add products to cart and simple checkout page without any cms. Thanks in advance ❤

[@puturangga2024]

Can you make a tutorial using the latest version? (Auth.js). Where is the server action used here, and how do you save data credentials from Auth.js to Supabase? such as logging in using full name, email, password

[@arshah246]

I have already watched your previously uploaded video thaat was with CMS. You are using latest / new features of next js and it is very great for us to learn all thee stuff. I have 50% completed my e-commerce project after viewing your videos but cart functionality is pending and it ia very difficult for me. So Make a video on cart functionality in simple way so that it could easily grap

[@noahscode]

Thanks for the video. I am building a project which is expected to be used by approx 10K users within. 3 months of launch. I have been putting of auth but I’m wondering what you would suggest? Clerk or custom solution?

[@janmarshalcoding]

Well, it totally depends on b2b or b2c. Are all users paying users or not etc. I have made a YT video on my Channel with the title: "Clerk vs Next-Auth.js | It's not that simple... ". It should answer your question.

[@Yasser-e2p]

hi Jan wonderfull tutorial btw , however i fell in the same problem of invalid link over and over again can u explaine how to solve it thanks

[@GerardoRoloff]

hello jan. thank you very much for your videos. I have a question. since you use supabase, why using the prisma adapter instead of the supabase adapter wich is also in the list of adapters of nextauth? I mean is it necessary to use prisma?

[@janmarshalcoding]

Well, you could definitely use the supabase adapter, but I personally use prisma for all of my projects... And if your whole project resolves around supabase, and you don't need prisma then definitely use supabase.

[@acy2k5]

What about using Auth V5 since Next-Auth is being migrated and using Bcryptjs and Zod?

[@ryanpratama14]

Thank you! Subscribed!

[@Omar_Al_Seddik]

Subbed, liked, and commented.

[@Love-id8gu]

Hello!❤ Please make an example of authorization in control panel (Nextjs 14, typescript, server actions, nextauth 5, prisma, shadcn ui, react-hook-form, zod, sonner). User authorization, user registration, user roles.😘 Thank you very much!!! 😇

[@Combatforge]

Thank you for this detailed video 🫶

[@aleksdeveloper698]

Do you know any place where can I use a cheap shared hosting for nextjs 14? Seems like all the shared hosting do not support nodejs 18+

[@JoshMelodyMusic]

Jan, what theme did you use? in vscode?

[@janmarshalcoding]

Its called Aura

[@ifeanyiosi]

Been waiting for a video. When can we get another full stack tutorial. A complex project that involves redux or something

[@epicen1]

Hello anyone can tell me when we create two separate signin forms like Sellers and Buyers, how to do this things? i mean I need to know when we create prisma schema do we need to mention to get that details? Like I need type of the account (Seller or Buyer).i don't have a big idea about this Please help me

[@abhishekgiri013]

i,m having errror while clicking on github signin button anyone know how to solve this though i've followed the tutorial exactly still its happening 404 This page could not be found.

[@noname-rp8pv]

Hi everyone. Does any one have this issue: The sign in link is no longer valid.???? Receiving link, but it is not valid somehow.

[@ozgeonline0]

Can you help me with the netflix clone project? I can't reach you. I haven't been able to progress on the project for 2 days. I downloaded your github repo and tried it from there. The data gives an error there too

[@adimardev1550]

i've watched 3 nextAuth + Prisma videos, and my app still doesn't work with Nextjs14. i don't understand!

[@meucaminhodev]

I watched a lot of tutorials, and the only one that really worked for me was this video, but I had to make some changes because in some parts like from 22:30 onwards, in this part the adapter had to do it a little differently. If anyone has a problem with adding the adapter, this is the code that worked for me: import { PrismaAdapter } from "@auth/prisma-adapter" import prisma from './db' import type { Adapter } from "next-auth/adapters" function getPrismaAdapter(): Adapter { return PrismaAdapter(prisma) as Adapter } export const authOptions = { adapter: getPrismaAdapter(), providers:[ ..... I did exactly as it was done in the video the only change I needed to make is this in the auth.ts file .I hope this comment helps someone who has the same error as I did.

[@adimardev1550]

@@meucaminhodev that's great that it worked for you. after failing thousand times, i'd came across lucia auth. and i'd been loving it so far. i think it's much better than nextAuth or authjs in general. it's way bearbones than nextauth and you can work with the user from the server and pass it to the client. it's way flexible and customizable than nextauth. and it has many adapters too inlucding prisma. give it a try!

[@ajml_hnter]

@@meucaminhodev Thank you very much, I was trying to debug this error for some time now

[@froote]

@@meucaminhodev can you make a medium post on this its very helpful and others might be looking for help and with seo now a days you don’t know what you will find

[@aaryanjain3422]

thanks a ton man @@meucaminhodev

[@provisorioz]

Hello, I followed your tutorial, found it wonderful and very well explained. However, I run on port 3001, but when I log in with GitHub, it always redirects me to the callback URL with port 3000. Is there any configuration in next-auth that causes this?

[@janmarshalcoding]

Well when you created your GitHub id and secret you added a base URL and callback URL. Change the URL to localhost:3001 and it will work

[@provisorioz]

@@janmarshalcoding I changed, including deleting the node_modules and .next folders before running npm run dev, and still, it keeps redirecting me to port 3000. The first time, I created the app with the URL like yours, then I updated the app on GitHub to the correct port, but it didn't work. I then created another app with the correct URL, but it still redirects me to port 3000.

[@orbur2091]

thx a lot

[@tomasg6251]

hi, can I know your theme? thanks

[@janmarshalcoding]

aura theme

[@noorahmadharal]

Does the code is working now?

[@MihirJaiswal-vn4vm]

no

[@19.pritamgiri73]

What abt Auth.js

[@tedogirma]

💪💪💪💪💪💪💪💪 subscribed

[@treva383]

Type 'import("e:/Web Dev/NextJS/smoke/node_modules/@auth/core/adapters").Adapter' is not assignable to type 'import("e:/Web Dev/NextJS/smoke/node_modules/next-auth/adapters").Adapter'. Types of property 'createUser' are incompatible. Type '((user: AdapterUser) => Awaitable) | undefined' is not assignable to type '((user: Omit) => Awaitable) | undefined'. Type '(user: AdapterUser) => Awaitable' is not assignable to type '(user: Omit) => Awaitable'. Types of parameters 'user' and 'user' are incompatible. Property 'id' is missing in type 'Omit' but required in type 'AdapterUser'.ts(2322) adapters.d.ts(174, 5): 'id' is declared here. types.d.ts(106, 5): The expected type comes from property 'adapter' which is declared here on type 'AuthOptions' (property) AuthOptions.adapter?: Adapter | undefined You can use the adapter option to pass in your database adapter. I don't know understand why this is throwing error after I used adapter() before this everything worked correctly... Please help (at 24:20)

[@andrewevans4722]

I've restarted this project 3 times and copied your code from Github exactly. I'm still getting this error: Type 'import("/Users/***/code/next-map/project-name/node_modules/@auth/core/adapters").Adapter' is not assignable to type 'import("/Users/***/code/next-map/project-name/node_modules/next-auth/adapters").Adapter'. Types of property 'createUser' are incompatible. Type '((user: AdapterUser) => Awaitable) | undefined' is not assignable to type '((user: Omit) => Awaitable) | undefined'. Type '(user: AdapterUser) => Awaitable' is not assignable to type '(user: Omit) => Awaitable'. Types of parameters 'user' and 'user' are incompatible. Property 'id' is missing in type 'Omit' but required in type 'AdapterUser'.ts(2322)

[@andrewevans4722]

copied from another reply, modified auth.ts like this: @1mrnewton 3 months ago I had same error but @meucaminhodev 's comment worked: ``` I watched a lot of tutorials, and the only one that really worked for me was this video, but I had to make some changes because in some parts like from 22:30 onwards, in this part the adapter had to do it a little differently. If anyone has a problem with adding the adapter, this is the code that worked for me: import { PrismaAdapter } from "@auth/prisma-adapter" import prisma from './db' import type { Adapter } from "next-auth/adapters" function getPrismaAdapter(): Adapter { return PrismaAdapter(prisma) as Adapter } export const authOptions = { adapter: getPrismaAdapter(), providers:[ ..... I did exactly as it was done in the video the only change I needed to make is this in the auth.ts file .I hope this comment helps someone who has the same error as I did. ```