Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Twilio Video ハンズオン資料
Search
Kiminari Homma
April 28, 2016
Technology
1
310
Twilio Video ハンズオン資料
Twilio Video についての概要とハンズオン内容のpdfです。
Kiminari Homma
April 28, 2016
Tweet
Share
More Decks by Kiminari Homma
See All by Kiminari Homma
Twilio Meetup 東京 2022/11/11
honkimi
0
27
Twilio iOS 徹底攻略
honkimi
1
910
2021年 Twilio Voice 報告
honkimi
0
220
WebRTC ビジネスの失敗と成功
honkimi
2
1.4k
最近の Twilio トレンド報告
honkimi
0
310
Twilio Meet Up
honkimi
0
65
利用ユーザーからみた Twilio の紹介
honkimi
0
52
Zendesk App を Heroku で作ってみた話
honkimi
0
83
国内における Twilio x Alexa
honkimi
0
650
Other Decks in Technology
See All in Technology
複数の LLM モデルを扱う上で直面した辛みまとめ
kazuyaseki
1
230
匠MethodとRDRAとICONIXとDDDで実現する一気通貫オブジェクト指向開発
haru860
4
1.9k
Introduction to Jetpack Compose
pohjus
1
110
中央集権体制からDataOpsへの転換 / centralized-to-dataops-transformation
pei0804
7
1.4k
チーム単位で保守性を高める:独自指標と向上にむけた実践
tarappo
0
300
生成AI・LLM時代における 機械学習エンジニアとしてのキャリア戦略・開発戦略 / my-career-and-development-strategies-for-ml-engineer-2024
yuya4
3
160
データ品質をコード化! LINEヤフーのMLOpsを最適化する "ACP Data Quality" の紹介
lycorptech_jp
PRO
1
120
Azureコストは水道代/The_47th_Tokyo_Jazug
aeonpeople
3
350
大規模なアジャイル開発の現場と技術負債 / Technical Debt
yoshiitaka
20
4k
バッチ処理のSLOをどう設計するか
rynsuke
7
550
ビジネスとコード品質の接合点 そしてコード品質がそこに及ぼす影響 / The Intersections of Business and Engineering, and The Impact of Code Quality There
mtx2s
10
1k
KTC_DBRE.pdf
_awache
0
290
Featured
See All Featured
Fontdeck: Realign not Redesign
paulrobertlloyd
75
4.8k
Imperfection Machines: The Place of Print at Facebook
scottboms
257
12k
GraphQLの誤解/rethinking-graphql
sonatard
48
9.1k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
57
14k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
319
20k
JazzCon 2018 Closing Keynote - Leadership for the Reluctant Leader
reverentgeek
178
11k
Documentation Writing (for coders)
carmenintech
59
3.8k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
18
1.7k
Automating Front-end Workflow
addyosmani
1353
200k
What's new in Ruby 2.0
geeforr
335
31k
Designing with Data
zakiwarfel
94
4.8k
Building a Scalable Design System with Sketch
lauravandoore
455
32k
Transcript
Twilio Video ͷ֓ཁ selfree, llc Kiminari Homma (@kimihom)
ඞཁͳͷ • Twilio ΞΧϯτ (ମݧ൛Ͱ OK) • Firefox ͱ Chrome
• PHP or Ruby or Node.js Ͱ localhost Λ্ཱͪ ͛ΒΕΔڥ • ϝϞா(ΤσΟλʔ)
ࣗݾհ
ຊؒ ߖ @kimihom CTO at selfree,llc Twilio, Ruby on Rails,
Heroku, AWS, Android, iOS TwilioJP-UG ϝϯόʔ CallConnect (5Ͱి૭ޱΛ։ઃ) https://www.callconnect.jp
֓ཁฤ (20) Web RTC ͱ Twilio Video ʹ͍ͭͯ ϋϯζΦϯฤ (50)
͘͡
WebRTC (Web Real-Time Communication)
͍͍ͬͨԿऀʁ • ిɺϏσΦ௨Λϒϥβ͚ͩͰ࣮ݱ • ςΩετϑΝΠϧͷϢʔβؒૹड৴͕Մೳ • ϓϩάϥϛϯάʹΑͬͯԻɾө૾ΛૢΔ • P2P (Peer
to Peer) ٕज़ • ྫ͑ appear.in ͕༗໊
WebRTC ࣗମ2Ҏ্લ͔Β ొ࢝͠Ί͍ͯ·͢ɻ ↓ ͳͥࠓ͞Βʁ
WebRTC ͱ͔Ͳ͏ͤϒϥβґଘ Ͱ͍ͷʹͳΒͳ͍ͩΖww ॴḨ ݸਓಛఆͷؒͰ͏Ϩϕϧɻ (ͱ͋Δ Web ΤϯδχΞͷ৺ͷ)
ঢ়گ͕స͍ͯ͠·͢ • س·Θ͖͠ IE ͷݹ͍όʔδϣϯαϙʔτͷऴྃ • εϚϗར༻ऀͷٸ૿ • ֤ϒϥβͷ WebRTC
༷ͷਐԽ • Twilio Video ͳͲͷ։ൃ SDK ͷొ
WebRTC ͷબࢶ • WebRTC αʔϏεͷར༻ ɹ→ appear.in, 1meeting, BizMee ͳͲ
• WebRTC SDK Λར༻࣮ͯ͢͠Δ → Twilio Video, SkyWay ͳͲ • ੜ WebRTC Ͱ࣮͢Δ ߴ ࣗ༝
Why WebRTC SDK?
ϏσΦ௨ͷ࣮͚ͩʹूத • େΓ͍ͨ͜ͱͬͯಉͩ͡ΑͶ • WebRTC ͷ༷ͳͲΛؾʹ͢Δඞཁ͕ͳ͍ • UI ͱ ΠϕϯτॲཧΛॻ͚ͩ͘Ͱ
OK
Why not SkyWay but Twilio Video?
૬खͱͷ“ίϛϡχέʔγϣϯ”ͬͯ ϏσΦ͚ͩ͡Όͳ͍ɻ
ిɾνϟοτɾϏσΦ͕࿈ܞͨ͠ ΦϜχνϟωϧͳίϛϡχέʔγϣϯ ଏʹݴ͏ Contextual Communication จɹ຺ɹΛɹཧɹղɹ͠ɹͨɹސɹ٬ɹͱɹͷɹରɹ ͷ࣮ݱ͕༰қɻ
“SIGNAL” ʹʂ(1ϲ݄ޙ)
Twilio Video ͷ֓ཁ
ϦΞϧλΠϜͳϏσΦ௨ͷΠϯϑϥͱSDK ϞόΠϧΣϒΞϓϦͰߴػೳͳෳϏσΦ௨ ͱߴԻ࣭ͷԻମݧΛ࡞Γ·͠ΐ͏ɻTwilio Video ɺP2P௨ͷͨΊͷάϩʔόϧΫϥυ ΠϯϑϥͰࢧ͑ΒΕ͍ͯ·͢ɻ
Demo
Ͱ͖Δ͜ͱ • ϏσΦ௨ͷೝূͱొ • ௨ͷॳظԽ • ௨ͷൃ৴ͱண৴ • Data Channel
(COMING SOON) ϑΝΠϧσʔλͷ P2P ௨৴
ࢲ͕ͨͪ WebRTC ʹؔͯ͠৺ ͢Δ͜ͱ͋Γ·ͤΜɻ Twilio Video SDK Λ͏͚ͩͰ ϏσΦ௨ػೳΛ࣮ݱͰ͖·͢ɻ
$ISPNF ˕ 'JSFGPY ˓ *& º 4BGBSJ º .4&EHF ˚
ϒϥβαϙʔτ(β)
Video ͷ࣮Πϝʔδ 8FCαʔόʔ 5XJMJP3&45 4%, SID, API Key, Secret, Configuration
SID Token Token Ληοτ͢Δͱ Video ௨ػ ঢ়ଶɻ Video ൃ৴ ͱ ड৴࣌ͷΠϕϯτΛఆٛ ̍ ϦΫΤετ ̎ ̏ ̑ Video SDK (ϒϥβ, iOS, Android) ̐ Ϩεϙϯε
ݸਓతʹࢥ͏͜ͱ • ґવͱͯ͠ϒϥβαϙʔτո͍͠ • ࣮ࡍͷϢʔβʔར༻Λߟ͑Δͱ • ઌϢʔβʔ͚ɿChrome/Firefox ݶఆͰఏڙ • ҰൠϢʔβʔ͚ɿΞϓϦؒͰར༻
• Data Channel ʹΑΔσʔλૹड৴Ͱɺ։ൃͷ෯͕େ͖͕͘Γͦ͏
ࠓճͷϋϯζΦϯ Web ͷΈͰ͕͢ɺ iOS, Android ͷ࣮جຊతͳߏ ಉ͡Ͱɺॻ͖ํ͕ҧ͏ఔͰ͢ɻ ͥͻΞϓϦʹઓͯ͠Έ͍ͯͩ͘͞ɻ
ͦΕͰɺ Let’s Get Started!
Twilio Video Hands-On
ϋϯζΦϯ༰ • Twilio Video ͷαϯϓϧ (Web) Λಈ͔͢ • Twilio Video
ͷιʔείʔυΛཧղ͢Δ • Twilio Video ͷαϯϓϧΛ֦ு͢Δ • ΑΓਂ͘ Twilio Video ΛΔʹ
Video ͷ࣮Πϝʔδ 8FCαʔόʔ 5XJMJP3&45 4%, SID, API Key, Secret, Configuration
SID Token Token Ληοτ͢Δͱ Video ௨ػ ঢ়ଶɻ Video ൃ৴ ͱ ड৴࣌ͷΠϕϯτΛఆٛ ̍ ϦΫΤετ ̎ ̏ ̑ Video SDK (ϒϥβ, iOS, Android) ̐ Ϩεϙϯε ίί
ඞཁͳͷ • Twilio ΞΧϯτ (ମݧ൛Ͱ OK) • Firefox ͱ Chrome
• PHP or Ruby or Node.js Ͱ localhost Λ্ཱͪ ͛ΒΕΔڥ • ϝϞா(ΤσΟλʔ)
http://bit.ly/1NvGBxv ϋϯζΦϯ༰ (Qiita)
Twilio Video ͷࠓޙ • DataChannel ͰϑΝΠϧͷૹड৴͕Մೳʹ • REST API ͷొ
• ࢀՃऀͷ੍ޚ • ࢀՃऀ͝ͱͷཤྺͷऔಘ • iOS ͰͷεΫϦʔϯͷڞ༗
ΑΓਂ͘ Twilio Video ΛΔ • Twilio υΩϡϝϯτΛಡΉ • ඞཁʹԠͯ͡ API
υΩϡϝϯτΛಡΉ • Promise, EventEmitter ͳͲͷ࣮ΛΔ
Thanks.