nextjs-app-router

Architect Next.js 16 App Router apps with route groups and security patterns.

Updated Dec 26, 2025
One-click install
npx skills add https://github.com/ArtisanClarinets/crispy-fishstick --skill nextjs-app-router-artisanclarinets
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: nextjs-app-router
Source: https://github.com/ArtisanClarinets/crispy-fishstick/tree/main/.agent/skills/nextjs-app-router
Command: npx skills add https://github.com/ArtisanClarinets/crispy-fishstick --skill nextjs-app-router-artisanclarinets

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill enables building secure, modular Next.js 16 App Router architectures with clear surface separation, server components by default, and production-ready patterns.

Core Features & Use Cases

  • Route groups for surface separation across public, admin, and API surfaces.
  • Server components by default to optimize data handling and performance.
  • Security-first patterns including proxy-based checks, CSRF protection, and RBAC with tenant isolation.
  • Use Case: A team ships a multi-tenant admin portal with separate public site routes and API routes while maintaining strict security boundaries.

Quick Start

Use this Skill to scaffold a Next.js App Router project with (site)/(admin) surfaces and CSRF & RBAC protections.

Frequently Asked Questions about nextjs-app-router

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

FAQPage Schema
How do I structure route groups in Next.js App Router for separate public, admin, and API surfaces?

Route groups in the Next.js App Router organize separate public, admin, and API surfaces by grouping related routes without affecting the URL path. This enforces clear surface separation and strict security boundaries across different application modules.

How do I set up RBAC with tenant isolation in a Next.js server components architecture?

Set up RBAC with tenant isolation in Next.js server components using policy-driven security patterns. This approach enforces role-based access control directly within server components, securing multi-tenant admin portals while maintaining strict data boundaries.

What is the best way to implement CSRF protection in Next.js App Router applications?

The best way to implement CSRF protection in Next.js App Router applications is through security-first patterns that enforce proxy-based authentication checks. This validates requests server-side before they reach your API routes, preventing cross-site request forgery.

Can I use Next.js server components by default for multi-tenant admin portal security?

Yes, using Next.js server components by default optimizes data handling and performance for multi-tenant admin portals. This architecture enforces server-side proxy-based checks and RBAC, maintaining strict security boundaries across isolated tenant environments.

When do I need proxy-based auth checks in Next.js App Router route groups?

You need proxy-based auth checks in Next.js App Router route groups when managing multi-tenant admin portals with public site routes and API routes. This pattern ensures strict security boundaries and tenant isolation across all separated application surfaces.