auth-patterns_skill

Overview

This skill provides concise, practical guidance for implementing authentication and authorization in Next.js apps. It focuses on common patterns: NextAuth (Auth.js) setup, middleware protection, session strategies (JWT vs database), and role-based access control. Use it to pick the right approach, follow concrete examples, and apply security best practices.

How this skill works

The skill inspects common Next.js authentication needs and outlines patterns with runnable snippets: configuring NextAuth v5, wiring API handlers, protecting routes via middleware, and getting session data in server and client components. It explains session storage options (JWT or database), shows how to extend session types for roles, and demonstrates sign-in/out flows and token verification in middleware. It also highlights security controls and when to validate redirects or apply rate limiting.

When to use it

• You need a quick NextAuth (Auth.js) setup for providers and credentials
• You want middleware-based route protection or JWT verification at the edge
• You need server- or client-side access to session data in App Router
• You require role-based access control for admin/user pages
• You are deciding between stateless JWT and database-backed sessions
• You want secure sign-in/out flows and session provider wiring

Best practices

• Use HTTPS and secure cookie flags (HttpOnly, Secure, SameSite) in production
• Validate callback and redirect URLs to prevent open redirects
• Prefer proven libraries (NextAuth/Auth.js, Clerk, Lucia) unless you need full custom control
• Hash passwords with bcrypt or argon2 and store secrets in environment variables
• Apply rate limiting on auth endpoints and implement CSRF protection
• Keep middleware matcher narrow to avoid unnecessary verification on static assets

Example use cases

• Add GitHub and email/password providers with NextAuth and a credentials authorize callback
• Protect /dashboard and /api/protected via middleware that checks a session cookie or verifies a JWT
• Provide session data in server components using auth() and in client components with useSession and a SessionProvider
• Implement role-based pages by extending session types and redirecting non-admins to /unauthorized
• Switch session strategy to database with a Prisma adapter for long-lived sessions and revoke support