コアコンセプト

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

基本ロケール

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

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

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

ターゲットロケール

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

Vanilla JSでは、engine.setLocale(...)を使ってエンジンに直接設定します。

コンテキスト

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

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

ts
import { create18waysEngine } from '@18ways/core/engine';
 
const engine = create18waysEngine({
  apiKey: 'pk_dummy_demo_token',
  baseLocale: 'en-GB',
  locale: 'fr-FR',
  context: 'marketing',
});
 
const heroTitle = await engine.t('Wrap your text. We handle the rest.', {
  context: 'marketing.hero',
});
 
const pricingTitle = await engine.t('Simple pricing', {
  context: 'marketing.pricing',
});

関連するコピーが一緒にグループ化されるように、安定したコンテキスト名を使用してください。

受け入れられたロケール

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

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

コアパッケージでは、通常、受け入れられたロケールリストを自分のアプリに保持し、engine.setLocale(...)を呼び出す前に正規化します。

ts
const acceptedLocales = ['en-GB', 'fr-FR', 'de-DE'];
 
function setLocale(nextLocale: string) {
  const locale = acceptedLocales.includes(nextLocale) ? nextLocale : 'en-GB';
 
  engine.setLocale(locale);
}

持続性

ランタイムアダプターによって使用されるロケール設定クッキーは 18ways_locale です。

ロケールを自分で持続させ、ReactやNextのレイヤーと互換性を保ちたい場合は、同じ名前を使用してください。

翻訳が読み込まれるとき

@18ways/core は、低レベルのエンジンとキャッシングを提供しますが、レンダリングフローはあなたが管理します。

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

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

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

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

コアコンセプト