with one click
nextjs16-skills
Key facts and links for Next.js 16. Use for planning, writing, and troubleshooting Next.js 16 changes.
Menu
Key facts and links for Next.js 16. Use for planning, writing, and troubleshooting Next.js 16 changes.
| name | nextjs16-skills |
| description | Key facts and links for Next.js 16. Use for planning, writing, and troubleshooting Next.js 16 changes. |
# Automated upgrade
npx @next/codemod@canary upgrade latest
# Manual upgrade
npm install next@latest react@latest react-dom@latest
# New project
npx create-next-app@latest
Codemod covers (high-level): moves Turbopack config, migrates next lint → ESLint CLI, migrates middleware → proxy, removes some unstable_ prefixes, removes route-level experimental_ppr.
TypeScript: also upgrade @types/react and @types/react-dom.
"use cache" directive; evolves/absorbs PPR.proxy.ts: clearer network boundary; middleware.ts deprecated for most use.next dev and build timing output.next dev --webpack, next build --webpack).webpack config, next build may fail (to prevent misconfiguration). Fix by migrating config, using next build --webpack, or using Turbopack and removing/ignoring the webpack config.experimental.turbopack → top-level turbopack in next.config.*.~ prefix (e.g. @import 'bootstrap/...';).fs). If unavoidable, use turbopack.resolveAlias as a stopgap.experimental.turbopackFileSystemCacheForDev: true.reactCompiler: true (expect higher build/compile cost).revalidateTag(tag, profile) now requires a cacheLife profile (or { expire }) for SWR behavior.updateTag(tag) (Server Actions only): read-your-writes semantics.refresh() (Server Actions only): refresh uncached data; does not mutate cache.cacheLife and cacheTag are stable (no unstable_ prefix).await params, await searchParams, await cookies(), await headers(), await draftMode().npx next typegen can generate helpers like PageProps, LayoutProps, RouteContext to migrate params/searchParams types safely.opengraph-image, twitter-image, icon, apple-icon now receive params (and id) as Promises in the image function.sitemap({ id }) now receives id as a Promise when using generateSitemaps.default.js.next/image defaults changed (cache TTL, sizes/qualities); local src with query strings requires images.localPatterns.Other notable behavior changes:
next dev and next build use separate output dirs (next dev → .next/dev) and a lockfile prevents concurrent instances.scroll-behavior: smooth during navigations; add data-scroll-behavior="smooth" on <html> to restore the previous override behavior.@next/eslint-plugin-next defaults to ESLint Flat Config; legacy .eslintrc projects may need migration.next lint (use ESLint/Biome directly); eslint option in next.config.*; serverRuntimeConfig/publicRuntimeConfig (use env vars); experimental.ppr + route-level experimental_ppr; unstable_rootParams.middleware.ts filename (prefer proxy.ts); next/legacy/image; images.domains (prefer images.remotePatterns); revalidateTag(tag) single-arg form.proxy.ts note: proxy runs on nodejs only; Edge runtime is not supported in proxy. Keep middleware.ts if you must stay on Edge.skipMiddlewareUrlNormalize → skipProxyUrlNormalize.next build (or the project's equivalent) was run and completed without errors; the build output / route table is capturednext dev was loaded and the touched routes were rendered without console warnings or hydration mismatchesrevalidate, dynamic) is set explicitly on new data fetches, not left to defaultstsc --noEmit, next lint) pass on the changed files; output is in the transcriptCanonical workflow for "drive my business" / "operate this company". Single entry point — branches internally to onboard (new), Phase 11 plan (existing without strategy), or execute (existing with strategy).
Phase 11 procedure — capabilities → set_strategy_inputs → plan → apply → approve, plus 3-path blocker resolution (ask / build / defer). Covers WHOLE business surface via injected OPERATIONAL CONTEXT, not just what_we_sell.
Per-company trust state procedure (learning / trial / operating). When a live outreach tool refuses, names the canonical draft replacement.
Produce a voice contract from operator-curated exemplars (Phase 10). Triggered by exemplar paths, voice intent, or draft lint failure.
Marketing-strategy foundations distilled from the Phase 11 strategy generator. Use BEFORE drafting a strategy or proposing tactics so output reflects the PESO / RACE / STDC / JTBD frameworks and avoids generic agency clichés. Pairs with the `company_plan` tool — this skill is the meta-grounding; the tool runs the full LLM strategy generation.
Anti-slop principles for B2C social posts and outreach. Use BEFORE drafting an email, X post, or prospect message so the body reads like a person, not an LLM. Pairs with the Phase 10 voice contract (data/companies/<slug>/voice.yaml) — this skill is the meta-principles; voice.yaml is the per-company specifics. Distilled from public marketing patterns (jackfriks/b2c-marketing on ClawHub) — not a copy.