What problem does it solve?
This Skill helps you design, implement, and verify Next.js (App Router/Pages Router) solutions that follow the platform’s rendering, data-fetching, caching, and boundary rules—reducing bugs caused by mismatched static vs dynamic behavior and incorrect Server/Client usage.
Core Features & Use Cases
- Next.js rendering & caching strategy guidance: Choose between Static, ISR, Dynamic, PPR, and streaming patterns based on how the page’s content changes over time.
- Data fetching and revalidation patterns: Use Server Components, Suspense, parallel fetch (Promise.all), tag-based revalidation, and explicit fetch caching controls for Next.js 15.
- Safe architecture for UI and actions: Correctly separate Server Components from Client Components, implement Server Actions with input validation, and apply Route Handler/Middleware conventions.
Quick Start
Tell your AI exactly which Next.js route you are working on and what behavior you need (static/ISR/dynamic, data sources, and whether it needs interactivity), for example: “Review my app route implementation for caching and rendering correctness, propose the right rendering/data-fetch approach, and point out any Server/Client boundary mistakes.”
