このレッスンはアーカイブされました
このレッスンは視聴可能ですが、質問の受付や内容の更新は終了しております。
-
#01 Firebaseを使ってみよう (02:39) 無料公開中
- 公式サイトの確認
- index.htmlの作成
-
#02 プロジェクトを作成してみよう (02:21) 無料公開中
- プロジェクトの作成
- Cloud Firestoreの設定
-
#03 開発に必要なスクリプトを読み込もう (02:48) 無料公開中
- 開発用スクリプトの導入
- main.jsの作成
- 公式ドキュメントの参照
-
#04 Firebaseの機能を理解しよう (02:15) 無料公開中
- Cloud Firestoreの仕組み
- 匿名ログインの仕組み
- データ構造
-
#05 データを保存してみよう (02:46)
- データの保存
- collectionの作成
- timestampsInSnapshotsの設定
- コンソールの確認
- データの削除
-
#06 投稿フォームを用意しよう (03:00)
- フォームの作成
- focus()の設定
- autocompleteの設定
-
#07 データの一覧を表示しよう (02:25)
- 表示領域の確保
- データ一覧の表示
-
#08 投稿日時で並び替えよう (02:15)
- サーバー側タイムスタンプの取得
- 投稿日時によるソート
- リストへの反映
-
#09 投稿処理を完成させよう (01:35)
- 体感速度の向上
- 空文字の投稿禁止
-
#10 CSSでスタイルを整えよう (02:48)
- styles.cssの作成
- アプリ画面のスタイリング
-
#11 onSnapshotで変更を監視しよう (02:46)
- onSnapshot()
- 複数ブラウザでの動作確認
-
#12 匿名ログインを使ってみよう (02:31)
- 匿名ログイン
- firebase-authの読み込み
- ボタンの作成
-
#13 ログイン状態を監視しよう (02:22)
- クリックイベントの設定
- onAuthStateChanged()
-
#14 複数の端末でログインしよう (02:21)
- ログイン/ログアウトボタンの表示切り替え
- 複数端末からのログイン
-
#15 ユーザーのIDを保存しよう (02:16)
- ユーザー情報の保存
- 投稿者IDの表示
-
#16 読み書きの権限を設定しよう (02:52)
- 読み書き権限の設定
- 動作確認
-
#17 チャットアプリを完成させよう (02:57)
- onSnapshotのエラー処理
- ログイン時に投稿一覧をクリアする方法
- 変数スコープの限定
