NextJS - Build a Full-Stack Authentication with NextAuth

Set up a fresh Next.js 13 project with npx create next app, kebab-case naming, tailwind, and the app router, then tailor the boilerplate and run the dev server.

Connect your Next.js app to a Postgres database with Prisma, using local, docker, or Neon serverless hosting, and manage a private env file.

create the user model in the database with an autoincrementing id, unique email, and password, migrate changes with Prisma migrate dev, and use Prisma Studio to seed data.

Install and set up the Prisma client, a query builder based on the Prisma schema, to simplify database communication; then create a helpers/prisma.js, instantiate and export a single client.

Create a custom registration page in Next.js by adapting the login page, building a registration form, and preparing the register api endpoint for a full-stack authentication system.

Create a register API endpoint in a Next.js app using Node.js, bcrypt hashing with salt 10, and Prisma to store lowercase emails in Postgres, with validation and testing guidance.

Create a login api endpoint with Node.js that authenticates users via email and password, verifies with Prisma and bcrypt, and issues a signed jwt access token using jsonwebtoken.

Connect the login form to the nextauth login api via the signIn function, updating the dot env with nextauth_url and nextauth_secret, and handling login responses for secure page access.

Learn how to implement email verification in a Next.js with NextAuth authentication system by updating the database schema, generating and sending verification codes, and building a verification page.

Modify the database schema to add a verification code model connected to users, and introduce an is_verified flag. Implement six-digit code generation and Prisma migrations to enable secure login.

Create a functional verification page and an api in a Next.js app, mirroring the registration flow with a verification form for email codes, an api route, and prisma-backed checks.