Build Next.js 14+ App Router Architectures

Provides comprehensive patterns for Next.js 14+ App Router architecture, Server Components, and modern full-stack React development.

Use this skill when building a new Next.js application with the App Router, migrating from Pages Router to App Router, implementing Server Components and streaming, setting up parallel and intercepting routes, optimizing data fetching and caching, or building full-stack features with Server Actions. Not a fit for tasks unrelated to Next.js App Router patterns or for projects committed to staying on the Pages Router.

Covers building new applications on the App Router architecture, migrating existing Pages Router applications to App Router, implementing React Server Components alongside streaming for progressive page rendering, configuring parallel routes and intercepting routes for advanced routing scenarios, optimizing data fetching patterns and caching behavior, and building full-stack features using Server Actions for server-side mutations directly from components. Points to a detailed implementation playbook for concrete patterns and examples when deeper guidance beyond the core concepts is needed.

Full-stack React and Next.js developers building or migrating applications to the App Router who need structured guidance on Server Components, streaming, advanced routing, data fetching/caching, and Server Actions rather than piecing together App Router behavior from scattered documentation.