i18n-localization
It locates hardcoded strings in code and advises on implementing translation management, i18n libraries, and RTL layouts.
Install
mkdir -p .claude/skills/i18n-localization && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/769" && unzip -o skill.zip -d .claude/skills/i18n-localization && rm skill.zipInstalls to .claude/skills/i18n-localization
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
Internationalization and localization patterns. Detecting hardcoded strings, managing translations, locale files, RTL support.Key capabilities
- →Detect hardcoded strings in source code
- →Implement translation management patterns
- →Configure locale files and namespaces
- →Apply RTL layout support
- →Format dates and numbers per locale
How it works
The skill uses scripts to scan for hardcoded strings and provides patterns for integrating i18n libraries like react-i18next or next-intl. It enforces the use of translation keys and ICU message formats for complex strings.
Inputs & outputs
When to use i18n-localization
- →Extract hardcoded strings
- →Implement translation files
- →Configure RTL support
- →Add locale support to React
About this skill
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)
import { useTranslation } from 'react-i18next';
function Welcome() {
const { t } = useTranslation();
return <h1>{t('welcome.title')}</h1>;
}
Next.js (next-intl)
import { useTranslations } from 'next-intl';
export default function Page() {
const t = useTranslations('Home');
return <h1>{t('title')}</h1>;
}
Python (gettext)
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 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 | python scripts/i18n_checker.py <project_path> |
When not to use it
- →Single-region applications
- →Projects where internationalization is not a requirement
Limitations
- →Requires manual configuration of fallback languages
- →RTL support requires specific CSS logical property implementation
How it compares
It provides a systematic approach to extracting and managing translations rather than manual string replacement.
Compared to similar skills
i18n-localization side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| i18n-localization (this skill) | 15 | 6mo | Review | Intermediate |
| engineering-skills | 4 | 2mo | Review | Intermediate |
| podcast-generation | 1 | 3mo | Review | Advanced |
| prowler | 0 | 3mo | Review | Beginner |
Try saying
Example prompts that trigger this skill in your AI assistant.
More by davila7
View all by davila7 →You might also like
engineering-skills
alirezarezvani
23 production-ready engineering skills covering architecture, frontend, backend, fullstack, QA, DevOps, security, AI/ML, data engineering, computer vision, and specialized tools like Playwright Pro, Stripe integration, AWS, and MS365. 30+ Python automation tools (all stdlib-only). Works with Claude Code, Codex CLI, and OpenClaw.
podcast-generation
microsoft
Generate AI-powered podcast-style audio narratives using Azure OpenAI's GPT Realtime Mini model via WebSocket. Use when building text-to-speech features, audio narrative generation, podcast creation from content, or integrating with Azure OpenAI Realtime API for real audio output. Covers full-stack implementation from React frontend to Python FastAPI backend with WebSocket streaming.
prowler
prowler-cloud
Main entry point for Prowler development - quick reference for all components. Trigger: General Prowler development questions, project overview, component navigation (NOT PR CI gates or GitHub Actions workflows).
dev-builder
zinohome
你是全栈开发工程师,负责根据产品需求文档(Product-Spec.md)和原型图(如有)实现功能代码。你的核心职责是:
instrument-logs
PostHog
>-
mcp-builder
anthropics
Guide for creating high-quality MCP (Model Context Protocol) servers that enable LLMs to interact with external services through well-designed tools. Use when building MCP servers to integrate external APIs or services, whether in Python (FastMCP) or Node/TypeScript (MCP SDK).