middleware-patterns

Centralizes authentication checks in Next.js middleware to protect routes.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/vassovass/scl-v3 --skill middleware-patterns
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: middleware-patterns
Source: https://github.com/vassovass/scl-v3/tree/main/.claude/skills/middleware-patterns
Command: npx skills add https://github.com/vassovass/scl-v3 --skill middleware-patterns

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Next.js middleware runs before every request. StepLeague uses it for auth protection and redirects.

Core Features & Use Cases

  • Protected routes: pattern-based guard for dashboards, leagues, and admin sections.
  • Auth redirects with URL preservation: preserve full original URL when redirecting to sign-in.
  • Edge-runtime friendly: avoids non-edge APIs and checks cookies directly in middleware.
  • Header injection: add downstream headers for layouts and debugging.

Quick Start

Review and adapt your app's src/middleware.ts to define protected paths, implement an auth check, and configure a safe matcher. Then run the dev server and test redirects for both authenticated and unauthenticated users.

Frequently Asked Questions about middleware-patterns

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I protect Next.js routes with authentication in middleware?

Next.js middleware runs before every request and can protect routes by centralizing authentication checks. Define protected paths in your middleware matcher, implement an auth check against cookies, and redirect unauthenticated users to sign-in while preserving the original URL for post-login navigation.

Can I redirect users to sign-in without losing their original URL in Next.js?

Yes. Middleware can capture the full original URL before redirecting to sign-in, then pass it as a query parameter or state. After authentication succeeds, your app redirects users back to their intended destination instead of a default page.

What's the best way to implement edge-runtime-safe authentication checks in Next.js?

Edge-runtime middleware must avoid non-edge APIs. Check authentication by reading cookies directly in middleware rather than calling external services or Node.js-only libraries. This keeps your auth logic fast and deployable to edge functions.

How do I guard dashboard and admin sections in a Next.js app?

Use middleware with a pattern-based matcher to identify protected routes like `/dashboard`, `/league`, and `/admin`. Implement an auth check for each request to those paths and redirect unauthenticated visitors to your sign-in page.

Can I add custom headers to downstream requests in Next.js middleware?

Yes. Middleware can inject headers before requests reach your application. This is useful for passing auth context to layouts, enabling debugging, or signaling request metadata to your API routes and server components.

Do middleware patterns work for multi-tenant or role-based access in Next.js?

Middleware patterns handle route-level protection by checking auth state. For role-based or tenant-specific access control beyond route matching, combine middleware guards with component-level checks or API middleware that inspect user claims and permissions.