skills.rest
Hallinna
HallinnaCOMMUNITY
Explore all skills by this author →
GitHub

i18n-management

Audit React translation keys for completeness across en, de, fr locales.

Updated Mar 12, 2026
Search Tags:#accessibility#React#i18n#translations#locale consistency#key auditing
One-click install
npx skills add https://github.com/Hallinna/interveiw-study-2026 --skill i18n-management
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: i18n-management
Source: https://github.com/Hallinna/interveiw-study-2026/tree/main/.claude/skills/i18n-management
Command: npx skills add https://github.com/Hallinna/interveiw-study-2026 --skill i18n-management

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill prevents broken or incomplete user interfaces by ensuring translation keys and user-visible strings stay synchronized across English, German, and French.

Core Features & Use Cases

  • Single source of truth: Use src/i18n/translations.ts as the authoritative place where all locale text is defined.
  • Locale completeness guarantees: Enforce that every key exists in en, de, and fr with no partial updates.
  • Safe auditing for drift: Audit for missing keys across locales and identify hardcoded strings in src/ that bypass the translation system.

Quick Start

Update src/i18n/translations.ts by adding or changing the required translation keys in all three en, de, and fr entries, then verify correctness by running npm run build and npm run lint.

Frequently Asked Questions about i18n-management

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I keep React translations consistent across multiple locales?▼

To keep React translations consistent across multiple locales, maintain a single source of truth in `src/i18n/translations.ts` and enforce that every translation key exists in `en`, `de`, and `fr` with no partial updates. Use camelCase key structure and verify changes by running `npm run build` and `npm run lint`.

What is the best way to audit missing translation keys in a React codebase?▼

The best way to audit missing translation keys is to check locale completeness across `en`, `de`, and `fr`, and scan `src/` for hardcoded strings that bypass the translation system, ensuring no locale lags behind another.

Do accessibility labels like aria-label need to be included in i18n translations?▼

Yes, accessibility labels like `aria-label`, `title`, and visible attribute text must be included in i18n translations because they are user-visible strings requiring translation to maintain locale consistency.

How do I add a new translation key for English, German, and French?▼

To add a new translation key, update `src/i18n/translations.ts` by defining the key using a camelCase structure in all three `en`, `de`, and `fr` entries, then verify correctness by running `npm run build` and `npm run lint`.

Why does my React UI show incomplete text after adding new translation strings?▼

Your React UI shows incomplete text because of locale drift, which happens when partial updates leave missing keys in `en`, `de`, or `fr`; auditing locale completeness ensures all keys exist across every supported locale.

Related Skills

Explore More Software Engineering Skills→
Nick777-PixelNick777-Pixel

i18n

Manage localized text in React apps using react-i18next and pnpm i18n.

Community
Intermediate
elbwalkerelbwalker
342

walkeros-understanding-development

Guide walkerOS contributors through npm-based build, test, and lint workflows.

Official
Intermediate
mateo19182mateo19182

i18n

Automate React i18n tasks by extracting hardcoded strings and replacing them with translation keys.

Community
Intermediate
grafanagrafana
19

i18n-sync

Detect translation gaps and stub missing keys across locale files.

Official
Intermediate