JavaScript
Express
けものフレンズ
FirebaseCloudFunctions
プリズマ☆イリヤ

概要

Cloud Functions for Firebaseで楽してWebAPIを作りたいッッ!!
そんな人(オレ)のための資料である。

簡単な説明しかしてないので、より詳しい情報を知りたい人は今後のオレに期待をするかぐぐってくれ。

前提知識

Cloud Functions for FirebaseでHTTPトリガー使ってHelloWorld出来るくらいの知識が必要。

事前知識ない人もココらへん適当に見てくれればわかる
Firebaseすっごーい!
Cloud Functions for Firebaseに関する雑記

事前準備

  • firebaseのprojectを作成
  • firebase init functions

expressのインストール

npm(yarnでも可)でexpressをインストール。
cors考慮する場合は適宜入れてね。

npm i express --save

expressを用いたAPIの作成

実装

適当なJSON構造を返すコード書きます。以下は最低限のユーザー情報を想定。

const functions = require('firebase-functions');
const express = require("express");

const app = express();

app.get('/users', (req, res) => {
  // 本来はここでFireStoreとかからデータ取ってくるよ
  const users = [
    { "id": 1, "name": "イリヤ" },
    { "id": 2, "name": "美遊" },
    { "id": 3, "name": "クロエ" },
    { "id": 4, "name": "オルタ" },
    { "id": 5, "name": "マシュ" }
  ];

  // データを返却
  res.send(JSON.stringify(users));
});


const api = functions.https.onRequest(app);
module.exports = { api };

デプロイ

いつものこまんど

firebase deploy --only functions

動作確認

curlでAPIの動作確認

curlかブラウザで以下のエンドポイントを叩いてください。

$ curl -s https://{hogehoge}.cloudfunctions.net/api/users | jq
[
  {
    "id": 1,
    "name": "イリヤ"
  },
  {
    "id": 2,
    "name": "美遊"
  },
  {
    "id": 3,
    "name": "クロエ"
  },
  {
    "id": 4,
    "name": "オルタ"
  },
  {
    "id": 5,
    "name": "マシュ"
  }
]

Tips

homebrewでjq入れよう!
API開発とかしてたら超便利だよ!

brew install jq

所感

超簡単!
すっごーい!!
たーのしー!!!

express使えるからHTMLの返却もできるということだよね。
FaaSだけどPaaS代わりに使うこともできそう。(Lambdaもできるんだろうなやらないけど)

next.jsも使えるっぽいのでこんどfirebaseでSSR/SPA実装してみる。