コアコンセプト

18waysは、いくつかのことについて意見を持っています。これらが明確になると、APIの残りの部分は 簡単になります。

基本ロケール

あなたの baseLocale は、あなたが書く言語です。

あなたの製品コピーがイギリス英語で書かれている場合、基本ロケールは en-GB です。アメリカ英語で書かれている場合、基本ロケールは en-US です。

現在のロケールがベースロケールと一致する場合、18waysはソーステキストを即座に返し、翻訳作業をスキップします。

ターゲットロケール

ユーザーが現在読んでいる言語が、あなたのターゲットロケールです。

Reactでは、通常それを状態に保持し、ルートに渡します Ways.

コンテキスト

コンテキストは、18waysが関連するコピーをグループ化する方法です。

翻訳リクエストを小さく保ち、無関係なテキストを混ぜないようにするために、それらを使用してください。

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

ネストされた Ways スコープは、1 つのコンテキストパスに構成されます。 marketing と hero を組み合わせると、 marketing.hero になります。

受け入れられたロケール

18waysは次のように区別します:

  • fr-FR のように認識できるロケール
  • プロジェクトが実際に受け入れるロケール

ランタイムはAPIから受け入れられたロケールのリストを取得し、そのリストに対して受信したロケール値を正規化できます。

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

持続性

ランタイムで使用されるロケール設定クッキーは 18ways_locale です。

翻訳が読み込まれるとき

@18ways/react は、シードされたコンテキストが解決される間にサスペンドし、クライアント上で共有のメモリ内キャッシュを保持できます。

共有されたメンタルモデル

モデルをシンプルに保つ:

  1. アプリに適したパッケージを選択してください。
  2. ベースロケールを正しく設定してください。
  3. コンテキストキーを安定させ、意味のあるものに保ちます。
  4. ランタイムにフレーズ全体を翻訳させ、断片ではなくする。

次: メッセージフォーマット

コアコンセプト