i18n / routage par langue

Le loader inspecte d'abord ?locale=…, puis Accept-Language, et charge les chaînes correspondantes côté serveur. Chaque rendu est un choix frais — pas de clignotement dans la mauvaise langue.

Astuce
Pour un routage i18n automatique à l'échelle du site (URLs préfixées /en/…, /fr/…), configurez [i18n] strategy = "prefix" et locales dans bext.config.toml. Ce pattern manuel reste utile pour des pages isolées ou des détections personnalisées.

Langue détectée : en

Hello

This page detected your locale from the request and picked English strings server-side.

Pick another locale:

src/app/examples/i18n/page.tsxTSX
// Manual locale detection — reads ?locale=… first, then Accept-Language.
// For site-wide /en/… prefix routing, set [i18n] strategy = "prefix"
// + locales in bext.config.toml; this demo keeps detection page-scoped.
function pickLocale(req: Request): string {
  const url = new URL(req.url);
  const q = url.searchParams.get("locale");
  if (q && STRINGS[q]) return q;
  const al = req.headers.get("accept-language") ?? "";
  for (const part of al.split(",")) {
    const tag = part.split(";")[0].trim().toLowerCase();
    const short = tag.split("-")[0];
    if (STRINGS[short]) return short;
  }
  return "en";
}

export async function loader({ request }: LoaderArgs) {
  const locale = pickLocale(request);
  return { locale, strings: STRINGS[locale] };
}

Documentation associée

Internationalisation