どうも、つよぽん(@tsuyopon_xyz)です！
今回はFirebaseの紹介「第6回目」の記事となります^^
前回の「【動画解説】Cloud Firestoreのロケーションの注意点【Firebase】」では、Firebaseのデータベースの1つ「Cloud Firestore」を作成するときの注意点を解説しました。
今回は、フロントエンド(JavaScript)から「Cloud Firestore」に保存しているデータの取得方法を実演しながら解説しました。
【Firebase】Firestoreからデータを取得する流れを動画で解説
動画で解説しているポイントをまとめると以下のとおりです^^
- ドキュメントからデータ取得のイメージを掴む
- フロントエンドでFirebaseを利用する準備
- Cloud Firestoreからデータを取得するまでの流れ
- 取得したデータを表示するまでの流れ
参考リンク
【追記】より学習しやすい専用サイトを用意しました
Firebaseの基本を学べる「Firebase入門」というのをYouTubeでも公開しているのですが、より学習しやすい「専用の学習サイト」を用意しました。
「専用の学習サイトはどんな感じなのか？」と気になっている人向けに、
以下のツイートの添付動画に紹介動画を用意したので、そちらで学習サイトのイメージを掴んでいただけたらと思います。
（以下ツイートの添付動画は、Firebaseではない別の学習コンテンツを紹介していますが、学習サイトのデザインは完全に同じものとなります。）
Web白熱教室でも公開している
「Next.js&TypeScript体験シリーズ」
をより学習しやすくするために、新しく作った学習サイトに移植して、
・スライド
・参考リンク集
・学習記録を取れるようにしました^^
以下リンク先はWeb白熱教室
↓https://t.co/MKIlsrIORZ添付動画は移植先の新学習サイト pic.twitter.com/4BhRvMWid5
— つよぽん@FrontHacks講師 (@tsuyopon_xyz) April 26, 2021
こちらの動画をご覧になるとわかると思いますが、以下に挙げたように、より学習しやすい環境になっているのがわかっていただけるかなと思います。
- Udemyのように学習記録が残せる
- 「前のページ」「次のページ」に簡単に移動できる
専用の学習サイトを使って学習を進められたい方は、以下のボタンをクリックしてご確認いただけたらと思います^^
