Effortless Auth in Next.js 14: Use Auth.js & Drizzle ORM for Secure Login

Поділитися
Вставка
  • Опубліковано 26 гру 2024

КОМЕНТАРІ • 68

  • @srymisclick
    @srymisclick Рік тому +36

    This is the Auth.js docs we all needed 😅

    • @SamMeechWard
      @SamMeechWard  Рік тому +13

      The Auth.js team has a lot on their plate, especially trying to keep up with changes to next.js. It's a shame the docs end up suffering because of it.

  • @codingtranquility
    @codingtranquility 10 місяців тому +3

    Amazing guide, I can't tell you how log I was brute forcing my way against the docs. The current state of web dev with the constant migrations and upgrades is tough, but I'm glad there are content creators like you putting out quality up to date content!

  • @merveillevaneck5906
    @merveillevaneck5906 Рік тому +11

    this was disgustingly well done...recently went through the same steps and after rethinking my mental models i have to say this stack is looking pretty damn good. thanks for the brilliant video!

    • @SamMeechWard
      @SamMeechWard  Рік тому

      Thank you 🤗
      Let me know if this all works out for you or if I missed anything

  • @Crono1000
    @Crono1000 9 місяців тому

    You nailed down every part of this setup that every one of us needed to know. Well done!
    Liked and Subscribed for life! ❤

  • @simonjanca
    @simonjanca 7 місяців тому

    This is so great. Finally after hours of staring docs I made the "simple" auth working :)

  • @Diego_Cabrera
    @Diego_Cabrera Рік тому +1

    I am currently trying to update my website to have some special content for certain users. I think this is the route i'll be taking for my authentication. Thanks for the amazing explanation.

  • @ignaciogmg
    @ignaciogmg Рік тому

    Sam, I was struggling quite a bit trying to implement the new auth method with drizzle and this REALLY helped me a lot. Thanks so much!! You've got a new suscriber 😉

  • @fjobeir
    @fjobeir Рік тому +1

    Thanks!

  • @AntNZ
    @AntNZ 11 місяців тому

    Now I get it. I have been struggling with the beta version \ docs. You got me over the hurdle 🙏🙏🙏🙏

  • @loo6942
    @loo6942 11 місяців тому

    at 24:41, what if I want to use my own login in my middleware before using NextAuth?

  • @developerpranav
    @developerpranav Рік тому

    Needed this exactly! Been enjoying your videos, thanks a lot! Getting to learn a lot about S3 file management and securing your endpoints.

  • @RedRobotDevelopment
    @RedRobotDevelopment 3 місяці тому

    Great tutorial! I think the Next.js Dashboard example from the official guide also uses the beta installation but for me, I don't really like to use beta or canary libs for production code. Are there any other options for implementing auth.js with Next.js 14 without using a beta package?

  • @darrenpierre9903
    @darrenpierre9903 11 місяців тому

    Hey I've been trying to learn how to use auth.js into my application for several days now and I couldn't find any resource except yours that actually explains what parts you need and explain their role . Thank you so much for the video . I was wondering how did you learn how to use auth.js ?

  • @fabouwes9240
    @fabouwes9240 8 місяців тому

    Thanks for this beauty !
    Next time, Could you create a tutorial on how to use Lucia with Drizzle-Neon ?

  • @vasubhensdadiya6670
    @vasubhensdadiya6670 5 місяців тому

    Sir, can you give me the name of the theme and font you use in your VS Code?

  • @metagravity
    @metagravity 7 місяців тому

    Hey , am getting an error like when directed to github that page not found

  • @boy4everjoy
    @boy4everjoy 8 місяців тому

    for adding roles you would just add another field in your db and check if the role matches agaisnt your own criteria and safeguard either a page or part of your code? I think thats kinda what I got from reading docs. whats your opinion?

  • @liu-river
    @liu-river Рік тому +1

    Wait, you are using database strategy and middleware works? How come nextauth doc says only supports jwt when using middleware?

    • @googoochu3923
      @googoochu3923 11 місяців тому +1

      Docs statement for database or orm that aren't compatible for edge runtime. He is using drizzle and neon both compatible for edge so you can use database strategy.

  • @homescriptone
    @homescriptone 7 місяців тому

    How do you customize your login page ?

  • @noelalfaro
    @noelalfaro 9 місяців тому

    I ran into an issue where after pushing the schema that includes the user, verificationToken, session, account to my vercel postgres db, i get an error saying "Error: multiple primary keys for table "user" are not allowed" I've looked over my schema files and I am only declaring one primary key. I can't find any relevant help online and would really appreciate any help!

  • @brahimo4701
    @brahimo4701 8 місяців тому

    I just wondering how can I catch a dynamic route inside the middleware eg. /[slug]

  • @AuthentCollabServices
    @AuthentCollabServices 2 місяці тому

    can you please do a video on next-auth-cognito

  • @krudeboy3835
    @krudeboy3835 10 місяців тому +2

    yea for some react NEXTAUTH doesnt export "handlers" and "auth" so this way doesn't work with Next14 and v4 next auth. NextAuth is the actual GET and POST handler. Sad how quickly the just update everything and not document it.

  • @semyaza555
    @semyaza555 6 місяців тому

    Does Auth.js still not work on React Native?

  • @Alex.Shalda
    @Alex.Shalda 8 місяців тому

    so thorough, thank you!

  • @juliushernandez9855
    @juliushernandez9855 9 місяців тому

    Can i use auth.js already for project?

  • @aliarefjs
    @aliarefjs Місяць тому

    with Github ??? please do it with other providers I am new to Authjs

  • @universe_decoded797
    @universe_decoded797 Рік тому

    I have used drizzle and authjs drizzledapter for a while, but please make a video how to use custom credentials login with drizzle

  • @jsantos1220
    @jsantos1220 8 місяців тому

    Im doing this with the version "next-auth": "^5.0.0-beta.17" witch is the latest now, and the user came by default with id, emailVerified too, they add it or i paste something extra without knowing?

  • @gbtech8602
    @gbtech8602 11 місяців тому

    Hi Sam can i use this new version of authjs with express. i have application which uses express backend.

  • @duechilidance5388
    @duechilidance5388 3 місяці тому

    great video, very helpful, thanks

  • @Ripening
    @Ripening 8 місяців тому

    In case anybody is struggling with this problem: I kept getting an error when trying to sign up 'column "id" of relation "session" does not exist'. In the end, I just went in to the schema copied from authjs and added an extra column to the sessions table as: 'id: text('id').notNull().primaryKey()'. Maybe it'll cause problems later, I don't know, but it worked and I can now log in.

  • @rahulsingh-bk3wd
    @rahulsingh-bk3wd 3 місяці тому

    Thanks for the helpful video

  • @googoochu3923
    @googoochu3923 11 місяців тому

    Btw session interface modification isnt working for me. Cant tell is it only me or everyone?

  • @BuhuuRecords
    @BuhuuRecords 5 місяців тому

    I am using TURSO, I have created a scheme according to the documentation and I get errors on the server side when I try to log in
    "proto": {
    "message": "SQLite error: no such table: user",
    "code": "SQLITE_UNKNOWN".
    }
    Does anyone know what this could be about? I don't have a user table, I have users according to the documentation....

  • @coffeeaddict7652
    @coffeeaddict7652 Рік тому

    This helped me so much. Thanks!

  • @parmetra
    @parmetra Рік тому

    Great lesson! Thank you!
    I would still like to learn more about role modeling, so that some part of the site is only accessible to the admin.
    And an additional question: is it possible to bind authentication via Next-Auth together with NextJS + NestJS, since I have the REST API built on Nest?
    For example, so that some API requests are processed only for administrators.

  • @szuhanchou6307
    @szuhanchou6307 9 місяців тому

    Thanks for this awesome tutorial.
    I'm using same set-up but with Postgres.js as the DB driver. I'm getting this error when compelling the middleware component. I wonder has anyone experienced this before? I have put buffer & stream-browserify in next.config.js. Thanks for reading it!
    Module build failed: UnhandledSchemeError: Reading from "node:stream" is not handled by plugins (Unhandled scheme).
    Webpack supports "data:" and "file:" URIs by default.
    You may need an additional plugin to handle "node:" URIs.
    Import trace for requested module:
    node:stream

    • @henritouchard6228
      @henritouchard6228 7 місяців тому

      did you find a solution ? I found many similar conversations about it, seems to be a known bug but i didn't find a solution yet

  • @kacperkepinski4990
    @kacperkepinski4990 Рік тому

    what if I want to customize the button and place it in a different place?

    • @SamMeechWard
      @SamMeechWard  Рік тому

      You need to set that all up yourself on your one page. You need to setup a custom button and link to the correct social login provider

  • @Tanner-cz4bd
    @Tanner-cz4bd Рік тому

    why not with prisma?

  • @Furki4_4
    @Furki4_4 Рік тому

    Hey, I'm trying to add custom columns to the user table but having some problems. Docs says "First, create a schema that includes the minimum requirements for a next-auth adapter. You can select your favorite SQL flavor below and copy it. Additionally, you may extend the schema from the minimum requirements to suit your needs." However, it doesn't actually use my table schemas. It uses the default table schema as in the docs even if I customize it. you can see them when you inspect into the source code. Am I missing something or is this adapter strictly implemented ;_;
    Thank for the video btw

    • @SamMeechWard
      @SamMeechWard  Рік тому

      You should be able to copy the default schema than add on some custom optional fields. Or you could create something like a “profile” table with extra details and reference the use table

  • @rohansen6872
    @rohansen6872 Рік тому

    Was Really Really helpful

  • @hichambelhoucin9060
    @hichambelhoucin9060 Рік тому

    that was helpful thank you ♥♥♥

  • @NickFields4
    @NickFields4 Рік тому +1

    Thanks Sam!
    [Disclaimer] I can't fully watch till after work.
    But right off the bat I'm wondering if this method has left you woth limited deployment options?
    I remember toying with NextAuth OpenNext via SST a while back. It had hefty complexity to get working and was quite finicky thereafter.
    Is this deployable only to vercel in your experience?
    SST?
    Amplify?
    Etc?

    • @SamMeechWard
      @SamMeechWard  Рік тому

      I would strongly suggest everyone avoid Amplify, but I just tested it using SST and it works great:
      dfg0bi35ewl48.cloudfront.net/
      I had to add this env var but that's all AUTH_URL=dfg0bi35ewl48.cloudfront.net
      And I had to slightly adjust the way I was importing my server actions, but that's a next thing, not a next auth thing.

  • @dinoDonga
    @dinoDonga Рік тому

    You don't have to use your phone to confirm. clicking "use you password" in the "having trouble box" will simply open up the password field.
    That being said i thought it had a real genuine touch lol

  • @최대한-h5g
    @최대한-h5g Рік тому

    Thanks for upload this Posting it is great helpful :)

  • @akshar234
    @akshar234 11 місяців тому

    Every time I use next auth, something is always broken. I am starting to hate this whole ecosystem in general now :(
    Nice video btw, I had some hard time setting up next auth, their docs is a mess

  • @Love-id8gu
    @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!!! 😇

  • @hugosantos978
    @hugosantos978 Рік тому

    Thanks for sharing.

  • @jintz2
    @jintz2 Рік тому +1

    Great job copy pasting!

  • @vinniv6806
    @vinniv6806 Рік тому

    yeah... now do the same with custom provider (you get JWT token from external api).... 😁😁

  • @andrewiglinski148
    @andrewiglinski148 Рік тому

    When the f-ck did v14 come out? I still have two apps in v13 still in active development lol.

    • @SamMeechWard
      @SamMeechWard  Рік тому

      🤗
      Don't worry, there's no changes to the APIs, it's mostly performance and stability improvements.

    • @merveillevaneck5906
      @merveillevaneck5906 Рік тому

      ya you can basically just go ahead and upgrade your next dependencies and it will work without a hitch@@SamMeechWard

  • @ahndeux
    @ahndeux Рік тому

    Damn. You lost me at the first 1 minute mark.

  • @treyrader
    @treyrader Рік тому

    lolol

  • @sealuke2724
    @sealuke2724 Рік тому

    its very helpful Next 14 + next-auth@beta (v5)