Firebaseの技術情報サイト

Firebaseの技術情報サイト

Firebase活用の為の技術情報サイトです

Firebaseのホスティングで出来る事と出来ない事

Firebase のホスティングで出来る事と出来ない事

Firebase のホスティングを利用すると、必要な時はすぐにでも Web サイトを開設できるのは大きな魅力です。利用もアクセスが多くなければ無料で運営できるのも個人で事業をする場合などはありがたい料金プランです。

この記事では、Firebase のホスティングでできることと出来ない事を少し詳しくまとめてみました。

目次
コンテンツが揃えば30分でサイトが稼働できる!
Firebase ホスティングを利用するステップ
Firebase で出来る事は?
Firebase で出来ない事は?
まとめ

コンテンツが揃えば30分でサイトが稼働できる!

最大の魅力は Web サイトのコンテンツがあれば、直ぐにでも Web サイトを開設できるのは大きな魅力です。例えば、現在別のホスティングサービスを使って運営しているサイトのコンテンツを使って Freibase のホスティングによる運営に切り替える場合、作業時間自体は30分もあれば簡単に切り替えることができます。

(*)カスタムのドメインを割り当てる場合、ドメインの所有権を確認するのに少し時間がかかるため、その場合はもう少しかかります。

Firebase のホスティングを利用するのに必要なのは以下の3点です

  • Google アカウント
  • Firebase プロジェクトの作成
  • Firebase CLI を利用するために、Node.js のインストレーション

これに加えて、サイトのコンテンツがあれば短時間で簡単にサイトを立ち上げることができます。

Firebase ホスティングを利用するステップ

Firebase のホスティングを利用するためのステップもシンプルです。最初にやることは、Google アカウントの取得です。既にお持ちの場合はそのままお持ちのアカウントで利用できます。お持ちでない方はまずは、Google にアカウントを作ります。

Node.js のインストール

Node.js をダウンロードしてインストールします。Windows や Mac ならばダウンロードしてインストールするだけです。Linux の場合は、利用しているパッケージによって多少差がありますが、ドキュメントを見ながらやれば簡単です。

Firebase CLI のインストール

Node.js をインストールするとパッケージ管理ソフトの「npm」が使えるようになるので、Firebase の CLI をインストールします。

$ npm install -g firebase-tools

(*) Linux や Mac の場合は、「sudo」をつける必要があります。

Firebase にログイン

Firebase にログインします。ログインには Google アカウントのユーザー名とパスワードを利用します。コマンドラインから以下のコマンドを実行すると Web ブラウザが立ち上がってログインするように言われるのでログインします。

$ firebase login

Firebase の初期化

Firebase のプロジェクトフォルダを作成します。Web サイトで公開するコンテンツをこのフォルダに置いて、公開します。

続いて、Firebase の初期化をおこないます。予めFirebase コンソールで Firebase のプロジェクトをつくっておくとスムーズです。初期化の際に新しいプロジェクトを作成することも可能です。

フォルダを作成したら、コマンドラインでそのフォルダに移動します。

$ cd [作成したプロジェクトフォルダ]
$ firebase init

で質問に答えながら、初期化をおこないます。「ホスティング」機能を忘れずに選択してください!

Web サイトのコンテンツの準備

公開する Web サイトのコンテンツを準備します。 必要なファイルをプロジェクトフォルダに Firebase の初期化をすると作成される、「public」(標準設定の場合)の下にコピーします。

公開

最後に以下のコマンドを実行すると、プロジェクトフォルダの「public」にコピーしたコンテンツがインターネットで公開されます。

$ firebase deploy

あとは、カスタムドメインの設定などを行えば Web サイトが稼働できます。 コンテンツが揃っていれば一連の作業は概ね30分から 1 時間もあれば完了できます。

Firebase で出来る事は?

基本的な Web サイトはほぼカバーできます。

  • HTML/CSS による Web サイト
  • React/Vue/Angular などのフロントエンドのフレームワークを利用したサイト
  • Next/Nuxt などバックエンド側でのレンダリングを行うサイト
  • Node.js を利用したバックエンドサービス

など、一般的な静的なサイトから、フレームワークを利用したサイトまで、シンプルなサイトから本格的な Web アプリ・Web サービスのホスティング可能です。

これらのホスティングが利用限度を越えなければ無料で利用できるのは非常に魅力的です。試作した Web アプリや Web サービスを簡単にインターネットで公開してテストをしたり、利用者にフィードバックをもらったりするための暫定公開などにも利用できます。

Firebase で出来ない事は?

万能に見える Firebase のホスティングですが、出来ない事もあります。

Web 制作や Web 開発で利用者も非常に多い WordPreass などは利用できません。 WordPress はバックエンドに、PHP の実行環境、SQL データベースなどを前提としているため、Firebase のホスティングでは、PHP や SQL のデータベースを利用できないので、WordPress も利用できません。

また、同じような理由で、Java や Python など Node.js 以外のバックエンドサービスも利用できません。

Node.js をベースにしたバックエンドサービスは実装できますが、実装の方法が Firebase 独自の方法になります。(Firebase Functions と呼ばれています)

確かに、こうした出来ない事はありますが、HTML/CSS/Javascript を学習して Web 開発に取り組む方には余り大きな問題ではありません。Firebase と React や Vue のフレームワークを組み合わせて利用すれば大抵の事は実現可能です。WordPress のように「テーマ」という形での提供ではないので、ページのデザインなどは多少大変な部分はありますが、それをカバーできる豊富な機能はフリーランスの強い味方になります。

まとめ

Firebase のホスティングは、基本的に、HTML/CSS/Javascript ベースの実装ならば基本的にバックエンドも含めてほぼ対応が可能です。 WordPress のテーマとプラグインのような形ではありませんが、開発者向けに Firabase はデータベースやユーザー認証、ストレージも提供しているので、フレームワークと組み合わせて利用すれば、効率的に魅力ある Web サイトを構築することは十分に可能です。

特にフリーランスの方は限られた時間とリソースで開発を進める必要がありますので、利用できる「便利な道具」の一つとして、取り入れらえると短期間での開発に効果を発揮できます。