Practice & Assessment
Test your understanding of Authentication with NextAuth.js
Multiple Choice Questions
5Why is the NextAuth.js configuration split into auth.config.ts and auth.ts?
What should the authorize() function return to reject a login attempt?
How do you read session data inside a Next.js Server Component?
What bcrypt salt rounds value is recommended for production password hashing?
You want to add the user's database ID to the Auth.js session object. Where do you add this?
Coding Challenges
1Add GitHub OAuth and Protected Dashboard
Integrate Auth.js v5 into a Next.js project with GitHub OAuth. Set up auth.ts with the GitHub provider, create the Route Handler at app/api/auth/[...nextauth]/route.ts, and configure the authorized callback to protect all /dashboard routes. Build: a /login page with a sign-in button that calls the GitHub signIn server action; a /dashboard page (Server Component) that shows the user's name, email, and GitHub avatar from the session, and a sign-out button; middleware that redirects unauthenticated users from /dashboard to /login. Expected output: visiting /dashboard while signed out redirects to /login; after GitHub auth, /dashboard shows the user's profile. Time estimate: 25 minutes.
Mini Project
Full Auth System with Credentials and OAuth
Build a complete authentication system. Requirements: Prisma User model with id, email (unique), name, password (String?, nullable for OAuth users), role (enum USER/ADMIN, default USER), image (String?); registration page with Server Action, Zod validation (email format, password min 8 chars, name required), bcrypt hashing (12 rounds), P2002 error handling for duplicate email; login page with Credentials provider and GitHub OAuth; session configured to include user.id and user.role via callbacks; /dashboard accessible only to authenticated users; /admin accessible only to users with role ADMIN (return Response.redirect to /unauthorized if role is wrong); /profile page (Client Component) using useSession to show user info; SessionProvider in the root layout; sign-out button using signOut server action; all protected routes guarded by middleware. Test all flows: registration, login with credentials, login with GitHub, role-based access.