Comment ajouter mes premières clés de traduction ?

Les clés de traduction sont le pont entre votre code et vos traductions. Découvrez trois méthodes : scan CLI, ajout manuel dans le tableau de bord, ou via un agent IA avec MCP.

5 min de lectureDébutant

Les clés de traduction sont le pont entre votre code et vos traductions. Il existe trois façons de les ajouter.

Option A : Scanner votre base de code avec le CLI (recommandé)

Le CLI trouve automatiquement tous les appels t() dans votre code et les synchronise avec Better i18n.

# Installer le CLI
bun add -g @better-i18n/cli

# Se connecter
better-i18n login

# Scanner votre projet
better-i18n scan

Le scanner détecte des motifs comme :

  • t('key.name') — appels de traduction standard
  • t('namespace:key.name') — clés avec espace de noms
  • useTranslations('namespace') — déclarations d'espace de noms

Après le scan, exécutez better-i18n sync pour pousser les clés découvertes vers le tableau de bord.

Option B : Ajouter des clés manuellement dans le tableau de bord

  1. Accédez à votre projet dans le tableau de bord
  2. Cliquez sur "Ajouter une clé"
  3. Saisissez le nom de la clé (ex. common.save_button)
  4. Ajoutez la valeur dans la langue source (ex. « Save »)
  5. Ajoutez optionnellement un contexte pour aider les traducteurs à comprendre où la clé est utilisée

Option C : Utiliser un agent IA avec MCP

Si vous utilisez Claude Code, Cursor, ou un autre agent compatible MCP, le serveur MCP Better i18n peut créer des clés directement :

"Ajoute une clé de traduction common.welcome_message avec la valeur 'Welcome back!'"

L'agent utilisera l'outil createKeys pour l'ajouter à votre projet.

Bonnes pratiques de nommage des clés

Motif Exemple Quand l'utiliser
namespace.descriptor common.save Éléments UI partagés
page.section.element settings.profile.title Contenu spécifique à une page
feature.action auth.login_button Spécifique à une fonctionnalité

Conseils :

  • Utilisez la notation pointée pour la hiérarchie : settings.profile.title
  • Utilisez des espaces de noms pour regrouper les clés liées : common, auth, dashboard
  • Ajoutez du contexte aux clés ambiguës pour que les traducteurs comprennent l'intention
  • Gardez les clés descriptives mais concises

Vérifiez vos clés

Après avoir ajouté des clés, exécutez better-i18n check pour vérifier que tout est synchronisé :

better-i18n check
# ✓ 42 keys in sync
# ⚠ 3 keys in code but not in dashboard
# ⚠ 1 key in dashboard but not in code

Prochaines étapes