ReactをGCPのGAEにデプロイする方法

はじめに

GAEではapp.yamlファイルに仕様を書くだけで簡単にアプリをデプロイすることができます。
本記事では特にReactのアプリをデプロイするためのコードと手順をご紹介します。
前提として、GCPのSDKのインストールがされている必要があります。

手順

app.yamlを用意

以下のapp.yamlをコピペします。
runtimeのNode.jsのバージョンだけ使用しているものに変更してください。
他は通常なら特に変える必要はありません。

app.yaml

runtime: nodejs12
handlers:
# Serve all static files with url ending with a file extension
- url: /(.*\..+)$
  static_files: build/\1
  upload: build/(.*\..+)$
# Catch all handler to index.html
- url: /.*
  static_files: build/index.html
  upload: build/index.html

Deploy

Terminalから以下のコードを実行すればデプロイできます。
YOUR_PROJECT_ID を自分のプロジェクトのIDに変えてください。

npm run build && gcloud app deploy --project=YOUR_PROJECT_ID

ちなみに、自分はCloud Buildを使って自動的にデプロイされるように設定しています。
参考 : https://cloud.google.com/source-repositories/docs/quickstart-triggering-builds-with-source-repositories?hl=ja