🔥

Firebase Firestoreの新機能のクエリビルダーの使い方まとめ

2022/10/22に公開

こんにちは。株式会社ペライチ のWraptas担当の @nabettu です。

私は普段 Wraptas という 「NotionをヘッドレスCMSにしてWebサイトを制作できるNoCodeサービス」 を開発・運営しています。

https://wraptas.com/

このWraptasの裏側で動いているDBはFirebase Firestoreを利用しています。

そのFirestoreのWebのコンソールにクエリビルダーという機能が加わったので早速触って何ができるか調べて見ました!

クエリビルダーとはなんなのか

まずクエリビルダーはFirestoreの管理画面の既存のDBを見る部分が"パネルビュー"となっており、その隣の”クエリビルダー”をクリックすると表示されます。

クエリビルダーの画面
クエリビルダーの画面

クエリビルダーはその名の通り、DBのクエリをここで発行して、データを検索等できる画面となっております。

元々パネルビューでも、コレクションごとに検索を行うことができましたが、複合検索などはできませんでした。クエリビルダーではパネルビューでできなかった検索がコードを書かかずに行えるようになっております。

使い方

コレクション、またはコレクショングループを選択して検索対象を決定します。
すると下のクエリ結果にデフォルトで検索したドキュメントの結果が表示されていきます。

RDBと違い、フィールドが決まっていないNoSQLであるFirestoreなのでですが、いい感じにフィールドをまとめた上で表示してくれています。

下記の例ですと、field,field1,field2があるドキュメントと無いドキュメントが混ざった結果になっていますが、まとめて表示してくれています。

クエリ結果
クエリ結果

その上で、クエリを追加してから左上の"実行"ボタンを押すと、その結果に応じたドキュメントがクエリ結果に表示されていきます。

クエリ
クエリの追加

パネルビューではできなかったこと

まずパネルビューではできなかったクエリが発行できるようになっています。

元々のパネルビューでのクエリではwhere検索の指定と、Orderも昇順降順の選択しかありませんでした。

パネルビューのクエリ
パネルビューのクエリ

しかしクエリビルダーでは

  1. カウント
  2. Where
  3. Order by
  4. Limit

と、4種類のクエリを複合して検索ができるようになりました。

また、クエリの範囲でコレクショングループを選択できるようになりました。つまり、今までパネルビューではできなかった、コレクショングループを横断した検索が行えるようになっています。

カウント

カウントは先日のFirebase Summitでも発表があった、カウントクエリです。今までできなかったコレクションに含まれるドキュメントの数を出すことができます。

カウント結果
カウント結果

余談ですが、一応1クエリで1read分の料金しか消費しない模様です。

https://twitter.com/ObataGenta/status/1580686924645568513

Where by

こちらはパネルビューとは大きな違いはありませんが、コレクショングループでの検索が可能になったことで、ドキュメントIDを指定した検索ができるようになりました。

また、And条件で複数の条件での検索が可能になりました。

もちろんindexが必要な場合には追加を促すリンクが表示されます。これはコードを書いて実行する場合と同じです。

複数Whereとindex追加の例
複数Whereとindex追加の例

Order,Limit

Orderは今までwhere項目の降順昇順のみでしたが、複数検索できるようになったのでどの値を基準にするか選択ができるようになりました。

クエリビルダーでの検索も課金対象なので、節約したい場合Limitに少ない数を指定しておきましょう。

OrderとLimitを追加した例
OrderとLimitを追加した例

まとめと展望

以上Firebase Firestoreのあたらしい機能である、クエリビルダーの使い方でした。

ひとまず今までのパネルビューではできなかった検索機能が拡充され、今までコードが必要だったポイントが管理画面で完結するようになりました。

予想ですが、今後はクエリの保存なども出てきてより便利になるのではないでしょうか。

以上です。読んでいただきありがとうございました。

採用情報

現在ペライチではペライチのエンジニア、及びWraptasのエンジニアを募集しています!

▼ 採用ページ
https://recruit.peraichi.co.jp/

▼ 選考をご希望の方はこちら(募集職種一覧)
https://hrmos.co/pages/peraichi/jobs?category=1629135637016141824&utm_source=techblog&utm_medium=referral&utm_campaign=article-d78e07e4a371af

▼ まずはカジュアル面談をご希望の方はこちら
https://hrmos.co/pages/peraichi/jobs/0000029?utm_source=techblog&utm_medium=referral&utm_campaign=article-d78e07e4a371af

募集中の職種についてご興味がある方は、お気軽にお申し込みください(CTO がお会いします)

ペライチ

Discussion