Custom Sign-in Emails in NextAuth Using Resend

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

КОМЕНТАРІ • 40

  • @rhh1090
    @rhh1090 9 місяців тому +1

    Dude, I love your approach/style. This was extremely helpful for me. Thank you!...from a happy new subscriber 🙂

    • @hamedbahram
      @hamedbahram  9 місяців тому +1

      Thanks for the sub, and welcome to the channel! I'm glad to hear that.

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

    I'm curious if this is for version five, as I started to get this error:
    Type error: Route "app/api/auth/[...nextauth]/route.ts" does not match the required types of a Next.js Route.
    "authOptions" is not a valid Route export field.

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

      This is still using NextAuth v4. However the problem is exporting the `authOptions` from your `route.js` file. To solve this error extract the `authOptions` object into a separate file.

  • @KamalSingh-zo1ol
    @KamalSingh-zo1ol 7 місяців тому +1

    What if we wanted to modify verification token method? Like I want it to be 6 number code and confirm it by inputting it in UI.

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

      You can accomplish that by creating a custom flow using the credentials provider.

  • @ayushgogna9732
    @ayushgogna9732 Рік тому +2

    do you know why am i getting this error
    Type '{ id: string; type: "email"; sendVerificationRequest({ identifier: email, url }: { identifier: any; url: any; }): Promise; }' is not assignable to type 'Provider'.
    Types of property 'type' are incompatible.
    Type '"email"' is not assignable to type '"oauth" | "credentials"'.

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

      Pass the `NextAuthOptions` type from `next-auth` to your authOptions type. See more here → authjs.dev/guides/providers/email-http

    • @uxander
      @uxander 10 місяців тому +1

      EmailProvider({
      async sendVerificationRequest({ identifier: email, url }) {
      await sendVerificationRequest({ identifier: email, url });
      },
      }),
      This solved the type error for me

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

      @@hamedbahram Actually passing that type is what pops the error, the type email doesnt exist, only OAuth or Credentials are available. the docs don't help aswell sounds outdated

  • @abhilashm5236
    @abhilashm5236 Рік тому +2

    I am following all your videos , it’s very informative ❤️. Can you also make one video about micro front ends with next 13

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

      Glad to hear that! I'll keep that in mind for future videos.

  • @biLLie_wiLLie
    @biLLie_wiLLie Рік тому +2

    Can you explain to me please - do nextAuth and Clerk do the same job? What is better?

    • @hamedbahram
      @hamedbahram  Рік тому +2

      NextAuth is a self hosted authentication service while Clerk is a hosted or managed service. While both are pretty straight forward to use, Clerk comes with prebuilt components you can drop in your app.

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

    How do I use sever component inside other server component. i.e category, categoryProduct. I want to load one after other, also want to use Suspense to show loader. please tell me how can i do it.

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

      Just like any other component in React you can compose server components.

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

    Hi, I have top bar, menu, body and footer. All sections are in database, what will be best approach to call them using API? Hope you understand, please provide some reference regarding

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

      You can use server components in the App router and fetch data directly inside your component.

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

    Very helpful, thank you!!!

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

    Hello that you for this video this was very help. But can someone please tell me why email provider not working with smtp method in next 13. Tested it on next 12 working fine but with next 13 ive got an 500 server error with the default signin email. Anyone please do let me know if you encounter this issue.

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

      I've had the email provider working in NextJs 13. You can clone my code and swap the custom provider with the built-in email provider and it should work. When calling the `signIn` method you need to pass the "email" as the provider Id like `signIn("email", {email})`

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

      @@hamedbahram ok will try and let you know thank you

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

      Hello ive clone your project still same error. I using Prisma client instead of mongo and install node mailer . Still cant use the default signin email. Internal 500 error

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

      @@utech3657 Not sure where the error is from, I'd have to look at your implementation. From a high level, you need to use the `PrimsaAdapter` in your NextAuth config.

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

      @@hamedbahram yes i have use prismaAdapter generate a database. I will go with next 12 as debuging this in next 13 is a headache. It should be simple but still dont know why i can post the default sigin email.

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

    As far as i know there is no simple way to change user's email after sign up. Maybe I'm wrong about that?

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

      It is possible to update the user record and change the email if using the email/credentials provider. Though it won't work if using social logins.

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

    Thanks for the great video. How do we go about joining multiple accounts/providers on the same profile (i.e. similar to how it's done in reddit or epic games where I can sign in both from my Google and Apple accounts)

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

      Good question 🤔 I'd have to test this, not sure if next-auth automatically links accounts if using the same email on both accounts.

  • @Tofupoilu
    @Tofupoilu 11 днів тому

    Anyone having issues on implementing email provider with vercel? I have to submit twice on production

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

    Nice thanks so much❤

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

    Thanks

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

  • @mukulkumar5133
    @mukulkumar5133 2 місяці тому +1

    hitesh duplicate

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

      I'm not familiar with the creator you mentioned but I'm sure there are similar videos about custom sign in emails in nextauth.