自動で再生する
自動で完了にする
前のレクチャー
完了にして次に進む
ReactとFirebase とWebRTCで P2P ビデオ会議システムを開発しよう！
はじめに
本コースのご紹介 (2:36)
要件の把握と設計をやろう！
次のレクチャーに進む前に
本コースで実装するアプリケーションを触ってみよう (7:39)
配布資料について
シーケンス図で処理フローを理解しよう (20:37)
シグナリングサーバにのせるデータのデータ構造について (12:10)
コーディングをしよう！
ReactスケルトンアプリのgitリポジトリのURLについて
アプリケーションを新規作成しよう (14:43)
getUserMediaを使ってオーディオとビデオの使用許可を与えよう (17:17)
Material-UIをインストールしよう (15:08)
『あなたの名前を入力してください』のページを作ろう (30:34)
『相手の名前を入力してください』のページを作ろう (11:23)
あなたの名前を保持できるようにしよう【前半】 (27:15)
あなたの名前を保持できるようにしよう【後半】 (30:28)
相手の名前を保持できるようにしよう (18:42)
Gridコンポーネントでビデオ表示領域画面を作ろう (31:05)
ビデオ再生用の共通コンポーネントを作ろう (21:23)
リモート側のビデオ再生コンポーネントを設定しよう (7:43)
WebRTCの状態を管理するクラスを作成しよう (14:56)
あなたの名前と相手の名前をRtcClientに設定しよう (16:20)
画面が切り替わらない問題を対処しよう (28:43)
rtcClientの状態を変更する関数をrtcClientに統合しよう (31:17)
mediaStreamもrtcClientに統合しよう (13:59)
シグナリングサーバをリスンするためのメソッドを作ろう (5:52)
Firebaseでアプリケーションを作成しよう (6:18)
シグナリングサーバと通信する専用のクラスを作成しよう (30:23)
メディアストリームを設定しよう (19:58)
リモートのメディアストリームを設定しよう (7:36)
P2P接続のためのさまざまなコールバックを設定しよう (19:10)
シグナリングサーバ経由でofferを送信しよう (31:58)
シグナリングサーバ経由でofferを受信しanswerを送信しよう (27:42)
シグナリングサーバ経由でanswerを受信しよう (11:17)
通信経路(candidate)を送信しよう (23:38)
ビデオのスタイルを改善しよう (14:00)
ビデオの幅を動的に調整できるようにしよう (31:17)
音のミュートボタンを作成しよう (18:30)
P2Pの音声の伝達を切り替えられるようにしよう (17:34)
react-web-audioのページ
音声を可視化できるようにしよう (19:23)
音声ボタンの大きさと波形の幅を調整しよう (19:20)
起動直後にVideoコンポーネントが表示されるのを抑止しよう (7:07)
JavaScriptの形式から環境変数の設定のファイルを出力するプログラムのあるリポジトリ
Firebaseが発行する各種キーをgit commit対象から外そう (19:58)
本コースで実装したアプリケーションの公式リポジトリ
ビデオの幅を動的に調整できるようにしよう
レクチャーの中身がロックされています
受講済みの方であれば、
ログインが必要です
.
ロックを解除する