LoginSignup
4
3

More than 5 years have passed since last update.

Firebase Cloud Functionsの導入手順

Last updated at Posted at 2018-12-14

はじめに

Firebase Could Functionsを導入する手順がわかりづらかったのでまとめてみました。
都合上、スクリーンショットの一部を隠していますがご了承ください。また、以下はターミナル(Mac OS)で行っています。

導入手順

  • Node.jsFirebase CLIを設定する
    • Firebase CLIをインストール
    • Node.jsをインストール
  • Firebaseのアカウントと連携する
    • Firebaseにログインする
    • 連携するアカウントを選択する
  • Firebase Cloud Functionsをプロジェクトと連携する
    • Firebase Cloud Functionsを利用したいプロジェクトのディレクトリまで移動する
    • Firebase Cloud Functionsを初期化する
    • 使用する言語を選択する JavaScript or TypeScript
    • ESLintを使用するか選択する
    • npmをインストールするか選択する
  • 完了

Node.jsとFirebase CLIを設定する

Firebase CLIをインストール

npm install -g firebase-tools

Node.jsをインストール

brew install node

Node.jsとはサーバサイドで動くJavaScriptのこと

Node.jsについてはもっと知りたいという方は以下の記事を参考にしてください。
Node.js を5分で大雑把に理解する

Homebrewをインストールしていない場合はまずHomebrewをインストールしましょう。

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Homebrewとはパッケージをインストールしたりアンインストールしたりできるシステムのこと

Homebrewについてはもっと知りたいという方は以下の記事を参考にしてください。
homebrewとは何者か。仕組みについて調べてみた

Firebaseのアカウントと連携する

Firebaseにログインする

firebase login

連携するアカウントを選択する
スクリーンショット 2018-12-14 15.54.47.png

Firebase Cloud Functionsをプロジェクトと連携する

Firebase Cloud Functionsを利用したいプロジェクトのディレクトリまで移動する

cd ~ 任意のディレクトリ名

Firebase Cloud Functionsを初期化する

firebase init functions

スクリーンショット 2018-12-14 16.06.22.png

使用する言語を選択する JavaScript or TypeScript
E80C1B49-3157-4328-AC23-E3441F12F0E3.png

ESLintを使用するか選択する
D775851F-70AF-4959-B587-9CF41E9BFBA3.png
ESLintとはJavaScriptのコードが正しいかチェックするツールのこと

ESLintについてはもっと知りたいという方は以下の記事を参考にしてください。
ESLint 最初の一歩

npmをインストールするか選択する
B30F06AB-24CA-4988-89BA-E36B25C3E2AD.png
npmとはNode.jsのパッケージを管理するためのもの

npmについてはもっと知りたいという方は以下の記事を参考にしてください。
npm入門

完了

完了画面(ターミナル上)
スクリーンショット 2018-12-14 16.21.36.png

完了画面(ディレクトリ上)
スクリーンショット 2018-12-14 16.28.37.png

おわりに

以上がざっくりとしたFirebase Cloud Functionsの導入手順でした。
次回は実際に使用するときの手順をまとめてみたいと思います。

4
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
4
3