Use when building Next.js 14+ applications with App Router, server components, or server actions. Invoke to configure route handlers, implement middleware, set up API routes, add streaming SSR, write generateMetadata for SEO, scaffold loading.tsx/error.tsx boundaries, or deploy to Vercel. Triggers on: Next.js, Next.js 14, App Router, RSC, use server, Server Components, Server Actions, React Server Components, generateMetadata, loading.tsx, Next.js deployment, Vercel, Next.js performance.
97
100%
Does it follow best practices?
Impact
95%
1.13xAverage score across 6 eval scenarios
Passed
No known issues
App Router structure with SEO and component boundaries
App Router structure
100%
100%
No pages/ directory
100%
100%
TypeScript strict mode
100%
100%
Metadata API usage
100%
100%
Per-page metadata
100%
100%
next/image for banner
100%
100%
'use client' on testimonials only
100%
100%
Server Components by default
100%
100%
Loading boundary
100%
100%
Error boundary
100%
100%
Root layout present
100%
100%
Data fetching with caching, ISR, and streaming
No-store for live data
100%
100%
Revalidate for periodic data
100%
100%
Hourly revalidation value
100%
100%
Native fetch used
100%
100%
Suspense for streaming
100%
100%
Parallel fetch with Promise.all
0%
0%
React cache deduplication
100%
100%
Server Components for fetching
100%
100%
Cache tags applied
0%
0%
Error handling present
100%
100%
Server actions with validation and form state
'use server' directive
100%
100%
Zod/TypeBox validation
0%
100%
Schema covers all fields
50%
100%
Auth check before mutation
100%
100%
Error objects returned
100%
100%
revalidatePath called
0%
100%
useFormState used
0%
100%
useFormStatus for pending
0%
100%
'use client' on form
100%
100%
Validation errors displayed
100%
100%
Route Handlers and API architecture
app/api/ directory
100%
100%
route.ts filename
100%
100%
NextRequest parameter type
100%
100%
NextResponse.json() usage
100%
100%
Named HTTP method exports
100%
100%
Dynamic route handler params
100%
100%
Explicit fetch caching
100%
80%
HTTP status codes
100%
100%
No Pages Router API
100%
100%
TypeScript types
100%
100%
Error response handling
100%
100%
loading.tsx/error.tsx present
100%
100%
Static generation with dynamic routes
generateStaticParams function
100%
100%
Return shape from generateStaticParams
100%
100%
Catch-all or optional catch-all route
100%
100%
export const revalidate
100%
100%
export const dynamic usage
0%
50%
Explicit fetch cache options
0%
62%
App Router structure
100%
100%
loading.tsx present
100%
100%
error.tsx present
100%
100%
generateMetadata or metadata export
100%
100%
Server Components default
100%
100%
Production deployment configuration
standalone output mode
100%
100%
Docker multi-stage build
100%
100%
Standalone artifacts copied
100%
100%
NEXT_PUBLIC_ prefix for client vars
100%
100%
Server-only vars unprefixed
100%
100%
Image formats config
100%
100%
remotePatterns for images
100%
100%
TypeScript strict mode
100%
100%
Non-root Docker user
100%
100%
NEXT_TELEMETRY_DISABLED
100%
100%
Security headers configured
0%
100%
compress enabled
100%
100%
5b76101
Table of Contents
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.