What problem does it solve? Next.js App Router introduces many architectural decisions—Server vs Client Components, caching layers, route conventions, and Server Actions—that developers often get wrong, leading to bloated client bundles, poor performance, and broken data flows. This Skill provides structured guidance to make the right choice every time. ## Core Features & Use Cases - Component Architecture Guidance: Decision trees for choosing Server vs Client Components and splitting mixed-interactivity UI correctly. - Data Fetching & Caching Patterns: Covers static rendering, ISR revalidation, no-store dynamic fetching, and on-demand revalidation with tags. - Routing & Project Structure: Documents file conventions (page, layout, loading, error, not-found), route groups, parallel routes, and intercepting routes. - Use Case: When building a dashboard page that fetches database data and includes an interactive form, use this Skill to structure a Server Component parent that fetches data, a Client Component child for the form, and a Server Action for the mutation with proper revalidation. ## Quick Start Review my Next.js App Router page and tell me whether each component should be a Server or Client Component with correct data fetching and caching.
