Firebase HostingにReactアプリをデプロイ

Firebase Hostingにnextrollサイトのクローンをdeployしたので手順のメモです。Reactです

Firebaseのインストール

npm install -g firebase-tools

Firebase Hostingの初期設定

cd mydir
firebase init hosting

Before we get started, keep in mind:

  * You are currently outside your home directory
  * You are initializing within an existing Firebase project directory

? Are you ready to proceed? Yes

=== Project Setup

First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add,
but for now we'll just set up a default project.

i  Using project ty-gcp1 (ty-gcp1)

=== Hosting Setup

Your public directory is the folder (relative to your project directory) that
will contain Hosting assets to be uploaded with firebase deploy. If you
have a build process for your assets, use your build's output directory.

? What do you want to use as your public directory? build
? Configure as a single-page app (rewrite all urls to /index.html)? Yes
? Set up automatic builds and deploys with GitHub? No
? File public/index.html already exists. Overwrite? Yes

i  Writing configuration info to firebase.json...
i  Writing project information to .firebaserc...

+  Firebase initialization complete!

ビルド

npm run build

デプロイ

firebase deploy

下記画像が出たらデプロイ成功

ページ再更新すれば自分のページが表示されます

参考

Firebaseのつかいかた
今回作ったnextrollサイトのクローン
ソース