internationalization-i18n

Install i18next, react-i18next, and i18next-browser-languagedetector, then initialize i18n with a fallback language and translation resources. Use the useTranslation hook and the t() function to render translated strings in components.

i18next uses suffixes like _zero, _one, and _other on translation keys, selected by passing a count value. For richer control, ICU Message Format supports plural, select, and gender rules in a single message string.

i18next offers a mature ecosystem with language detection and backend loading plugins, while react-intl (Format.js) provides built-in ICU Message Format and rich formatting components like FormattedNumber and FormattedDate. Both are covered in this Skill's references.

Use CSS logical properties such as margin-inline-start and padding-inline-end instead of left/right properties, and set the dir attribute on the html element based on the locale. Mirror directional icons with transform: scaleX(-1) under [dir="rtl"].

Yes, use Babel's Translations.load with a locale resolved from URL parameters, cookies, or the Accept-Language header. Extract messages with pybabel extract, initialize catalogs per language, and compile them for production.