nextjs

Use when working with Next.js App Router, React Server Components, server actions, layouts, metadata API, or caching. Also use when configuring Next.js middleware/proxy, optimizing images/fonts, or debugging hydration errors.

Model	Source
sonnet	pack: frontend

Full Reference

┏━ 🔧 nextjs ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓ ┃ Use when working with Next.js App Router, Reac… ┃ ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛

Next.js App Router

Next.js (v16.1.6 LTS, February 2026) is a React framework with file-system routing, React Server Components, and a multi-layer caching model. The App Router is the default and only actively developed router. Turbopack is now the default bundler for both dev and build.

Item	Value
Current Version	16.1.6 LTS (February 2026)
Install	npx create-next-app@latest
Config	next.config.ts (TypeScript-native)
Dev	next dev (Turbopack default)
Build	next build (Turbopack default)
Node.js	20.9.0+
React	19.2
Docs	https://nextjs.org/docs

Reference Index

I want to…	File
File conventions, layouts, templates, next.config.ts	reference/project-structure.md
Server vs Client Components, 'use client', 'use server'	reference/server-components.md
Dynamic routes, route groups, parallel routes, route handlers	reference/routing.md
Data fetching, use cache, Server Actions, useActionState, useOptimistic	reference/data-fetching.md
Caching layers, revalidation, revalidateTag, updateTag	reference/caching.md
Metadata API, OG images, next/image, next/font	reference/assets-and-seo.md
proxy.ts, middleware.ts, auth guards, geo routing	reference/middleware.md
error.tsx, not-found.tsx, global-error.tsx, instrumentation.ts	reference/error-handling.md
Next.js 15→16 breaking changes, deprecations, migration codemods	reference/migrations.md

Usage: Read the reference file matching your current task from the index above. Each file is self-contained with code examples and inline gotchas.

Load only the reference docs relevant to the current task.

Breaking Changes Quick Reference

Was	Now
middleware.ts	proxy.ts (export proxy fn)
fetch cached by default	NOT cached — opt in with cache: 'force-cache'
await params optional	Required in Next.js 15+
useFormState (react-dom)	useActionState (react)
experimental.ppr / dynamicIO	cacheComponents: true
revalidateTag(tag)	revalidateTag(tag, 'max')
unstable_cache	'use cache' directive
images.domains	images.remotePatterns
Node.js 18	Node.js 20.9.0+ required