What is Internationalization (i18n)?

Internationalization (i18n) is the process of designing and developing applications to support multiple languages, regions, and cultural conventions. The abbreviation i18n comes from the 18 letters between the 'i' and 'n' in internationalization. Frontend Accelerator includes built-in support for multi-language applications.

i18n in Frontend Accelerator:

Frontend Accelerator uses next-intl for internationalization, providing type-safe translations, automatic locale detection, and seamless language switching. The boilerplate is pre-configured with locale routing and translation management.

Basic i18n structure:

// messages/en.json
{
  "navigation": {
    "home": "Home",
    "about": "About Us"
  },
  "greeting": "Hello, {name}!"
}

// Using translations
import {useTranslations} from 'next-intl';

function Component() {
  const t = useTranslations('navigation');
  return <nav><a>{t('home')}</a></nav>;
}

Key features:

• Locale routing: Automatic URL-based language detection (/en/about, /es/about)
• Type safety: TypeScript autocompletion for translation keys
• Pluralization: Handle singular/plural forms correctly
• Date/number formatting: Locale-specific formats for dates, times, and numbers

AI-Friendly: i18n follows structured patterns with JSON translation files and clear APIs. AI can easily generate translations, suggest missing keys, convert between locales, and ensure consistent terminology across languages. The type-safe approach makes it easy for AI to catch translation errors.