Internacionalización

i18n, abreviación de internacionalización (que cuenta con 18 letras entre la "i" y la "n"), es el proceso de adaptar una aplicación para soportar múltiples idiomas y regiones culturales. En el desarrollo de software, la i18n permite que las aplicaciones se ajusten automáticamente a distintos idiomas, monedas, formatos de fecha, y otras convenciones regionales sin tener que reescribir el código base para cada región.

¿Para qué sirve la i18n en una aplicación web?

La i18n es fundamental para aplicaciones que desean llegar a una audiencia global, ya que:

  1. Mejora la experiencia del usuario al adaptar el contenido al idioma y convenciones locales.

  2. Aumenta la accesibilidad y el alcance del producto a diferentes regiones y culturas.

  3. Facilita la escalabilidad de la aplicación para lanzarse en nuevos mercados sin necesidad de cambios importantes en el código.

¿Cómo se usa la i18n?

La implementación de i18n en una aplicación web sigue estos pasos básicos:

  1. Extraer textos del código:

    • En lugar de escribir textos directamente en el código, estos se extraen y se guardan en archivos de recursos o JSON (ej. en.json, es.json) para cada idioma.

    • Cada archivo contiene una serie de claves y valores donde las claves son las mismas entre idiomas y los valores están traducidos.

    // en.json
    {
      "greeting": "Hello",
      "farewell": "Goodbye"
    }
    
    // es.json
    {
      "greeting": "Hola",
      "farewell": "Adiós"
    }
  2. Cargar el idioma apropiado:

    • La aplicación detecta el idioma preferido del usuario (a menudo con el idioma del navegador) y carga el archivo de recursos correspondiente.

    • Las librerías de i18n, como i18next en JavaScript o react-intl en React, pueden gestionar automáticamente la carga de idiomas y el reemplazo de textos.

  3. Insertar claves de texto en lugar de textos literales:

    • En lugar de escribir directamente el texto, se usa la clave del archivo de idioma y la aplicación reemplaza automáticamente con el valor adecuado.

    import { useTranslation } from 'react-i18next';
    
    function Greeting() {
      const { t } = useTranslation();
      return <p>{t('greeting')}</p>;
    }
  4. Gestionar formatos regionales:

    • Además del texto, la i18n también puede manejar formatos de fecha, moneda y números. Esto se hace con librerías de localización (localization) como Intl.DateTimeFormat en JavaScript.

    // Ejemplo de formato de fecha
    const date = new Date();
    const formattedDate = new Intl.DateTimeFormat('es-ES').format(date); // "10/11/2023" en español

Resumen

La i18n es una técnica que permite que una aplicación se adapte automáticamente a múltiples idiomas y convenciones regionales. Esto no solo mejora la experiencia del usuario sino que también permite que la aplicación se expanda a nivel global sin grandes cambios en su estructura de código.

Last updated