What problem does it solve? Building a production Next.js application requires coordinating many decisions—server vs client components, caching strategies, authentication, database access, error handling, and deployment—and getting any of them wrong leads to slow pages, security gaps, or broken builds. This Skill provides a complete, opinionated reference of App Router patterns so you can implement each layer correctly the first time. ## Core Features & Use Cases - App Router Architecture: File-based routing conventions, layouts, route groups, dynamic routes, and route handlers with clear guidance on when to use server vs client components. - Data Fetching & Mutations: Parallel fetching, streaming with Suspense, Server Actions with useFormStatus/useActionState, and caching strategies including ISR and tag-based revalidation. - Full-Stack Concerns: Middleware-based authentication, Prisma database setup with a data access layer, metadata/SEO generation, and error boundaries. - Use Case: You are scaffolding a new Next.js dashboard with login-protected pages and a Postgres backend. Use this Skill to set up middleware auth, a cached getUser helper, Prisma client singleton, server-action form handling, and a deployment checklist covering security headers and monitoring. ## Quick Start Ask the AI to scaffold a Next.js App Router page with server-side data fetching, a server action form, and middleware authentication for a protected dashboard route.
