Hands-on authentication in the Next.js App Router — sign and verify session tokens with jose, set secure session cookies, log in with a Server Action, protect routes, and wire up Auth.js.
Authentication spans the front and back of an app, so it helps to be comfortable with components and forms, and with the idea of code that runs on the server. Each lesson uses the Next.js App Router (Server Actions, cookies) for the concrete examples.
Before you start
To practise, install VS Code and Node.js, open VS Code's integrated terminal (Ctrl+`), then scaffold and run a Next.js app with whichever package manager you use:
pnpm
pnpm create next-app@latest my-app
cd my-app
pnpm devnpm
npx create-next-app@latest my-app
cd my-app
npm run devAccept the defaults (App Router, TypeScript) so the examples match, then open http://localhost:3000 and keep the dev server running while you work through the lessons.
A note on security
Auth is the part of an app attackers go after first, and a small mistake can leak every account. This course shows the safe Next.js patterns — but for real projects, prefer a maintained auth library over hand-rolling your own. The Auth Providers lesson shows how to wire one up.
Password Hashing
Store passwords safely — why you never keep the plain text, how to hash and check a password with bcrypt, what a salt is, and why a fast hash like SHA-256 is the wrong tool for passwords.
JWT
Sign and verify stateless session tokens with jose in Next.js — create a signed JWT, set an expiry, and verify it on the server in both the Node and Edge runtimes.
Session & Cookie
Keep a user logged in in the Next.js App Router — set a secure session cookie (HttpOnly, Secure, SameSite), read, refresh, and delete it, log in with a Server Action, and protect routes with proxy.ts.
Auth Providers
Wire up authentication with Auth.js in a Next.js app — configure a provider, expose the route handlers, and read the session on the server with a single call.