Codelabに触れよう！
Firebaseを学ぶ手段の1つとしてCodelabがある。実際に手を動かしながら学ぶことができるので、何ができて何ができないのか学ぶことができます。
数多くのCodelabでもオススメのハンズオンが こちらのCloud Firestore Web Codelabです。このハンズオンは少ない時間でFirebaseの基礎となるAuth, Firestore, Rulesを学ぶことができます。Node.jsの環境があればすぐ試せるのも魅力のひとつです。
Cloud Firestore Web Codelabで学べること
- Firestoreの読み書き
- Firestoreとのリアルタイム通信
- Auth認証
- セキュリティルールの設定
- Firestoreの複雑なクエリ
- Firebase CLIツールの使い方
できあがるもの
レストランの検索やレーティング、レビュー、フィルタリングをFirebaseを使って簡単に実装できます。こんな豪華な機能が数行のコードで実装できるのもFirebaseの魅力のひとつですね。
このコードラボの可能性
今回はレストラン検索とどこでもありそうなWebアプリですが、このレストランという項目を変えるだけで自分オリジナルのWebアプリを作ることができると思います。たとえば、スポーツ選手図鑑、何かのイベント情報、商品レビューなどなど。
完成したら公開したい
完成したら公開したいですよね。Codelabでは公開の方法を解説していませんが、いくつか注意点をおさえれば簡単に公開できます。
承認済ドメインの確認
Authentication > ログイン方法 > 承認済ドメイン
のlocalhost を削除しましょう。
Rulesの確認
誰でもデータへフルアクセスできる状態になっていないか今一度確認しましょう。Auth認証を利用し必要な機能にのみ権限を付与しましょう
Pricingの確認
料金プランが自分の意図しているものか確認しましょう。
Firebase Hostingで公開
下記のコマンドで簡単にデプロイできます。
$ firebase deploy
デプロイ後 Hosting URL: の xxxxx.firebaseapp.com にアクセスし localhost と同じ機能ができていれば成功です！
Firebase Hostingの特徴
Firebase Hosting ではカスタムドメインも簡単にあてることができるほか、強力なCDNによりウェブアプリ、静的コンテンツ、動的コンテンツ向けの高速で安全性の高いホスティングを提供します。
デプロイしたものを無効にしたい
$ firebase hosting:disable
まとめ
- CodelabでFirebaseのプロダクトを体系的に学ぶことができる
- 自分のアイディア次第でオリジナルコンテンツを作成できる可能性を秘めている
- Firebase Hostingを使えばスケールアップ可能な環境にWebアプリをデプロイすることができる