← ClaudeAtlas

nextjs-locale-standalonelisted

Add locale-prefixed i18n routing to a single (non-monorepo) Next.js App Router site — a middleware/proxy that redirects `/` and any unprefixed path to `/<locale>/…` using the locale toggle's last choice (the NEXT_LOCALE cookie) then the browser's Accept-Language, a `[locale]` layout with a LocaleProvider + hooks, and a LocaleToggle that persists the choice. Use when adding bilingual/multilingual routing to a standalone Next.js site, building `/en-hk/…` `/zh-hk/…` URL namespaces, redirecting the root to a default-or-remembered locale, persisting a language switch across visits, or detecting browser language in middleware. For a monorepo that shares this logic across several apps via a workspace package, use nextjs-locale-monorepo instead.
stealth-engine/skills · ★ 2 · Web & Frontend · score 76
Install: claude install-skill stealth-engine/skills
# Next.js locale routing — standalone site Locale-prefixed routing for one Next.js App Router app, no shared package. Every page lives under `/<locale>/…`; a proxy (middleware) sends unprefixed requests to the right locale. Drop-in copy-paste files are in [`templates/`](./templates). > Sibling skill: **nextjs-locale-monorepo** — the same behaviour factored into a > shared workspace package for multi-app repos. Keep the two in sync. ## The behaviour (the spec both skills implement) - **URLs are locale-namespaced:** `/en-hk/about`, `/zh-hk/about`. One locale is the default. - **The proxy redirects unprefixed paths.** A request to `/about` (or `/`) with no known locale prefix is 307-redirected to `/<locale>/about`, preserving the query string. (URL hashes are client-side only — they never reach the server, so the proxy can't and needn't carry them; the LocaleToggle, running in the browser, does preserve the hash.) The locale is resolved by this **priority**: 1. **`NEXT_LOCALE` cookie** — the toggle's last choice (if the visitor has ever switched). 2. **`Accept-Language`** — the browser's preferred language (exact match, then language-only, e.g. `zh` → `zh-hk`). 3. **Default locale.** - **Already-prefixed paths pass through** (`NextResponse.next()`), and the proxy stamps the response: `x-locale` header and a (re)write of `NEXT_LOCALE` when it differs. It does **not** add `Vary: Accept-Language, Cookie` here — on a prefixed path the locale is fixed by the