Profile My skills Saved My plugins Edit profile Submit a skill

Nextjs App Router Patterns

Architect and implement modern Next.js App Router applications with Server Components (RSC), Server Actions, Parallel/Intercepting Routes, and Streaming SSR.

pedroiff0 Updated
Web & Frontend

File contents

Next.js App Router Architecture & Patterns

Best practices for structuring modern full-stack web applications using React Server Components and Next.js App Router.

Key Principles

  1. Default to Server Components: Keep data fetching on the server; only mark components with client directive when browser APIs, event listeners, or hooks are needed.
  2. Colocation of Route Segments: Structure routes using folder hierarchies with page.tsx, layout.tsx, loading.tsx, and error.tsx.
  3. Mutations via Server Actions: Use server action functions for forms and state mutations with revalidatePath and revalidateTag.

pedroiff0/awesome-skills/tree/main/skills/web/nextjs-app-router-patterns commit 39245f86db

Browse category

Frequently asked questions

npx skillmds@latest add pedroiff0/nextjs-app-router-patterns