Next Intl Add Language
Add a full new locale to a Next.js app using next-intl by translating messages and updating routing, middleware, and the language toggle.
Overview
next-intl-add-language is an agent skill for the Build phase that adds a complete new language to a Next.js + next-intl app via messages, routing, middleware, and UI toggle updates.
Install
npx skills add https://github.com/github/awesome-copilot --skill next-intl-add-languageWhat is this skill?
- Full translation of `en.json` into a new locale under `./messages`
- Updates to `src/i18n/routing.ts` and `src/middleware.ts` for the new language path
- Wires the locale into `src/components/language-toggle.tsx`
- Assumes next-intl as the i18n stack for the project
Adoption & trust: 8.8k installs on skills.sh; 34.6k GitHub stars; 3/3 security scanners passed (skills.sh audits).
What problem does it solve?
You need another locale in your Next.js app but are unsure which next-intl files must change for routing and a complete translation.
Who is it for?
Indie SaaS or marketing sites on Next.js with next-intl already configured and a clear `en.json` source of truth.
Skip if: Projects using react-i18next only, static sites without next-intl, or apps that need SEO/geo strategy before any locale work.
When should I use this skill?
Adding a new supported language to an existing Next.js project that uses next-intl.
What do I get? / Deliverables
A new language appears in the toggle with full message parity and correct middleware/routing paths for that locale.
- New locale message JSON
- Updated routing and middleware
- Language entry in language-toggle component
Recommended Skills
Journey fit
Internationalization is implemented in the product UI and routing layer during active frontend build work. All steps target Next.js pages, `./messages` JSON, middleware, routing config, and `language-toggle.tsx`—classic frontend i18n delivery.
How it compares
A step-by-step next-intl wiring guide, not a journey-wide i18n methodology or CMS translation pipeline.
Common Questions / FAQ
Who is next-intl-add-language for?
Solo builders maintaining a Next.js app with next-intl who want an agent to add a locale without missing routing or message files.
When should I use next-intl-add-language?
In Build when you are ready to ship an additional language and already have `language-toggle.tsx`, `./messages`, and i18n routing in place.
Is next-intl-add-language safe to install?
It describes filesystem edits to your repo only; confirm source trust and review the Security Audits panel on this Prism page before install.
SKILL.md
READMESKILL.md - Next Intl Add Language
This is a guide to add a new language to a Next.js project using next-intl for internationalization, - For i18n, the application uses next-intl. - All translations are in the directory `./messages`. - The UI component is `src/components/language-toggle.tsx`. - Routing and middleware configuration are handled in: - `src/i18n/routing.ts` - `src/middleware.ts` When adding a new language: - Translate all the content of `en.json` to the new language. The goal is to have all the JSON entries in the new language for a complete translation. - Add the path in `routing.ts` and `middleware.ts`. - Add the language to `language-toggle.tsx`.