レストラン(サーバー)を用意して、住所(ドメイン)を決め、電話帳(DNS)に住所を登録する。
その店舗運営を管理会社(Firebase Hosting)に任せると、管理の手間なく誰でも来られるお店が完成します。
「山田さんに電話したい」→ 電話帳(DNS)で電話番号(コンピュータ用の数字の住所)を調べる →
番号に電話する(サーバーに接続する)→ 山田さんが出る(サーバーがデータを返す)→ 会話成立(ブラウザが表示)
使いたい時だけ電源を入れる。
シャットダウンしたらアクセス不可。
自分だけの「自炊キッチン」。
| 特徴 | 内容 |
|---|---|
| 稼働時間 | 使う時だけ |
| アクセス(ホームページを見に来ること) | 自分だけ |
| 目的 | 個人の作業 |
中身は皆さんが使っているPCと同じ。
違いは24時間つけっぱなしで、
誰からのアクセスにも応答できること。
| 特徴 | 内容 |
|---|---|
| 稼働時間 | 24時間365日 |
| アクセス | 世界中の誰でも |
| 目的 | データを届ける |
会社にサーバー用のPCを置いて、電気・空調・セキュリティを全部自分で管理。壊れたら自分で修理。
| 課題 |
|---|
| 高価な機器を自社で購入・保有 |
| 専任の管理者が必要 |
| 壊れたら自分で修理 |
| 急なアクセス増に対応しにくい |
Xserverやさくらサーバーなどの会社が管理しているPCを「必要な分だけ借りる」仕組み。自分でPCを用意する必要なし。
| メリット |
|---|
| 初期費用なし、使った分だけ支払い |
| 管理はサーバー会社にお任せ |
| 壊れても自動で代替機に切り替え |
| アクセス増に合わせて簡単に拡張 |
サーバーの本当の場所は数字の羅列(IPアドレス)で表されます。
例:203.0.113.42
これを覚えてアクセスするのは現実的ではありません。
数字の代わりに意味のある名前でアクセスできます。
例:gonmura.com
正式名称:Domain Name System(ドメイン・ネーム・システム)
「gonmura.com」という名前を「203.0.113.42」という数字(IPアドレス)に変換してくれる仕組みです。
電話帳が「山田さん」→「090-xxxx-xxxx」に変換するのと同じ役割です。
DNS(電話帳の仕組み)の中で、実際に「このドメインの場所はここですよ」と答える担当のサーバーのこと。
ドメインを買ったあと「このドメインの問い合わせは、どのネームサーバーに聞けばいいか」を設定します。
ドメインを 買って所有する 場所。
例:お名前.com / Google Domains / Cloudflare Registrar など
そのドメインの 問い合わせに答える 場所。
例:Cloudflare / Route 53 / Firebase / 各レジストラの標準DNS など
国内・海外それぞれ複数の選択肢があります。サポート言語・料金・他サービスとの連携で選びます。
| サービス | 特徴 | 主な利用層 |
|---|---|---|
| お名前.com | 国内最大手。日本語サポート・支払い手段が豊富 | 国内企業・個人 |
| ムームードメイン | GMO系。レンタルサーバーとセットで使いやすい | 個人・小規模サイト |
| Xserver ドメイン | Xserverレンタルサーバーと相性◎ | 国内ユーザー |
| Cloudflare Registrar | 原価販売(手数料なし)。DNSも一体運用できる | エンジニア・コスト重視 |
| Squarespace(旧Google Domains) | 2024年に移管。海外サービス向け | 海外サービス利用者 |
| GoDaddy / Namecheap | 世界最大手。海外連携が豊富 | 海外向け・グローバル |
ネームサーバーに登録する「このドメインの〇〇は△△ですよ」というメモ書き。種類によって書く内容と用途が違います。
| 種類 | 書く内容 | 用途・たとえ |
|---|---|---|
| Aレコード | ドメイン → IPアドレス(数字) | 一番基本の住所登録。 「gonmura.com → 203.0.113.42」 |
| CNAME レコード |
ドメイン → 別のドメイン | 別名・転送。 「www.gonmura.com → gonmura.com を見て」のように案内する |
| TXTレコード | ドメインに テキストのメモ | 所有確認・メール認証に使う。 「このサイトは私のものです」「このメールは本物です」の証明用メモ |
サーバーはレストランのようなもの。「この料理(ページ)をください」という注文に応じて、キッチンで準備して提供してくれます。
あらかじめ作っておいたページをそのまま返す。このポータルサイトもこの形式。高速で安価。
アクセスのたびにサーバーが内容を組み立てて返す。ログイン状況や個人情報に合わせた表示が可能。
データベース = レストランの食材庫。データを棚ごとに分類して保管。
| 保存されているデータの例 | 食材庫での場所 |
|---|---|
| ユーザー情報(名前・メール・パスワード) | 「ユーザー」棚 |
| 注文履歴(日時・商品・金額) | 「注文」棚 |
| 商品情報(名前・価格・在庫数) | 「商品」棚 |
サーバーの中は「ホール・キッチン・食材庫」の3つが連携しています。
前のスライドの「ホール・キッチン・食材庫」の各役割を、Firebaseのどのサービスが担当しているかをマッピングします。
| Firebase サービス | 役割 | レストランで言うと |
|---|---|---|
| Authentication | ログイン・ユーザー管理 | 入口の 受付係(誰が来たかを確認・本人確認) |
| Firestore | データベース(注文・ユーザー情報など) | 食材庫(材料=データを保管・取り出し) |
| Storage | 画像・動画・ファイル保管 | 大型倉庫(写真や動画など、サイズの大きい物を置く場所) |
| Functions | サーバー側で動く処理プログラム | キッチンの料理人(注文に応じて調理・計算する担当) |
| やること | 自分でやる場合 |
|---|---|
| サーバー(PC)の用意 | レンタルサーバーを契約・設定 |
| ドメイン取得 | ドメイン会社で購入・設定 |
| DNS設定 | ドメインとサーバーを紐づけ |
| SSL証明書 | 取得して定期的に更新 |
| ファイルのアップロード | 専用ツールでサーバーに転送 |
| アクセス増加への対応 | サーバーを増強・分散 |
| やること | 自分でやる場合 |
|---|---|
| 世界中に速く配信 | CDNを契約して配信網に乗せる |
| セキュリティ対策 | 攻撃検知・ファイアウォール設定 |
| バックアップ | 定期的にデータを別の場所に保存 |
| 監視・障害検知 | 24時間チェック |
| OS・ソフト更新 | セキュリティパッチを当て続ける |
| サーバーの管理 | 障害対応・トラブル解消を自分で |
全部やってくれる「管理会社」。あなたは料理(サイト)を作るだけ!
| やること | 自分でやる場合 | |
|---|---|---|
| サーバーの用意 | レンタルサーバー契約・設定 | 自動で用意される |
| ドメイン設定 | ドメイン会社で購入・設定 | URLが自動発行される |
| DNS設定 | 手動で紐づけ作業 | 自動で設定される |
| 通信の安全対策 | 安全な通信の設定を自分で | 自動で鍵マーク付きに |
| 障害対応・管理 | 24時間自分で監視 | Googleが24時間管理 |
この研修サイトもFirebase Hostingと同じ種類のサービス(Cloudflare Pages)で公開されています。
もっと詳しく知りたい方は バックエンド基礎研修 も参照してください。
「デプロイ」でサーバーが作られるのではなく、Googleの巨大なサーバー網に あなた専用の置き場が割り当てられる 仕組みです。
=お店のスペースを借りる瞬間
=そのスペースに商品を並べる瞬間
管理会社が用意してくれる xxx.web.app(または xxx.firebaseapp.com)は便利ですが、お客様に覚えてもらうなら自社ドメイン(例: gonmura.com)の方がいいですよね。その看板を自分のものに付け替えることができます。
Firebase Hosting でも Firebase App Hosting(動的なアプリ向けの新しいサービス)でも、カスタムドメインの設定方法はほぼ同じです。どちらもFirebaseの管理画面からドメインを追加して、DNS設定をするだけ。
Ch5の Firebase Hosting は「決まったメニューを並べておくだけのお店(中身が変わらないサイト)」向け。App Hosting は「Ch4で学んだキッチン(バックエンド処理)が必要な、注文ごとに料理を作るお店」向けの新しいサービスです。
| 向いている用途 | 会社案内・ブログ・LP | 会員サイト・ECサイト・SaaS |
| 中身 | 静的(誰が見ても同じ) | 動的(人によって違う表示) |
| バックエンド処理 | なし | あり(Ch4で学んだ仕組み) |
| デプロイ方法 | ファイルをアップロード | GitHubと接続して自動 |
GitHub は、お店のレシピや調理手順(プログラム)をクラウドにまとめて保管しておくサービス。複数のシェフ(エンジニア)が同じレシピブックを共有・更新できます。
GitHub上の「お店1店舗分のレシピブック」。料理(サイト)を作るためのレシピ・手順がまるごと入っている。
レシピブックの「正式版ページ」。試作中のレシピとは別に保管され、ここに載ったものがお店で出す本番メニューになる。
シェフ(エンジニア)が書いた新しいレシピを GitHub の main(正式版ページ)に push(反映)すると、管理会社(Firebase)が自動でそれを検知して、調理〜開店までを全部やってくれます。
GitHubのリポジトリ名を変更したため、Firebase App Hosting で 新しいバックエンドを作成して紐付け直した。…が、カスタムドメインの再接続を忘れていて、サイトが開けない状態になった。
バックエンドは「厨房(キッチン)」、カスタムドメイン(new.e-mu-cloud.jp)は「お店の看板」。厨房を新しく建て直したら、看板も新しい厨房を指すように電話帳(DNS)に登録し直さないと、お客様は古い空っぽの厨房に案内されてしまいます。Ch3で学んだDNSの仕組みがそのまま当てはまる話です。
PC でご覧ください
このスライドはPC画面(横向き)での閲覧を推奨しています。