Firebaseアプリデプロイ

概要

動画を作ったついでのメモ。

IMAGE ALT TEXT HERE

前提

Firebase CLIをインストール済み
Firebase CLIにログイン済み
LinuxまたはMAC
nanoがインストール済み

コマンド

main
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65

# アプリケーションフォルダ作成
mkdir {appname}

# フォルダ内に移動
cd {appname}

# カレントフォルダをFirebaseで初期化
firebase init

# 利用するサービスの選択。(単純なホームページであればHostingでOK)
# スペースで選択し、エンターで次に
>? Which Firebase CLI features do you want to set up for th>is folder? Press Space to select features, then Enter to confirm your choi
>ces. (Press <space> to select, <a> to toggle all, <i> to invert selection)
> ◯ Database: Deploy Firebase Realtime Database Rules
> ◯ Firestore: Deploy rules and create indexes for Firestore
>❯◯ Functions: Configure and deploy Cloud Functions
> ◯ Hosting: Configure and deploy Firebase Hosting sites
> ◯ Storage: Deploy Cloud Storage security rules
> ◯ Emulators: Set up local emulators for Firebase features

# プロジェクトをどうするか?基本的にGCPに紐付いている。
# あまり考えたくなければ「Create a new project 」で良い
>? Please select an option: (Use arrow keys)
>❯ Use an existing project
> Create a new project
> Add Firebase to an existing Google Cloud Platform project
> Don t set up a default project

# 作成するプロジェクト名6-30で既存のものにかぶらないように
>? Please specify a unique project id (warning: cannot be modified afterward) [6-30 characters]:
> ()

# プロジェクトの呼び名?プロジェクト名そのままであればエンターでOK
>? What would you like to call your project? (defaults to your project ID) ()

# ホームページを設置するフォルダ名の指定、初期値はpublicなのでそのままエンターでOK
>? What do you want to use as your public directory? (public)

# すべての要求をindex.htmlに集約するかどうか?
# SPAにする場合はYES
>? Configure as a single-page app (rewrite all urls to /index.html)? (y/N)

# --これでFirebaseへの登録は完了--
# HTMLを設置するパブリックフォルダへ移動
cd public

# 存在するindex.htmlを削除
rm index.html

# 新規にindex.htmlを作成
nano index.html
>こんにちわ ホームページです。

# カレントフォルダに戻る
cd ..

# クラウドにデプロイする
firebase deploy
>Project Console: https://console.firebase.google.com/project/{appname}/overview
>Hosting URL: https://{appname}.firebaseapp.com

# >Hosting URL: https://{appname}.firebaseapp.com
# を参照にデプロイしたページを確認する