What problem does it solve?
This Skill prevents common Next.js App Router mistakes by giving consistent rules for RSC boundaries, async APIs, error handling, routing conventions, and performance/optimization practices.
Core Features & Use Cases
- Enforces App Router file conventions: Clarifies where special files like
page.tsx, layout.tsx, route.ts, and parallel/intercepting route files belong, reducing routing bugs.
- Detects RSC boundary violations: Guards against invalid async client components and non-serializable server-to-client props that cause runtime failures.
- Standardizes modern Next.js patterns: Covers async
params/searchParams, server vs route handler responsibilities, navigation/error behavior, metadata/OG image setup, and optimization for images/fonts/scripts/bundling.
Quick Start
Ask an AI to review a specific Next.js file or folder for RSC boundary issues, async API correctness, and metadata/image optimization compliance, then return a prioritized list of fixes.