Skip to main content

Localization in CargoXplorer TMS

Introduction​

Localization in CargoXplorer TMS is the process of adapting the system's content and interface to specific locales or markets. This involves translating text, adapting date and number formats, and considering cultural nuances to create a seamless user experience across different languages and regions.

YAML Structure for Localized Content​

component: someComponent
props:
  someProperty:
    en-US: "English text"
    es-ES: "Spanish text"
    fr-FR: "French text"

Attribute Description​

  • component: (string) The type of component being localized.
  • props: (object) Contains the properties of the component.
    • [propertyName]: (object) A property that requires localization.
      • [languageCode]: (string) The localized text for each supported language.

Examples​

Localized Text Component​

component: text
props:
  type: "paragraph"
  value:
    en-US: "Welcome to CargoXplorer TMS"
    es-ES: "Bienvenido a CargoXplorer TMS"
    fr-FR: "Bienvenue sur CargoXplorer TMS"

Localized Button Label​

component: button
props:
  label:
    en-US: "Submit"
    es-ES: "Enviar"
    fr-FR: "Soumettre"

Localized Form Fields​

component: form
children:
  - component: input
    props:
      label:
        en-US: "First Name"
        es-ES: "Nombre"
        fr-FR: "Prénom"
  - component: input
    props:
      label:
        en-US: "Last Name"
        es-ES: "Apellido"
        fr-FR: "Nom de famille"

Best Practices​

  1. Use consistent language codes across your application (e.g., "en-US" for American English, "es-ES" for Spanish).

  2. Provide translations for all supported languages in each localizable component.

  3. Consider cultural differences when localizing content, not just direct translations.

  4. Use placeholders for dynamic content in localized strings:

    greeting:
      en-US: "Hello, {userName}!"
      es-ES: "¡Hola, {userName}!"

  5. Separate translatable content from code to make updates easier.

  6. Use a translation management system to keep track of all localizable strings.

  7. Test your localized interfaces thoroughly to ensure proper display and functionality.