> For the complete documentation index, see [llms.txt](https://shimozurdo.gitbook.io/frontend/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://shimozurdo.gitbook.io/frontend/html5/internacionalizacion.md).

# 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.

   ```json
   // 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.

   ```jsx
   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.

   ```js
   // 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.