3
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

「Firebase」デプロイする方法

Posted at

はじめに

Firebaseを使用してデプロイをする際にてこずってしまったので、Firebaseの初期化からデプロイまでの手順を簡単にまとめます。

Firebaseのプロジェクトを初期化する。

1 今回はFirebaseのhostingのみを初期化します。
image.png

2「 Hosting: Configure files for Firebase Hosting and (optionally) set up GitHub Action deploys」を選択します。
image.png

3今回は既にFirebaseで作成済みのプロジェクトを使用するので、「Use an existing project」を選択します。
image.png

4 私の場合はビルドの出力先がdistフォルダなので、
「What do you want to use as your public directory?」でdistと入力します。
※私は始めにここをpublicと入力したところ画面が真っ白になりました。
image.png

5 今回はreactを使っているので 、
「Configure as a single-page app (rewrite all urls to /index.html)?」 Yesを選択します。

6 「Set up automatic builds and deploys with GitHub?」はNoを選択します。

7 下記の通り表示されたら初期化は完了です。
image.png

ビルドの実行

image.png

アプリをデプロイする

image.png

「Deploy complete!」の後に表示される「Hosting URL:」に記載されているURLにアクセスして、プロジェクトのアプリやサイトが表示されれば成功です。

参考記事
下記の記事がデプロイまでの内容が分かりやすく書かれていて勉強になりました。
URL:https://qiita.com/acu8/items/c57d0a7de90c5d253c01

3
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?