app-router
CommunityMaster Next.js App Router with server components.
System Documentation
What problem does it solve?
Next.js App Router introduces advanced routing patterns and server/client components which can be complex to architect and maintain. This Skill provides clear guidance and practical examples to implement layouts, route groups, and parallel routes in Next.js 14+ projects, reducing ambiguity and ramp-up time for developers.
Core Features & Use Cases
- Server Components by default: promote performance and SEO-friendly rendering.
- Client Components when needed: controlled interactivity with 'use client'.
- Layouts and Route Patterns: root layouts, nested layouts, templates, and route groups.
- Parallel Routes and Intercepting Routes: patterns for advanced UI composition and routing behavior. Use Case: Build an admin dashboard with shared layouts and separate parallel routes for analytics and management panels.
Quick Start
Use the skill to scaffold and validate App Router patterns in your Next.js project. Start by describing your task to Claude Code as: app-router - [your task description], then consult the references for concrete examples and best practices.
Dependency Matrix
Required Modules
Components
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: app-router Download link: https://github.com/pluginagentmarketplace/custom-plugin-nextjs/archive/main.zip#app-router Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.