What problem does it solve? Next.js 16 introduces breaking changes like Promise-based route params, Turbopack route collisions, and Cache Components that cause silent production failures even when code compiles and dev mode works fine. This Skill provides the correct patterns, gotcha fixes, and production checklists so your App Router code works in real deployments, not just locally. ## Core Features & Use Cases - Next.js 16 Gotcha Fixes: Correct handling of Promise-based params and searchParams, avoidance of app/sitemap.ts vs app/sitemap/page.tsx route collisions, and build-time verification before pushing. - Full App Router Coverage: Server and Client Components, Server Actions, route handlers, middleware, metadata generation, streaming with Suspense, and error boundaries. - Data & Caching Strategies: fetch caching modes, ISR revalidation, tag-based invalidation, and Cache Components (cacheComponents: true with 'use cache'). - Use Case: Your dynamic route works in next dev but 404s in production. The Skill identifies the synchronous params access, rewrites the page as an async component awaiting params, and reminds you to run next build before pushing. ## Quick Start Ask the agent to review or build a Next.js App Router page, for example: "Fix my dynamic post page that 404s in production and add proper metadata generation."
