Conceptos básicos

18ways tiene opiniones claras sobre algunas cosas. Una vez que estas estén claras, el resto de la superficie de la API es sencilla.

Configuración regional base

Tu baseLocale es el idioma en el que escribes.

Si la copia de tu producto está escrita en inglés británico, tu configuración regional base es en-GB. Si está escrita en inglés americano, tu configuración regional base es en-US.

Cuando la configuración regional actual coincide con la configuración regional base, 18ways devuelve el texto original de inmediato y omite el trabajo de traducción.

Idioma de destino

Tu idioma objetivo es el idioma que el usuario está leyendo actualmente.

En React, normalmente lo mantienes en el estado y lo pasas a la raíz Ways.

Contextos

Los contextos son cómo los grupos de 18ways relacionan el contenido.

Úselos para mantener las solicitudes de traducción pequeñas y evitar mezclar texto no relacionado.

tsx
import { Ways } from '@18ways/react';
 
export function AppRoot() {
  return (
    <Ways
      apiKey="YOUR_18WAYS_PUBLIC_API_KEY"
      locale="fr-FR"
      baseLocale="en-GB"
      context="marketing"
    >
      <Ways context="hero">
        <Hero />
      </Ways>
      <Ways context="pricing">
        <Pricing />
      </Ways>
    </Ways>
  );
}

Los ámbitos anidados Ways se componen en una única ruta de contexto. marketing más hero se convierte en marketing.hero.

Locales aceptados

18ways distingue entre:

  • un locale que puede reconocer, como fr-FR
  • un idioma que tu proyecto realmente acepta

El tiempo de ejecución puede obtener la lista de locales aceptados de la API y luego normalizar los valores de locales entrantes en función de esa lista.

tsx
import { Ways } from '@18ways/react';
 
export function AppRoot() {
  return (
    <Ways
      apiKey="YOUR_18WAYS_PUBLIC_API_KEY"
      locale="fr-FR"
      baseLocale="en-GB"
      acceptedLocales={[
        'en-GB',
        'fr-FR',
        'de-DE',
      ]}
      context="app"
    >
      <App />
    </Ways>
  );
}

Persistencia

La cookie de preferencia de localización utilizada por el tiempo de ejecución es 18ways_locale.

Cuando se cargan las traducciones

@18ways/react puede suspenderse mientras se resuelve un contexto sembrado y mantiene una caché compartida en memoria en el cliente.

Modelo mental compartido

Mantén el modelo simple:

  1. Elige el paquete correcto para tu aplicación.
  2. Establece correctamente la configuración regional base.
  3. Mantén las claves de contexto estables y significativas.
  4. Deja que el tiempo de ejecución traduzca frases completas, no fragmentos.

Siguiente: Formato de Mensaje