本番環境と開発環境
本番環境と開発環境の違い
概要
gt-react は、React アプリケーションが実行される環境によって動作が異なります。
NODE_ENV 環境変数を確認して環境を判別します。
本番環境での挙動
環境変数
本番環境で許可される環境変数は、GT_PROJECT_ID（NEXT_PUBLIC_GT_PROJECT_ID のようなプレフィックス付きのものを含む）のみです。
APIキーが環境変数として設定されている場合、gt-react は Error をスローします。これは、API Keys がクライアントに露出しないようにするためです。
翻訳の読み込み動作
本番環境では、デフォルトで gt-react プロバイダーが General Translation の CDN から翻訳を読み込みます。
loadTranslations 関数でローカルの翻訳などのカスタム読み込みを設定している場合は、gt-react はそちらを使用します。
本番環境では、翻訳のホットリロードは無効です。
開発時の挙動
環境変数
開発はローカルで行われ、外部ユーザーには公開されないため、gt-react は NEXT_PUBLIC_ や VITE_（または同様の）プレフィックスが付いていても、General Translation の任意の環境変数を受け付けます。
翻訳の読み込み動作
開発環境では、gt-react プロバイダはまず本番環境と同様の方法で翻訳を読み込みます。
これらの翻訳はメモリに保持されます。
デフォルトとは異なる言語で（useGT、<T>、または useTranslations を使用する）コンポーネントをレンダリングする場合、gt-react プロバイダは次の処理を行います。
- 対象のコンテンツについて、有効な保存済み翻訳が見つかった場合は、その翻訳をレンダリングします。
- 翻訳が見つからない場合は、General Translation API を介してコンテンツを動的に翻訳しようとします。
- 翻訳後は、その翻訳をレンダリングし、将来の利用のためにメモリへ保存します。
- 翻訳がタイムアウトした場合はフォールバックとして元のコンテンツをレンダリングします。
当社の API は開発時の翻訳を短時間内部キャッシュするため、同じ翻訳が再度要求された場合はキャッシュから提供されます。
これらの翻訳はプロジェクト単位で分離されており、他のプロジェクトの翻訳と混在することはありません。 さらに、キャッシュは開発セッションごとに固有であるため、キャッシュ済みの翻訳が本番環境で使用されることはありません。
gt-react は、useGT、<T>、または useTranslations を使用するコンポーネントの変更を検知し、当社の API を介して変更されたコンテンツを動的に翻訳します。
本番用と開発用の API Keys
gt-react の本番時と開発時での動作を区別しやすくするため、「Production API Keys」と「Development API Keys」という概念を設けています。
本番環境のAPI Keys
本番環境のAPIキーは、gtx-api- で始まるAPIキーです。
本番環境のAPIキーが指定されると、gt-react は本番時の動作セクションに記載のとおりに動作します。
つまり、Reactアプリを開発モードで実行していても、本番環境のAPIキーを指定すると、gt-react は本番環境と同様に振る舞います。
翻訳のホットリロードは無効になり、未翻訳のコンポーネントは元のコンテンツをそのままレンダリングします。
この挙動以外では、gt-react は本番環境のAPIキーを使用しません。
本番リリース時に本番用のAPIキーを別途作成していただく理由は、CLIツールが参照するのが本番環境のAPI Keysのみであるためです。
CLIツールは「production」カテゴリとして課金とレート制限を適用します。
開発用 API Keys
開発用の APIキーは、gtx-dev- で始まります。
開発用 APIキーが指定されていると、gt-react は開発時の動作セクションのとおりに動作します。
開発用 APIキーを使用する場合、課金およびレート制限は「development」カテゴリとして適用されます。
開発用 APIキーで作成された翻訳は保存されず、本番環境では利用できません。
開発時の翻訳は、本番リリース前にアプリケーションをテストするためのものです。
このガイドはどうでしたか？