Firebaseで何ができるのか？

Firebaseで何ができるのか？

Firebase は便利な「仕組み」ですが、何ができるのかは使ったことがない方にはわかりにくいですよね？そこでこの記事では、Firebase を使うと何ができるのかを簡潔に説明してみました。

Web ブラウザだけでもアプリは作れます！

よく「フロントエンド」と呼ばれているのは、Web ブラウザの中で動くプログラムの事を指しています。基本的には Javascript のプログラムということになります。

最近、開発に活用される事が多くなった Typescript の場合、実際に実行する際には Javascript に変換されて利用されるので、基本的にブラウザで実行されているのは Javascript のコードということになります。

Web ブラウザの中だけで「完結」する機能の場合は、Javascript のプログラムを書けばアプリは作れます。あとは、利用者が使いやすいようにユーザーインターフェースを HTML で作ればアプリを実装する事ができます。

React や Vue は何をしているか？

React や Vue などのフレームワークは基本的には HTML を利用したユーザーインターフェースを作りやすくする仕組みです。シンプルなアプリの場合は、こうしたフレームワークを使わなくても直接 HTML を書いても比較的簡単にページのデザインができます。

しかし、表示内容をデータに応じて書き換えたりする場合、つまり動的に表示内容を変えたりする場合は、React や Vue といったフレームワークを利用した方が便利です。

従って、少し複雑なユーザインターフェースが必要なアプリの場合、React や Vue などのフレームワークと組み合わせてアプリを作る方が便利ですし、効率も上がります。

Web ブラウザの限界

ところが、Web ブラウザには限界があります。 これは、セキュリティ上の理由によるものが大きな理由です。外部（利用している PC やスマホの以外）から勝手に利用している端末（PC やスマホ）の中のデータにアクセスしたり、書き換えたりするの危険から利用者を守るために、端末にデータを保存したり、端末のデータを読み込む操作に制限があります。基本的には、利用者が意図的にファイルを選んで「アップロード」したり、インターネットからファイルをダウンロードする操作に限定されています。

そうすると、アプリで処理したデータを保存したり、保存したデータをアプリから読み込むことは基本的にできないことになります。

Web ブラウザを開いている間はこうしたデータを保持できますが、一旦 Web ブラウザを閉じたり端末（PC やスマホ）の電源を切ってしまうとデータは消えてしまいます。

解決策はサーバーにデータを残す！

そこで、解決策として、必要なデータをサーバー（インターネット上）に置いてアプリやサービスを提供するという方法がよく使われます。

サーバー（インターネット上）にデータを保存するには、誰のデータかを識別する必要があります。そのために、多くの場合、インターネット上のサーバーにデータベースを置いて、利用者ごとにデータを分けて保存する方法がよく使われます。

利用者を識別するために、アカウントを作成してログイン（利用者の認証）を行って、利用者を特定した上で該当する所有者のデータを出し入れするという方法を使うのが一般的です。

インターネット上のデータベースとやりとりするには「窓口」が必要で、多くの場合はインターネット上のサーバーで「窓口」となるプログラムを動かしてデータベースとのやりとりをします。これが、よく「バックエンド」と呼ばれるプログラムの機能の一部になります。

このバックエンドのプログラムは、Web ブラウザで動いているのプログラムとは別のプログラムで Web ブラウザで動作しているフロントエンドとは別に開発する必要があります。

よく利用されている WordPress などはバックエンドで PHP のプログラムを動かしてインターネット上の SQL サーバーとのやりとりなどを行っています。

Firebase が提供する仕組みとは？

Firebase は、こうしたインターネット上で必要になる仕組みとフロントエンドとの仲介役の部分をまとめて提供するサービスです。

＊　利用者を識別するログイン（ユーザー認証）機能

＊　データを保存するデータベースとデータの出し入れ（読み書き）の機能

＊　ファイルをインターネットに保存する機能（ストレージ）

＊　Web サイトをホスティングする機能

他にも機能を提供していますが、主な機能は上に挙げた通りです。

インターネット上のサーバーで提供するバックエンドの機能に加えて、フロントエンドとバックエンドの仲介役の昨日までサポートしています。

通常は、こうした機能を使うには、インターネット上にサーバーを借りて（いわゆるホスティングサービス）そのサーバー上でバックエンドのプログラムを動かす仕組みを作る必要があります。

Firebase ではそうした必要な物全てを提供してくれるというわけです。

Firebase は何が便利なのか？

では、Firebase は何が便利なのでしょうか？

一言で言えば、HTML(CSS もふくめて)と Javascript だけで殆どの Web サービス・Web アプリが作れるというのが一番の特徴です。

何が素晴らしいかというと、

＊　必要な言語は「HTML／CSS」と「Javascript」だけで済む

＊　開発するプログラムはフロントエンドのみ（バックエンドは Firebase がカバー）

＊　サーバーを準備しなくて良い（Firebase が提供）

Firebase はよく「サーバーレス」と言われていますが、サーバーがないわけではなく、サーバーは Firebase が用意したものを利用できるということで、自分で準備しなくても良いということです。

なので、プログラミングの学習を始めたばかりの方でも、プログラミングの課題をやる感覚で Javascript のプログラムだけで、本格的な Web アプリ／Web サービスが始めたその日から作れるというのが最大の魅力です。

これが従来の方法だと、

＊　PHP や Java などの別の言語の学習

＊　SQL などデータベースの知識の学習

＊　データベースの構築（テーブルなどの作成）

＊　Web ホスティングのサーバーの準備

＊　バックエンドのプログラムの開発

＊　ネットワーク（RestAPI や HTTP など）の知識、プログラミング手法

などを学習、準備しないと実現できません。

Firebase を使うとこうした事に加えて

＊　ログインで必要な機能

＊　基本的なデータベースのアクセス（読み書きと削除）

＊　ファイルを置く場所

＊　Web サーバー

はすぐに使える状態で提供されています。 ユーザーの管理も新たにデータベースを作る必要なく、あらかじめ準備されていて、アカウントの作成・削除からパスワードの管理はパスワードのリセットなどを含めて既に用意されています。

つまり「Redy to GO」です。

Firebase の機能を自分で作ったら？

では、どれくらいの時間をセーブできるかというと、少なくても数週間分の作業時間をセーブできます。

慣れている人が同じような機能を実装する場合でも少なくても数週間はかかる仕事が「すぐに使える状態で提供されています」

実際は、作ったらその機能をテスト（検証）する必要があると思いますが、検証の手間を考えれば、時間にすれば確実に数週間分の作業に値します。検証は想像以上に手間と時間がかかる作業で修正するたびに最初からやり直す必要があることを考えると、既に基本機能が検証された状態で利用できるのは、開発する上で非常に大きな効率アップに繋がります。

まとめ

Firebase は Web アプリや Web サービスのフロントエンドの Web ブラウザ以外で必要な機能をほぼ全て賄ってくれるとてもパワフルで便利な仕組みです。k

最低限の Web プログラミングの学習で本格的な Web アプリや Web サービスを実現することを可能にしてくれます。

Web 開発のスキルアップで必要なことは、とにかく「完結」したアプリ、サービスを作ることです。本当に必要ならば Firebase の部分を後から後から置き換えれば良いだけです。限られた人と時間で Web サービスや Web アプリを作る場合、バックエンドをまとめて面倒をみてくれる Firebase は初心者やフリーランスの強い味方と言えます。