🔥

2020年の個人的Firebaseのまとめ

2020/12/01に公開

Firebase

tech

（この記事はFirebase アドベントカレンダー 2020の記事です）

もうアドベントカレンダーの季節かーって感じですね。もともと引きこもるのが好きだったのが、引きこもる大義名分を得た年だったのでずっと家にいて季節感がなかった年でした。

そんなことは関係なく、2020年もFirebaseは進化していたのアップデート内容を個人的興味があったものまとめていきます。

Emulator Suite

UI

Emulator SuiteはローカルやCI/CDでFirebaseの機能をテストできるツールです。Emulator Suiteが出るまでは本物のFirebaseプロジェクトを利用する必要がありましたが、Emulatorの登場で複数人開発やCIでのテストもやりやすくなりました。

5月のリリースでEmulator SuiteにUIが付きより視覚的にローカルでのテストがしやすくなり、Firebase Consoleを使うのに似た形で使えるようになりました。

FirestoreやRealtimeDBの値をUIから操作できたり、Cloud Functionsのログを確認フィルターできます。

Auth

今年のEmulator Suiteのアップデートでもう一つ大きなものがAuth Emualtorの追加です。
本番と同じようにパスワード認証やSMS、Google認証などのサードパーティ認証もローカルでテストができます。

Emulatorで作成したユーザーをUIから確認、削除も可能です。

余談ですが、 http://localhost:9099/emulator/openapi.json にAuth Emulatorで使えるAPIのドキュメントがあるのでこのあたりも必要に応じてテストを行うのに活用できそうです。

Firestore

Firestoreは!=がサポートされました。これまで「特定の値を含まない」みたいな除外条件でフィルターできなかったのがこれでできるようになりました。

collection('project').where('status', '!=', 'deleted')

合わせてnot-inもサポートされました。これをつかえばdeletedもcompletedも含まないドキュメントを探すことができます。

collection('project').where('status', 'not-in', ['deleted', 'completed'])

他のデータベースならできて当然みたいなことができてなくてオイオイと思ってる方も多いと思いますが、Firestoreはインフラを世界中のFirebase開発者たちと共有しているため全体が重たくなるようなQueryは制限されています。その代わりお安く使えるというメリットがあるわけです。

Hosting

Cloud Logging

Cloud LoggingとHostingを連携させることでHostingのアクセスログを取れるようになりました。
今までアクセスログを取る手段がサーバサイドになかったので嬉しいアップデートですね。

i18nをサポート

ユーザーが利用している言語に応じてHosting側から静的ファイルを出し分ける機能がサポートされました。

次のようなpublic/localized-files内に言語ごとにSiteを用意することでHosting側でAccept-Language ヘッダーやIPアドレスからわかる国情報を見て自動で対応したファイルをレスポンスにしてくれます。

public/
    index.html  // デフォルトのトップ
    404.html  // デフォルトの404ページ

    localized-files/
        ALL_ca/
            index.html
        es_ALL/
            index.html
            404.html
        fr/
            index.html
            404.html
        fr_ca/
            index.html
	ja/
            index.html

ヘッダー以外にもCookieにfirebase-language-overrideを加えることで、Cookieを優先して言語を変えることができます。JavaScriptを使ってサイト内のUIから動的に言語を切り替える機能を作ることもできますね。

document.cookie = "firebase-country-override=ca";
document.cookie = "firebase-language-override=fr,en";

Preview Channels

１つのプロジェクト内に複数のサイトを持つ機能は前からありましたが、開発中のTestやQAのためには不向きでした。Firebase Summit 2020で紹介されたPreview Channelsはサイト内にチャンネルという概念を使い本番用のチャンネルをLive Channel、一時的なテストやQA用のチャンネルをPreview Channelとして本番同様の環境を複数用意できるようになりました。

Firebase Tools v8.12.0以上で次のコマンドでチャンネルのデプロイが可能です。

firebase hosting:channel:deploy new-user-page

デフォルトでは有効期限は7日間ですが、オプションで調整が可能です。有効期限を1日にしたければ--expires 1dとつけることで有効期限を1日にできます。有効期限は最大で30日まで伸ばすことが可能です。

firebase hosting:channel:deploy new-user-page --expires 1d

CIと組み合わせることでPRごとに動作環境を気軽に用意がしやすくなりとても最高のアップデートですね。
GitHubを使っているのであればGitHub Actionsもサポートされているので手軽に組み込むことができます。

Google Analytics

FirebaseのアップデートというよりはGoogle Analyticsのアップデートといった内容ですが、Google Analytics 4になり、今までFirebase SDKで集めていたイベントデータをGoogle Analyticsのダッシュボードで見やすくなりました。今までFirebase Console上で見れていたレポートをGoogle Analyticsのダッシュボードでも確認できるようになりました。

特に個人的には比較分析と目標到達プロセスをGoogle Analyticsで確認できるが最高にいいアップデートでした。

比較分析はFirebase Consoleで確認できていた内容に属性ごとの比較を簡単に見ることができます。
例えば国ごとに比較を見て、どこにマーケティングリソースを投入すべきかなどを簡単にみることができます。

目標到達プロセス分析はFirebase ConsoleではFunnelと呼んでいるものですが、様々な条件を加えてよりユーザーの行動に即した目標到達プロセスを組み立てて分析することができます。
これを活用することにより、どのポイントでユーザーが離脱しているのかを簡単に見つけることができますし、改善を行ったときの効果を測定することも容易になります。

また、Firebase Summit 2020で紹介されたGoogle Analytics 4 Measurement ProtocolではサーバーサイドのイベントもAnalyticsに直接記録することができるようになりました！

今の所、使えてないのでこの辺も来年は活用していけたら嬉しいですね。

まとめ

ここで紹介しきれてない内容も色々ありますが、今年もFirebaseのアップデートはとても刺激的なものが多くてとても楽しい年でした。

僕は来年はもう少しFirebaseのアウトプットを増やしていこうと考えているので、Firebase大好き開発者の皆さん来年もよろしくおねがします。