Agent Skills: Next.js Best Practices

Next.js App Router development standards. Triggers when working with Next.js applications, Server Components, Server Actions, or App Router patterns.

UncategorizedID: jcastillotx/vibe-skeleton-app/nextjs-best-practices

Install this agent skill to your local

pnpm dlx add-skill https://github.com/jcastillotx/vibe-skeleton-app/tree/HEAD/setup/skills/nextjs-best-practices

Skill Files

Browse the full folder contents for nextjs-best-practices.

Download Skill

Loading file tree…

setup/skills/nextjs-best-practices/SKILL.md

Skill Metadata

Name
nextjs-best-practices
Description
Next.js App Router development standards. Triggers when working with Next.js applications, Server Components, Server Actions, or App Router patterns.

Next.js Best Practices

Comprehensive coding standards for Next.js App Router applications, optimized for AI agents and LLMs.

Overview

This skill provides 24 rules organized across 8 performance categories:

  1. App Router (app-) - Server Components, layouts, loading states [CRITICAL]
  2. Data Fetching (fetch-) - Caching, revalidation, streaming [CRITICAL]
  3. Server Actions (actions-) - Form handling, mutations, optimistic updates [HIGH]
  4. Rendering (render-) - SSR vs SSG vs ISR, dynamic vs static [HIGH]
  5. Middleware (middleware-) - Edge functions, redirects, rewrites [MEDIUM-HIGH]
  6. Asset Optimization (assets-) - next/image, next/font, placeholders [MEDIUM]
  7. Route Handlers (routes-) - API endpoints, streaming responses [MEDIUM]
  8. Deployment (deploy-) - Vercel config, edge runtime, static export [LOW-MEDIUM]

Usage

Reference this skill when:

  • Building new Next.js applications
  • Migrating from Pages Router to App Router
  • Optimizing Next.js performance
  • Implementing Server Components or Server Actions
  • Configuring caching and revalidation strategies

Build

pnpm build    # Compile rules to AGENTS.md
pnpm validate # Validate rule files