What problem does it solve? Building production Next.js applications requires navigating App Router conventions, four overlapping caching layers, Server Component boundaries, and rendering strategy tradeoffs that are easy to get wrong. This Skill provides structured guidance and working code patterns so developers make correct architectural decisions without trial and error. ## Core Features & Use Cases - App Router Architecture: Covers nested layouts, route groups, dynamic routes, parallel routes, intercepting routes, and the "use client" boundary rule with a rendering strategy decision tree (Static, ISR, Dynamic, Streaming). - Data Fetching & Caching: Documents Server Component fetch, request memoization, the four caching layers, time-based and on-demand revalidation with revalidatePath/revalidateTag, and Suspense streaming patterns. - Server Actions & Mutations: Provides validated form actions with Zod, useActionState, optimistic updates, file uploads, and security rules for authentication and authorization checks. - Complete Implementation Examples: Includes full CRUD pattern, JWT auth with middleware and role-based access, and dynamic OG image generation with ImageResponse. - Use Case: When building a product page that mixes mostly-static content with real-time inventory, the Skill guides you to cache the product fetch with revalidate tags, use cache: 'no-store' for inventory, and stream slow sections behind Suspense boundaries. ## Quick Start Ask the assistant to help you build a Next.js App Router page with server-side data fetching, a Server Action mutation, and proper cache revalidation.
