Guide

How to add authentication to Next.js

Auth done wrong is a security risk; auth done right is mostly boilerplate. Here's the modern, SSR-friendly path.

1. 1

   Choose an auth provider

   Supabase Auth, Auth.js or Clerk are common in 2026. Supabase pairs auth with a Postgres database and Row Level Security.

2. 2

   Wire sign-up and login

   Add forms and server actions for email/password (and OAuth if needed). Create a profile row on signup with a database trigger.

3. 3

   Store the session for SSR

   Use cookie-based sessions so server components and the middleware can read the user. With Supabase, the @supabase/ssr helpers handle this.

4. 4

   Refresh the session in middleware

   Add middleware that refreshes the session on each request and redirects unauthenticated users away from protected routes.

5. 5

   Enforce access in the database

   Turn on Row Level Security and write policies so users can only read and write their own rows — the real security boundary, not the UI.