next-intl-add-language
github/awesome-copilot
Add new language support to Next.js + next-intl applications
What is next-intl-add-language?
Extends a Next.js application using next-intl with support for an additional language. Use this when you need to make your internationalized app available in a new language by translating content and updating routing configuration.
- Translate message files from English to the new language
- Update routing configuration in routing.ts to include the new language
- Update middleware.ts to handle the new language in request processing
- Add the new language option to the language-toggle UI component
- Ensure all JSON translation entries are complete for the new language
How to install next-intl-add-language
npx skills add https://github.com/github/awesome-copilot --skill next-intl-add-language- Existing Next.js project with next-intl already configured
- Access to ./messages directory containing en.json
- Familiarity with next-intl routing and middleware setup
How to use next-intl-add-language
- 1.Translate all content from en.json to the new language and create a new JSON file (e.g., es.json, fr.json)
- 2.Add the new language code to the locales array in src/i18n/routing.ts
- 3.Update src/middleware.ts to include routing rules for the new language
- 4.Add the new language option to the language selector in src/components/language-toggle.tsx
- 5.Test language switching and verify all translated content displays correctly
Use cases
- Adding Spanish, French, or German support to an existing multilingual Next.js app
- Expanding an English-only next-intl application to support a second language
- Localizing a SaaS product for a new market region
- Adding regional language variants to an existing language support
- Next.js developers
- Internationalization (i18n) implementers
- Full-stack developers managing multilingual applications
next-intl-add-language FAQ
All translations go in the ./messages directory as JSON files (e.g., en.json, es.json, fr.json).
Yes, the goal is to have all JSON entries translated in the new language for a complete translation.
You must update src/i18n/routing.ts and src/middleware.ts to add the new language to the routing configuration.
Users switch languages through the language-toggle component in src/components/language-toggle.tsx, which you must update with the new language option.
Full instructions (SKILL.md)
Source of truth, from github/awesome-copilot.
name: next-intl-add-language description: 'Add new language to a Next.js + next-intl application'
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.tssrc/middleware.ts
When adding a new language:
- Translate all the content of
en.jsonto 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.tsandmiddleware.ts. - Add the language to
language-toggle.tsx.
Related skills
More from github/awesome-copilot and the wider catalog.
git-commit
Execute semantic git commits with conventional message analysis and intelligent staging.
excalidraw-diagram-generator
Generate Excalidraw diagrams from natural language descriptions.
documentation-writer
Create structured technical documentation using the Diátaxis framework for tutorials, how-to guides, references, and explanations.
gh-cli
GitHub CLI comprehensive reference for repositories, issues, PRs, Actions, projects, releases, and all GitHub operations from the command line.
prd
Generate comprehensive Product Requirements Documents with executive summaries, user stories, technical specs, and risk analysis.
refactor
Surgical code refactoring to improve maintainability without changing behavior.