🎯

i18n-localization

🎯Skill

from hainamchung/agent-assistant

VibeIndex|
What it does

Detects and helps resolve internationalization challenges by identifying hardcoded strings, managing translation files, and ensuring multi-language and RTL support across projects.

πŸ“¦

Part of

hainamchung/agent-assistant(227 items)

i18n-localization

Installation

npm installInstall npm package
npm install -g @namch/agent-assistant
git cloneClone repository
git clone https://github.com/hainamchung/agent-assistant.git
Node.jsRun Node.js server
node cli/install.js install cursor # Cursor
Node.jsRun Node.js server
node cli/install.js install claude # Claude Code
Node.jsRun Node.js server
node cli/install.js install copilot # GitHub Copilot

+ 7 more commands

πŸ“– Extracted from docs: hainamchung/agent-assistant
1Installs
-
AddedFeb 4, 2026

Skill Details

SKILL.md

Internationalization and localization patterns. Detecting hardcoded strings, managing translations, locale files, RTL support.

Overview

# i18n & Localization

> Internationalization (i18n) and Localization (L10n) best practices.

---

1. Core Concepts

| Term | Meaning |

|------|---------|

| i18n | Internationalization - making app translatable |

| L10n | Localization - actual translations |

| Locale | Language + Region (en-US, tr-TR) |

| RTL | Right-to-left languages (Arabic, Hebrew) |

---

2. When to Use i18n

| Project Type | i18n Needed? |

|--------------|--------------|

| Public web app | βœ… Yes |

| SaaS product | βœ… Yes |

| Internal tool | ⚠️ Maybe |

| Single-region app | ⚠️ Consider future |

| Personal project | ❌ Optional |

---

3. Implementation Patterns

React (react-i18next)

```tsx

import { useTranslation } from 'react-i18next';

function Welcome() {

const { t } = useTranslation();

return

{t('welcome.title')}

;

}

```

Next.js (next-intl)

```tsx

import { useTranslations } from 'next-intl';

export default function Page() {

const t = useTranslations('Home');

return

{t('title')}

;

}

```

Python (gettext)

```python

from gettext import gettext as _

print(_("Welcome to our app"))

```

---

4. File Structure

```

locales/

β”œβ”€β”€ en/

β”‚ β”œβ”€β”€ common.json

β”‚ β”œβ”€β”€ auth.json

β”‚ └── errors.json

β”œβ”€β”€ tr/

β”‚ β”œβ”€β”€ common.json

β”‚ β”œβ”€β”€ auth.json

β”‚ └── errors.json

└── ar/ # RTL

└── ...

```

---

5. Best Practices

DO βœ…

  • Use translation keys, not raw text
  • Namespace translations by feature
  • Support pluralization
  • Handle date/number formats per locale
  • Plan for RTL from the start
  • Use ICU message format for complex strings

DON'T ❌

  • Hardcode strings in components
  • Concatenate translated strings
  • Assume text length (German is 30% longer)
  • Forget about RTL layout
  • Mix languages in same file

---

6. Common Issues

| Issue | Solution |

|-------|----------|

| Missing translation | Fallback to default language |

| Hardcoded strings | Use linter/checker script |

| Date format | Use Intl.DateTimeFormat |

| Number format | Use Intl.NumberFormat |

| Pluralization | Use ICU message format |

---

7. RTL Support

```css

/ CSS Logical Properties /

.container {

margin-inline-start: 1rem; / Not margin-left /

padding-inline-end: 1rem; / Not padding-right /

}

[dir="rtl"] .icon {

transform: scaleX(-1);

}

```

---

8. Checklist

Before shipping:

  • [ ] All user-facing strings use translation keys
  • [ ] Locale files exist for all supported languages
  • [ ] Date/number formatting uses Intl API
  • [ ] RTL layout tested (if applicable)
  • [ ] Fallback language configured
  • [ ] No hardcoded strings in components

---

Script

| Script | Purpose | Command |

|--------|---------|---------|

| scripts/i18n_checker.py | Detect hardcoded strings & missing translations | python3 ~/.{TOOL}/skills/i18n-localization/scripts/i18n_checker.py |

More from this repository10

🎯
senior-devops🎯Skill

Skill

🎯
cpp-pro🎯Skill

Develops high-performance C++ applications with modern C++20/23 features, template metaprogramming, and zero-overhead systems design.

🎯
senior-architect🎯Skill

Designs scalable software architectures using modern tech stacks, generating architecture diagrams, analyzing dependencies, and providing system design recommendations.

🎯
senior-frontend🎯Skill

Generates, analyzes, and scaffolds modern frontend projects using ReactJS, NextJS, TypeScript, and Tailwind CSS with automated best practices.

🎯
spec-miner🎯Skill

Extracts and documents specifications from legacy or undocumented codebases by systematically analyzing code structure, data flows, and system behaviors.

🎯
docs-seeker🎯Skill

Searches and retrieves technical documentation by executing intelligent scripts across library sources, GitHub repos, and context7.com with automated query detection.

🎯
writing-plans🎯Skill

Generates comprehensive, step-by-step implementation plans for software features with precise file paths, test-driven development approach, and clear task granularity.

🎯
file path traversal testing🎯Skill

Tests and identifies potential file path traversal vulnerabilities in code by analyzing file path handling and input validation mechanisms.

🎯
nodejs-best-practices🎯Skill

Guides developers in making strategic Node.js architecture and framework decisions by providing context-aware selection principles and modern runtime considerations.

🎯
red-team-tactics🎯Skill

Simulates adversarial attack techniques across MITRE ATT&CK framework phases, mapping network vulnerabilities and demonstrating systematic compromise strategies.