i18n Next.js App Router avec next-intl
Ce tutoriel présente une configuration i18n propre et adaptée à la prod avec next-intl.
Ce que tu obtiens
/enet/fren préfixe d’URL- Les messages dans
messages/en.jsonetmessages/fr.json - Un
proxy.ts(Next.js 16) pour la négociation de locale - Un projet maintenable : structure claire, routing prévisible
Structure recommandée
app/[locale]/...pour les routes localiséesmessages/{locale}.jsonpour les traductionsi18n/request.tspour configurernext-intl
Pièges fréquents
- Oublier
proxy.ts(ou garder unmiddlewaredéprécié) - Ne pas gérer le fallback de locale par défaut
- Mélanger traduction serveur / client sans règle claire
Conseils pratiques
- Messages petits et bien groupés (
nav.*,contact.*,sections.*) - Un endpoint
/api/contactunique puis forwarding vers Formspree / email / CRM
Si tu veux, on peut ajouter un système de clés typées + un check CI pour détecter les traductions manquantes.
Quick commands
npm install
npm run dev