そもそもFirebaseとは

https://firebase.google.com/?hl=ja

モバイルアプリやWebアプリケーションを素早く作成するために役立つ様々な機能が揃ったプラットフォームです。2014年にGoogleが買収し、現在もGoogleのサービスとして提供されています。

こういったプラットフォームを安定して提供することは技術力もリソースも必要ですが、Firebaseは十分にアプリ開発に使えるクオリティに達しており、さすがGoogleという印象です。

本記事はエンジニアのための技術的な解説ではなく、事業責任者・PM（プロジェクトマネージャー）・デザイナーなどエンジニア以外の職種の方にFirebaseの仕組みや概念をご理解いただけるように紹介していきます。

Webアプリケーション開発に使える代表的なFirebaseの機能

https://firebase.google.com/products?hl=ja

FirebaseはiOSやAndroid、Unityなど様々なアプリケーション開発に利用できますが、ここではWebアプリケーション開発に使える代表的な機能に絞ってご紹介します。

Hosting

簡単に言えば「HTML、CSS、JavaScriptが動くレンタルサーバー」です。

Firebaseのホスティングは自分でソフトウェアをインストールする必要はなくすぐに使い始めることができます。静的なWebサイトはもちろん、SPA（シングルページアプリケーション）も簡単に動かせるように設計されています。

また、CLI（コマンドラインインターフェース）が用意されているのがエンジニアに人気のポイントです。CLIが用意されていることでリリースを自動化して業務の効率化と正確性を上げることができます。

Cloud Firestore

アプリケーションには不可欠な機能である「データベース」です。

Firestoreも設定不要ですぐに使い始めることができます。管理画面からデータの閲覧や編集をすることができる他、APIも実装する必要が無く用意されているモジュールを使うことでアプリケーションからデータの読み書きを行うことができます。

エンジニアだけに関係する点ではありますが、Firestoreの技術的な特徴として「NoSQL」であることが挙げられます。一般的にWebアプリケーション開発で利用するMySQLやPostgreSQLといったデータベースはRDB（リレーショナルデータベース）と呼ばれSQLを使ってデータの読み書きを行います。NoSQLもRDBとできることは変わらないのですが、設計思想や使い勝手が異なり慣れているエンジニアは相対的に少ないです。

Cloud Storage

画像や動画などアセットを置いておけるファイルストレージです。

管理者が管理画面から画像をアップロードしたり、例えば自分のプロフィール画像などユーザーがアップロードした画像を置いておく場合にCloud Storageを利用します。

認証

ログイン、ログアウト機能をアプリケーションに簡単に実装できる認証機能が用意されています。

メールとパスワードを使った認証をはじめ、GoogleやFacebook、Twitter、GitHubといった各種サービスアカウントを利用した認証機能も作ることができます。

他にもこんな機能があります

Firebase上でプログラムを動かすことができるCloud Functions、パフォーマンス監視、Googleアナリティクスが用意されており、さらに画像リサイズや翻訳などよく使われる機能はエクステンションとしても提供されています。今後も様々な機能が提供されていくのではないでしょうか。

Firebaseでこのようなアプリケーションが作れます

Firebaseにはユーザーが触るUI、開発用語では「ビュー」や「クライアント」と呼ばれるものを提供する機能はありません。ビューは独自で開発しつつ、バックエンドで必要な機能だけをピックアップして使うことができます。その組み合わせ次第で、簡単なWebサイトからかなり重厚なアプリケーションまで幅広く利用することができるように作られています。

弊社でもFirebaseを使ったサイトやアプリケーションの実装事例は増えていて、具体的な事例を交えながらどんなアプリケーションが作れるかご紹介します。

お問い合わせフォームのあるランディングページ

https://marmot.biz/

ファスティングやトレーニングを通じて体と心を整えるMarmot!様のサービスのランディングページです。

このアプリケーションで使っている機能

  • Hosting

  • Firestore

  • Cloud Functions

このページにはサービスの説明に加えてお問い合わせフォームがあります。お問い合わせ後にユーザーと管理者にメールが送信され、同時にデータベースにも内容を保存します。Firebase自体にはメールを送信する機能はついていないので、SendGridというメール送信に特化したサービスを使ってメールを送信しています。

こうしたライトな機能が必要になる時にPHPやWordPressなどのCMSで実装するという選択もありました。ですがこれはやや冗長です。Firebaseを使えばライトなニーズにも答えることができます。

CMS機能のあるWebサイト

https://funteractive.co.jp/

弊社のコーポレートサイトとこのブログもFirebaseで実装しています。

このアプリケーションで使っている機能

  • Hosting

  • Firestore

  • Cloud Functions

  • パフォーマンス監視

  • Googleアナリティクス

お問い合わせフォームに加え、ContentfulというCMSと連携してブログやお知らせ、実績を更新する機能、そしてGoogleカレンダーと連携したオンライン相談予約システムも実装しています。

認証機能やデータベースを必要とするアプリケーション

Quokka（外部には公開していない弊社の社内用業務アプリです）

このアプリケーションで使っている機能

  • Hosting

  • Firestore

  • 認証

  • Cloud Storage

  • Cloud Functions

各自がGoogleアカウントでログインし、社内メンバーに対して質問とその回答を投稿できるサービスです。他にも日報が書けたり、今後は有休申請など機能を拡張して社内の様々な業務も集約していこうと思っています。

まとめ

本記事ではWebアプリケーションに使えるFirebaseの機能から具体的な制作事例までご紹介しました。

Firebaseについて、「名前は聞いたことがあるけれどこんなアプリが作れるとは知らなかった」「できたばかりのサービスなので自社のサービスに取り入れるのはまだ早い」といった印象をお持ちの方もいらっしゃるかもしれません。

私の所感としては「ほぼ静的なWebサイトから重厚なアプリケーションまで、Webのバックエンド開発手法としてFirebaseは有力な選択肢になる」と考えています。今新しくWebアプリケーションを開発するのであればFirebaseを使うことも選択肢に入れて検討してみてください。

ファンタラクティブではサービス開発についてのお悩み相談を無料で受け付けています。自社のサービスにFirebaseを使うべきかどうか、など課題をお持ちであればこちらからぜひお気軽にご相談ください。