Next.js Design Patterns Skill

This skill defines proven architectural approaches, design patterns, and team-level standards for modern Next.js (App Router) applications. The goal is to produce applications that are readable, easy to maintain, high-performing, and scalable over the long term.

The skill provides guidance on project structure, component architecture, data fetching strategies, routing, API design, state management, and performance optimization.

When to use this skill

• When designing the architecture of a new Next.js project
• When refactoring an existing Next.js codebase
• When establishing enterprise-level frontend standards
• When defining shared folder structures and coding conventions within a team
• When analyzing performance, bundle size, or data-fetching issues
• When clarifying Server Component / Client Component boundaries
• When building dashboards, admin panels, or feature-heavy applications

How to use this skill

1. Project Structure Decisions