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
OpenIL vol.1
Search
Take
February 21, 2014
Technology
0
3.6k
OpenIL vol.1
http://www.infiniteloop.co.jp/blog/2014/02/publicstudy01/
Take
February 21, 2014
Tweet
Share
More Decks by Take
See All by Take
トルテが実践したマッチしたユーザーを除く3つの方法/torte-es
ww24
1
12k
トルテリリースまでの Go Tips 16/torte-go-tips-16
ww24
1
11k
AMEBA OWND DE HTTP/2
ww24
0
450
Service Workers Push API Hands-on
ww24
1
160
Other Decks in Technology
See All in Technology
プロダクトエンジニアを支えるための開発生産性向上施策
tsukakei
0
140
再考 アクターモデル/ reconsider actor model
ytake
0
310
チームビルディングは"感性"で向き合おう / Team Building with Awareness
kohzas
0
210
より快適なエラーログ監視を目指して
leveragestech
4
1.4k
事前準備が肝!AI活用のための業務改革
layerx
PRO
1
370
DuckDB雑紹介(1.1対応版)@DuckDB座談会
ktz
6
1.4k
ロリポップ! for Gamersを支えるインフラ/lolipop for gamers infrastructure
takumakume
0
130
React Aria で実現する次世代のアクセシビリティ
ryo_manba
4
1.2k
Agile in Automotive Industry, puzzles and lights.
hiranabe
3
1.3k
不動産tech Product Night#2_AIことはじめ_GA橋本
takehikohashimoto
0
180
フルカイテン株式会社 採用資料
fullkaiten
0
32k
Jetpack Compose Modifier 徹底解説 / Jetpack Compose Modifier
wiroha
0
180
Featured
See All Featured
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
278
13k
Build your cross-platform service in a week with App Engine
jlugia
228
18k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
36
2.1k
Building Flexible Design Systems
yeseniaperezcruz
325
38k
Large-scale JavaScript Application Architecture
addyosmani
508
110k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.2k
The Power of CSS Pseudo Elements
geoffreycrofte
71
5.3k
StorybookのUI Testing Handbookを読んだ
zakiyama
26
5.1k
Fashionably flexible responsive web design (full day workshop)
malarkey
401
65k
Code Review Best Practice
trishagee
62
16k
Visualization
eitanlees
142
15k
Mobile First: as difficult as doing things right
swwweet
221
8.8k
Transcript
SMARTPHONE CONTROLLER OpenIL vol.1 த ݑ
ࣗݾհ • var age = 19 ࡀ (ੜ 2/24) •
ւಓۀେֶɹֶ෦ 2 ੜ • ΠϯϑΟχοτϧʔϓɹΞϧόΠτ • झຯཱྀߦɺࣸਅɺϓϩάϥϛϯά • Web Developer
͋ͱ 3 Ͱ age++ ͢ΔΠϕϯτ͕ɻ
p.tl/53x8 24 ࣌ؒडத
WORKS • IT ษڧձΧϨϯμʔ for Android & iOS • Image
Shortener - [img.ww24.jp] • Realtime Chat - [rtc.ww24.jp] • Connect Smartphone - [connect-sp.ww24.jp]
IT ษڧձΧϨϯμʔ εϚʔτϑΥϯΞϓϦ
IMAGE SHORTENER ॖ URL Λར༻ͨ͠ΦϯϥΠϯετϨʔδ
REALTIME CHAT Google Drive Realtime API Λར༻ͨ͠ Chat
CONNECT SMARTPHONE ύιίϯͱεϚϗͷϦΞϧλΠϜ࿈ܞ
CONNECT SMARTPHONE
CONNECT SMARTPHONE • Express.IO ΛͬͨɺεϚʔτϑΥϯͱύι ίϯͷϦΞϧλΠϜͳ࿈ܞΞϓϦέʔγϣϯ
AGENDA • ϦΞϧλΠϜͳ࿈ܞͱ • Express ͱ Socket.IO • Έ •
σϞ • αϯϓϧίʔυ • ɺ՝
CONNECT SMARTPHONE • ϦΞϧλΠϜͳ࿈ܞͷྫ • Chrome World Wide Maze •
https://chrome.com/maze/ • jsdo.it WebSocket Controller • http://jsdo.it/controller
CHROME WORLD WIDE MAZE Google ͷ໎࿏ήʔϜ
WEBSOCKET CONTROLLER jsdo.it
CONNECT SMARTPHONE εϚʔτϑΥϯΛύιίϯܨ͛ͯɺίϯτϩʔϥʹɻ
CONNECT SMARTPHONE • Έ • WebSocket Server (Socket.IO) • Web
Application Server (Express.js) • Socket.IO + Express.js = Express.IO
ۚͷ EXPRESS ޠௐͰղઆ
EXPRESS ͱ SOCKET.IO ͋ΔϓϩάϥϚ͕ίʔυΛॻ͍͍ͯͨͱ͜Ζɺ git commit ͢Δલʹख͕ͬͯΤσΟλ͝ͱ མͱͯ͠͠·͍·ͨ͠ɻ! ͢Δͱɺಥવঁਆ͕ݱΕʮ͋ͳ͕ͨམͱͨ͠ͷۚͷ express
Ͱ͔͢ʁͦΕͱۜͷ Socket.IO Ͱ͔͢ʁʯͱਘͶ͖ͯ·ͨ͠ɻ
EXPRESS ͱ SOCKET.IO ਖ਼ऀͷϓϩάϥϚɺʮࢲ͕མͱͨ͠ͷੜͷ WebSocket Ͱ௨৴͢ΔεύήοςΟίʔυ Ͱ͢ʯͱ͑·͢ɻ
EXPRESS ͱ SOCKET.IO ਖ਼ऀͷϓϩάϥϚʹײ৺ͨ͠ঁਆɺ! express ͱ Socket.IO Λֻ͚߹Θͤͨɺ express.io ΛϓϩάϥϚʹत͚ΔͷͰͨ͠ɻ
ຊͱແؔͰ͢ɻ
None
EXPRESS.IO express ͷΑ͏ͳײతͳϧʔςΟϯά express ͱڞ༗Ͱ͖Δηογϣϯ
CONNECT SMARTPHONE /connect/{connection_id}ɹʹϦμΠϨΫτ ɹଓɹॲɹཧ ΞϓϦέʔγϣϯɾήʔϜϖʔδʹϦμΠϨΫτ
CONNECT SMARTPHONE Connect Smartphone Smartphone (ࢠ) PC () Game Page
1 2 2 3 3 /connect/KCL98U
CONNECT SMARTPHONE Connect Smartphone Smartphone (ࢠ) PC () Game Page
Socket.IO
CONNECT SMARTPHONE • Connect Smartphone Ͱͷଓॲཧ • ཚ͔Β connection_id ੜ
• ͱࢠΛ connection_id Ͱর߹ • ʹଓ(ࢠ)ͷҰཡΛදࣔ
None
None
None
None
DEMO connect-sp.ww24.jp
αϯϓϧίʔυ
ଓ
ૹ৴ (ࢠ)
ड৴ ()
CONNECT SMARTPHONE • • ಉ͡ϒϥβͰ 2 ը໘։͘ͱɺશ͘ಉ͡ηογϣϯ ใΛ͍࣋ͬͯΔͷͰɺͲͪΒ͕͔ผͰ͖ͳ͍ !
! ઌʹଓ͖ͯͨ͠ํ͕Ͱྑ͍ΑͶʂ ͨ·ʹόάΔ
྆ํࢠͱఆ͞ΕΔ͜ͱ͕͋Δɻ
CONNECT SMARTPHONE • ͳͥͦ͏ͳΔ͔… • HTTP ϦΫΤετεςʔτϨεɻঢ়ଶΛ࣋ͨͳ ͍ɻঢ়ଶΛ࣋ͨͤΔͨΊʹηογϣϯΛ༻͍Δɻ • WebSocket
௨৴εςʔτϑϧɻίωΫγϣϯຖ ʹݸʑʹঢ়ଶΛอ࣋Ͱ͖Δɻϒϥβ͕ಉ͡Ͱ͋ͬ ͯɺ͔ࢠ͔ఆՄೳɻ
CONNECT SMARTPHONE • ϦμΠϨΫτͤ͞Δ࣮ʹͨ͠ཧ༝ • ελϯυΞϩϯͳ࣮Λࢦͨ͠ • αʔόͷ࣮ෆཁͰϦΞϧλΠϜ࿈ܞΛ࣮ݱ • URL
ϧʔςΟϯάࢠͷೝূͳͲɺ໘ ͳॲཧΛҰׅͯ͠ߦͬͨ
ࠓޙͷ՝ • ࣗಈతʹೝূ͍ͨ͠ • ύιίϯ㱻εϚϗʹݶΒͣɺ ήʔϜͰϓϨΠϠʔϚονϯάͰ͖ͦ͏
ϦΞϧλΠϜ௨৴ָ͍͠ʂ
express.io Ͱ շదͳϦΞϧλΠϜ௨৴ϥΠϑΛ