Install
npm install -g firebase-tools
Login
firebase login
と入力すると
? Allow Firebase to collect anonymous CLI usage information? (Y/n)
使用状況の情報収集に協力するか聞かれるから任意で
Y/nを選ぶとデフォルトに設定しているブラウザが立ち上がり認証を求められる
Visit this URL on any device to log in:
https://accounts.google.com/o/oauth2/auth?...
Waiting for authentication...
+ Success! Logged in as address@gmail.com
こんな表示になってたら認証完了
プロジェクトの初期化
プロジェクトディレクトリ作成し、そのディレクトで以下コマンド入力
firebase init
と入力すると
######## #### ######## ######## ######## ### ###### ########
## ## ## ## ## ## ## ## ## ## ##
###### ## ######## ###### ######## ######### ###### ######
## ## ## ## ## ## ## ## ## ## ##
## #### ## ## ######## ######## ## ## ###### ########
You're about to initialize a Firebase project in this directory:
D:\projectname
? Are you ready to proceed? (Y/n)
このディレクトリをFirebaseプロジェクトとして初期化しようとしてけど準備はいい？
と聞かれるのでYES！
? What Firebase CLI features do you want to setup for this folder? (Press <space> to select)
(*) Database: Deploy Firebase Realtime Database Rules
>(*) Hosting: Configure and deploy Firebase Hosting sites
どういうプロジェクトにするか聞かれる
- データベース：Firebaseリアルタイムデータベースルールを展開
- ホスティング：Firebase Hostingサイトの設定と展開
=== 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.
? What Firebase project do you want to associate as default? (Use arrow keys)
[don't setup a default project]
> projectname (projectname-hoge1)
projectname (projectname-hoge2)
[create a new project]
このディレクトリをどのFirebaseプロジェクトに関連付けるか聞かれるので自分の環境に合わせる
既にプロジェクトをつくってればそれを選択
=== Database Setup
Firebase Realtime Database Rules allow you to define how your data should be
structured and when your data can be read from and written to.
? What file should be used for Database Rules? (database.rules.json)
リアルタイムデータベースの設定について聞かれる
何も入力せずにエンターするとdatabase.roles.jsonが作られる
=== Hosting Setup
Your public directory is the folder (relative to your project directory) that
will contain Hosting assets to 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? (public)
ホスティングの設定について聞かれる
多分firebaseのデプロイでアップロードするディレクトリを聞いてるのだと思う
publicのまま変更しなくていいのであればそのままエンター
変更したい場合は入力する
? Configure as a single-page app (rewrite all urls to /index.html)? (y/N)
次にSPAなのか聞かれる
+ Wrote public/index.html
i Writing configuration info to firebase.json...
i Writing project information to .firebaserc...
+ Firebase initialization complete!
上記が出力されれば初期化完了！
以下のようなディレクトリ構成で必要なものができあがる
projectname
├─ .firebaserc
├─ database.rules.json
├─ firebase.json
│
└─ public
└─ index.html
Deploy
firebase deploy
と入力すると
=== Deploying to 'projectname'...
i deploying database, hosting
+ database: rules ready to deploy.
i hosting: preparing dist directory for upload...
+ hosting: public folder uploaded successfully
+ hosting: 1 files uploaded successfully
i starting release process (may take several minutes)...
+ Deploy complete!
Project Console: https://console.firebase.google.com/project/projectname/overview
Hosting URL: https://projectname.firebaseapp.com
Hosting URLに出力されてるURLに接続すると
のようなページが表示されるはず