internationalization-i18n
Build globally accessible applications by implementing language switching, translation workflows, and locale-specific formatting. This skill covers i18next setup for React, pluralization rules, date and number formatting using the Intl API, and right-to-left language support with CSS logical properties. Includes best practices for string extraction, pseudo-localization testing, and production translation workflows.
Internationalization (i18n) adds multi-language support to applications using i18next, gettext, or Intl APIs with translation management and RTL formatting.
AI-generated summary based on this skill's SKILL.md
Decision gist · record as of 2026-07-25
Internationalization (i18n) adds multi-language support to applications using i18next, gettext, or Intl APIs with translation management and RTL formatting. Build globally accessible applications by implementing language switching, translation workflows, and locale-specific formatting. This skill covers i18next setup for React, pluralization rules, date and number formatting using the Intl API, and right-to-left language support with CSS logical properties. Includes best practices for string extraction, pseudo-localization testing, and production translation workflows.
Use it when
- internationalization-i18n handles RTL languages like Arabic and Hebrew using CSS logical properties (margin-inline.
- internationalization-i18n leverages the native Intl API (Intl.DateTimeFormat, Intl.NumberFormat.
Verify before relying
Read SKILL.md below before installing (2 files). Open directory: indexed for reading, not audited.
Install
secondsky/claude-skills/internationalization-i18n · repository language: TypeScript
Open directory. Skills are indexed for reading, not audited. Review a skill's body before installing it.
Frequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
How do I add multiple language support to my app?
internationalization-i18n enables multi-language support through libraries like i18next for React and other frameworks. Set up language switching by configuring locale files, initializing the i18n instance with your supported languages, and binding UI components to translation keys. The skill covers namespace organization, lazy loading translations, and detecting user locale from browser settings or user preferences.
What's the best approach for right-to-left language support?
internationalization-i18n handles RTL languages like Arabic and Hebrew using CSS logical properties (margin-inline, padding-block) instead of directional values. Combine this with the `dir` attribute on your HTML root element and use the Intl API for locale-aware formatting. The skill includes strategies for testing RTL layouts and managing bidirectional text in forms and dynamic content.
How do I format dates, numbers, and currency for different locales?
internationalization-i18n leverages the native Intl API (Intl.DateTimeFormat, Intl.NumberFormat, Intl.RelativeTimeFormat) to format values according to locale rules. Pass your locale code and options object to automatically handle regional conventions—dates, number separators, currency symbols, and plural forms. The skill demonstrates integrating these formatters into React components and managing locale switching.
What does internationalization-i18n cover for translation workflows?
internationalization-i18n addresses string extraction, translation management, and production workflows. Learn to organize translation files by namespace, use tools like i18next-scanner for automated key extraction, and implement pseudo-localization for testing. The skill includes best practices for managing translation updates, handling context-specific strings, and integrating with translation management platforms.
How does internationalization-i18n handle pluralization and complex messages?
internationalization-i18n supports ICU message format for pluralization rules and gender-aware translations. Configure pluralization logic for each language, use interpolation for dynamic values, and nest translations for complex UI structures. The skill covers handling edge cases like zero items, singular/dual/plural forms, and context-dependent message variations across different language families.
Which internationalization-i18n approach works best for React apps?
internationalization-i18n recommends i18next with react-i18next hooks for React applications. Use the useTranslation hook to access translations and language switching, configure namespaces for code splitting, and implement language detection. The skill compares i18next with react-intl, covering setup, performance optimization, and integration with server-side rendering for production React applications.
SKILL.md
Rendered from the published skill. Quoted content, verbatim.
Internationalization (i18n)
Implement multi-language support with proper translation management and formatting.
i18next Setup (React)
import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';
import LanguageDetector from 'i18next-browser-languagedetector';
i18n
.use(LanguageDetector)
.use(initReactI18next)
.init({
fallbackLng: 'en',
interpolation: { escapeValue: false },
resources: {
en: { translation: { welcome: 'Welcome, {{name}}!' } },
es: { translation: { welcome: '¡Bienvenido, {{name}}!' } }
}
});
// Usage
const { t } = useTranslation();
<h1>{t('welcome', { name: 'John' })}</h1>
Pluralization
```javascript // Translation file { "items": "{{count}} item", "items_plural": "{{count}} items", "items_zero": "No items" }
// Usage t('items', { count: 0 }) // "No items" t('items', { count: 1 })
(truncated - see the full file via the links below)
File tree — 2 files
plugins/internationalization-i18n/skills/internationalization-i18n/SKILL.md
plugins/internationalization-i18n/skills/internationalization-i18n/references/frameworks.md
Let your AI agent find skills like this
Example. Real query, live index.
You found this page by searching. An agent finds it by wishing: SkillFed indexes 56,283 agent skills by what they can do, searchable in plain language.
wish › “Add multi-language support to web/mobile applications”
Give your agent the search over MCP, or paste the wish link into any chat. No install? Search from any chat →
Related skills
This skill provides comprehensive guidance for adding multi-language capabilities to applications. It covers translation workflows, locale-aware formatting for dates and numbers, pluralization handling across languages, and support for right-to-left scripts. Learn to integrate popular i18n libraries, manage translation strings effectively, and implement language detection and switching.
Set up internationalization in Tauri applications using react-i18next to support multiple languages. Learn to organize translation files, use the translation hook in components, and enable runtime language switching. Covers configuration, common pitfalls, and best practices for managing localized content.
This skill equips frontend developers with patterns for adding internationalization to React applications, covering translation hooks, locale-sensitive formatting for currency and lists, date handling with dayjs, and bidirectional text support. It provides bundled references for ICU MessageFormat pluralization, the Trans component for rich text, and implementation checklists to ensure all user-facing content respects locale conventions.
i18n-helper identifies hardcoded strings in your source files and automates the setup of internationalization across frameworks like react-intl, vue-i18n, i18next, and gettext. It generates language files in the format your project needs, replaces text with i18n function calls, and reports translation completeness to catch missing keys.
Master the distinction between internationalization (i18n) and localization (l10n) to build globally-ready applications. This skill covers architecture patterns for organizing translation files, naming conventions for translation keys, and implementation examples across React, Vue, and Next.js frameworks. You'll also learn to handle complex scenarios like pluralization, date/number/currency formatting using the Intl API, and support for right-to-left languages.
This skill guides you through implementing internationalization across web and mobile applications using industry-standard libraries like i18next and expo-localization. Learn to organize translation files, handle locale-aware formatting for dates and currency, support right-to-left layouts, and manage language preferences without page reloads.
More skills i18n-localization (MIT) · translate-craft (MIT) · Localization Engineer (unlicensed) · software-localisation (MIT) · i18n-localization (MIT) · xss-prevention (MIT)