本番環境へのデプロイ
GT を使用して React アプリを本番にデプロイする方法。
概要
これは、GT を使って React アプリをデプロイするための短いチュートリアルです。
所要時間は合計で 5 分未満です。
次の 3 ステップで進めます:
本番用の API Keys を追加します。
gtx-cli configure コマンドを実行してプロジェクトを設定します。
ビルドスクリプトに translate コマンドを追加します。
前提条件
すでに React アプリに GT をセットアップ済みであると想定します。 まだの場合は、まず クイックスタートガイド に従ってプロジェクトをセットアップしてください。
ステップ 1: 本番用の API Keys に切り替える 🔑
アプリを本番環境にデプロイするには、本番用の APIキー を使用する必要があります。
dashboard でサイドバーの API Keys に移動します。 Create API Key をクリックし、作成したキーを本番環境に追加します。
GT_API_KEY="YOUR_GT_API_KEY"
GT_PROJECT_ID="YOUR_GT_PROJECT_ID"API Keys を保護しましょう!
本番用キーは本番環境でのみ使用してください。 同様に、開発用キーは開発環境でのみ使用してください。 APIキーを公開リポジトリにコミットしないでください!
ステップ2: gtx-cli configure コマンドを実行する 🔧
以前にセットアップウィザードを実行している場合は、このステップをスキップできます。
セットアップウィザードで既に gtx-cli configure コマンドが実行されています。
gtx-cli configure コマンドを実行して、プロジェクトを構成します。
npx gtx-cli configure翻訳を GT CDN(コンテンツ配信ネットワーク)でホストしたくない場合は、確認時に「No」を選択してください。
その場合は、loadTranslations 関数の設定も必要です。
ステップ3: ビルドスクリプトに translate コマンドを追加する 🏗️
最後のステップは、ビルドスクリプトにtranslate コマンドを追加することです。 translate コマンドが build コマンドより先に実行されるようにしてください。
{
"scripts": {
"build": "npx gtx-cli translate && <...あなたのビルドコマンド...>"
}
}以上です!これで、本番環境にアプリをデプロイして npm run build を実行すると、
プロジェクトは自動的に翻訳され、アプリと並行してデプロイされます。
次のステップ
- CLI ドキュメントで CLI ツールの詳細をご確認ください。
- CLI ツールの各種設定 options についてはこちらをご覧ください。
- 本番環境と開発環境の違いについてはこちらをご参照ください。
このガイドはいかがですか?