本番環境へのデプロイ

GT を使用して React アプリを本番環境にデプロイする方法。

概要

これは、GT を使って React アプリをデプロイするための短いチュートリアルです。

全体で、完了までに 5 分もかかりません。

次の 3 ステップで進めます:

本番用の API Keys を追加します。

gtx-cli configure コマンドを実行してプロジェクトを設定します。

ビルドスクリプトに gtx-cli 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 Keys をパブリックリポジトリにコミットしないでください!

ステップ 2: gtx-cli configure コマンドを実行する 🔧

以前にセットアップウィザードを実行している場合は、このステップはスキップできます。 セットアップウィザードによって、すでに gtx-cli configure コマンドが実行されています。

プロジェクトを構成するために gtx-cli configure コマンドを実行します。

npx gtx-cli configure

翻訳を GT CDN でホスティングしたくない場合は、確認時に「No」を選択してください。 併せて、loadTranslations 関数の設定も必要です。

ステップ3: ビルドスクリプトに translate コマンドを追加する 🏗️

最後のステップは、ビルドスクリプトにtranslate コマンドを追加することです。 translate コマンドが build コマンドより先に実行されるようにしてください。

package.json
{
  "scripts": {
    "build": "npx gtx-cli translate && <...YOUR_BUILD_COMMAND...>"
  }
}

以上です!これで、本番環境にアプリをデプロイして npm run build を実行すれば、 プロジェクトは自動的に翻訳され、アプリと共にデプロイされます。


次のステップ

  • CLI ツールの詳細はCLI ドキュメントをご覧ください。
  • CLI ツールの各種構成 options についてはこちらをご参照ください。
  • 本番環境と開発環境の違いについてはこちらをご覧ください。

このガイドはどうでしたか?

本番環境へのデプロイ