skills.rest
zzoohub
zzoohubCOMMUNITY
Explore all skills by this author →
GitHub

i18n-patterns

Organize domain-based translation patterns for React and Next.js apps.

Updated Mar 18, 2025
Search Tags:#localization#i18n#internationalization#next-intl#domain-patterns#react-i18next
One-click install
npx skills add https://github.com/zzoohub/mealio --skill i18n-patterns-zzoohub
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: i18n-patterns
Source: https://github.com/zzoohub/mealio/tree/main/.claude/skills/i18n-patterns
Command: npx skills add https://github.com/zzoohub/mealio --skill i18n-patterns-zzoohub

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Internationalization in apps is often inconsistent, hard to scale, and prone to translation duplication. This skill provides a set of domain-based patterns and conventions to organize translations, manage language switching, and apply standardized formatting across platforms.

Core Features & Use Cases

  • Domain-based namespaces per feature to keep translations organized.
  • Built-in guidance for react-i18next and next-intl, including setup tips for Next.js App Router and React Native.
  • Support for pluralization, ICU formatting, and safe key generation with type-safe hooks.
  • Language configuration, RTL awareness, and a scalable localization workflow.

Quick Start

Set up the locales folders (locales/en and locales/ko) and initialize your i18n library (i18next or next-intl) following the patterns shown.

Frequently Asked Questions about i18n-patterns

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

FAQPage Schema
What is the best way to organize i18n translations for scalable multilingual apps?▼

Domain-based namespaces per feature provide the best way to organize i18n translations, preventing duplication and keeping multilingual apps scalable. This approach standardizes language switching and formatting across platforms.

How do I set up react-i18next with Next.js App Router for internationalization?▼

Set up react-i18next for Next.js App Router by creating locales folders (e.g. locales/en) and initializing the i18n library following domain-based patterns. This provides type-safe hooks and built-in formatters for translation management.

Does this i18n pattern support pluralization and ICU formatting in React Native?▼

Yes, the i18n patterns support pluralization, ICU formatting, and safe key generation with type-safe hooks in React Native. Built-in guidance covers setup tips for both react-i18next and next-intl implementations.

Can I use next-intl with domain-based translation patterns for language switching?▼

Yes, next-intl is fully supported with domain-based translation patterns for language switching. The patterns provide specific guidance for next-intl setup, including language configuration, RTL awareness, and scalable localization workflows.

How do I handle RTL language configuration when implementing internationalization?▼

Handle RTL language configuration by following the scalable localization workflow patterns that include RTL awareness. These patterns standardize language configuration and formatting across web and mobile apps built with React and Next.js.

Related Skills

Explore More Software Engineering Skills→
TMHSDigitalTMHSDigital
2

mobile-i18n

Configure i18n libraries for React Native/Expo or Flutter with locale detection and RTL support.

Community
Intermediate
patricio0312revpatricio0312rev
5

i18n-frontend-implementer

Implement internationalization infrastructure in React apps with next-intl or react-i18next.

Community
Intermediate
PouriaRouzrokhPouriaRouzrokh

agentation

Integrates a visual feedback toolbar into Next.js projects for development-time UI inspection.

Community
Intermediate
otto-poblyshotto-poblysh

internationalization-i18n

Implement i18next-based internationalization with translation catalogs, pluralization, and locale-aware formatting.

Community
Intermediate