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
リアルタイム回答集計システムを作って、実際にイベントで使った話
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
inureo
November 27, 2014
Technology
1
860
リアルタイム回答集計システムを作って、実際にイベントで使った話
inureo
November 27, 2014
Tweet
Share
More Decks by inureo
See All by inureo
IGNITION: What we did to provide a high-quality experience
inureo
0
110
SVGアニメーションをやってみたら結構いい感じにできた話
inureo
1
160
はじめてのexpress+socket.io
inureo
1
4.1k
Other Decks in Technology
See All in Technology
Kiroで見直す開発プロセスとAI-DLC
k_adachi_01
0
120
LINEヤフーにおけるAIOpsの現在地
lycorptech_jp
PRO
5
2.1k
Copilot 宇宙へ 〜生成AIで「専門データの壁」を壊す方法〜
nakasho
0
150
Kiro Powers 入門
k_adachi_01
0
140
新規事業×QAの挑戦:不確実性を乗りこなす!フェーズごとに求められるQAの役割変革
hacomono
PRO
0
160
Visional 28新卒プロダクト職(エンジニア/デザイナー)向け 会社説明資料 / Visional Company Briefing for Newgrads 28
visional_engineering_and_design
1
120
Cortex Code CLI と一緒に進めるAgentic Data Engineering
__allllllllez__
0
620
20260321_エンベディングってなに?RAGってなに?エンベディングの説明とGemini Embedding 2 の紹介
tsho
0
150
「コントロールの三分法」で考える「コト」への向き合い方 / phperkaigi2026
blue_goheimochi
0
130
1GB RAMのラズピッピで何ができるのか試してみよう / 20260319-rpijam-1gb-rpi-whats-possible
akkiesoft
0
800
「お金で解決」が全てではない!大規模WebアプリのCI高速化 #phperkaigi
stefafafan
5
2.2k
2026年もソフトウェアサプライチェーンのリスクに立ち向かうために / Product Security Square #3
flatt_security
1
740
Featured
See All Featured
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Bash Introduction
62gerente
615
210k
Conquering PDFs: document understanding beyond plain text
inesmontani
PRO
4
2.5k
Navigating Algorithm Shifts & AI Overviews - #SMXNext
aleyda
1
1.2k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
9.9k
The innovator’s Mindset - Leading Through an Era of Exponential Change - McGill University 2025
jdejongh
PRO
1
130
Into the Great Unknown - MozCon
thekraken
40
2.3k
Building AI with AI
inesmontani
PRO
1
820
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3.1k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
sarafernandez
0
150
VelocityConf: Rendering Performance Case Studies
addyosmani
333
24k
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
1.9k
Transcript
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͯ ࣮ࡍͷΠϕϯτͰͬͨ גࣜձࣾnanapi ख௩ ྄ @inureo
ࣗݾհ ख௩ ྄ @inureo גࣜձࣾnanapi ΤϯδχΞ - άϥϑΟοΫσβΠϯͷઐֶߍΛଔۀ - Web੍࡞ձࣾ
5 - 201310݄ nanapiʹΤϯδχΞͱͯ͠ೖࣾ དྷྺ ※ ݩʑσβΠφʔͳͷͰϑϩϯτपΓ͕ಘҙ ϝΠϯͷۀͰRailsʴCoffeeScript+Markup
1. ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ 2. ࠾༻ٕज़ɾ࣮ࡍʹͬͨߏ 3. ੍࡞্ؾΛ͚ͭͨ͜ͱɾϋϚͬͨ͜ͱ 4. ࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ ࠓͷΞδΣϯμ
1. ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ 2. ࠾༻ٕज़ɾ࣮ࡍʹͬͨߏ 3. ੍࡞্ؾΛ͚ͭͨ͜ͱɾϋϚͬͨ͜ͱ 4. ࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ ࠓͷΞδΣϯμ
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ 76ਓ16νʔϜͷΠϕϯτΛ ԁʹਐߦ͢ΔͨΊ Կނ࡞͔ͬͨ
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ 16νʔϜͬͯଟ͍
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ - 1νʔϜʹରͯ͠ճ֬ೝʹ5ඵ͔͚ͨ߹ɺ 16νʔϜͩͱ80ඵ͔͔Δ 16νʔϜͬͯଟ͍
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ - 1νʔϜʹରͯ͠ճ֬ೝʹ5ඵ͔͚ͨ߹ɺ 16νʔϜͩͱ80ඵ͔͔Δ - ճ֬ೝޙɺಘूܭߦΘͳ͚ΕͳΒͳ͍ ͷͰߋʹ͕࣌ؒඞཁ 16νʔϜͬͯଟ͍
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ - 1νʔϜʹରͯ͠ճ֬ೝʹ5ඵ͔͚ͨ߹ɺ 16νʔϜͩͱ80ඵ͔͔Δ - ճ֬ೝޙɺಘूܭߦΘͳ͚ΕͳΒͳ͍ ͷͰߋʹ͕࣌ؒඞཁ - ͦͷؒɺίϯςϯπ͕ࢭ·ͬͯ͠·͏ʂɹɹɹ ςϯϙѱ͍ʂ
16νʔϜͬͯଟ͍
͜ΜͳͷઈରճΒͳ͍ʂ ਓҝతϛεා͍Αʂ ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ
δϯΠɾςΩϛε [Gini Tekimis] ʢ1566ʙ1593ɹϑϥϯεʣ ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ ͡Ό͋γεςϜԽ͠Α͏
- ճͷूܭ - ਖ਼൱ͷൃද - શճͷҰཡදࣔ - ΫϥΠΞϯτͷճλΠϛϯά੍ޚ - ಘͷूܭ
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ ࠓճγεςϜԽͨ͠ͱ͜Ζ
- ఏࣔը໘ - ճఏࣔը໘ ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ ࠓճγεςϜԽ͠ͳ͍ͱ͜Ζ
- ఏࣔը໘ - ճఏࣔը໘ ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ ࠓճγεςϜԽ͠ͳ͍ͱ͜Ζ ͋͘·ͰूܭγεςϜʂ
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ γεςϜͷྲྀΕ ήʔϜϚελʔ ʢճҰཡը໘ɾཧը໘ʣ ΫϥΠΞϯτ
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ ΫϥΠΞϯτ ճͷૹ৴ ճࡁΈ͔Ͳ͏͔Λදࣔ γεςϜͷྲྀΕ ήʔϜϚελʔ ʢճҰཡը໘ɾཧը໘ʣ
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ ΫϥΠΞϯτ ཧը໘͔Βਖ਼ղऀͷ֬ೝ ճͷૹ৴ γεςϜͷྲྀΕ ήʔϜϚελʔ ʢճҰཡը໘ɾཧը໘ʣ
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ ΫϥΠΞϯτ ਖ਼൱ͷૹ৴ ճͱਖ਼൱ΛҰཡදࣔ ճ݁Ռͷอଘ γεςϜͷྲྀΕ ήʔϜϚελʔ ʢճҰཡը໘ɾཧը໘ʣ
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ ΫϥΠΞϯτ ूܭը໘͔Β݁ՌΛ֬ೝ γεςϜͷྲྀΕ ήʔϜϚελʔ ʢճҰཡը໘ɾཧը໘ʣ
ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ σϞ
1. ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ 2. ࠾༻ٕज़ɾΠϕϯτ࣌ͷػثߏ 3. ੍࡞্ؾΛ͚ͭͨ͜ͱɾϋϚͬͨ͜ͱ 4. ࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ ࠓͷΞδΣϯμ
࠾༻ٕज़ɾΠϕϯτ࣌ͷػثߏ - Node.js - Express - socket.io - CoffeeScript -
Jade/SASS/jQuery ࠾༻ٕज़
࠾༻ٕज़ɾΠϕϯτ࣌ͷػثߏ Ұཡը໘ ݉ ཧը໘ ϩʔΧϧαʔό ɾਐߦεϥΠυ WebSocket௨৴ ΫϥΠΞϯτʢiPad16ʣ εΠονϟʔ 3ͷϧʔλͰΠϯτϥωοτߏங
100ΠϯνϞχλ ग़ྗ Πϕϯτ࣌ͷػثߏ
࠾༻ٕज़ɾΠϕϯτ࣌ͷػثߏ Ұཡը໘ ݉ ཧը໘ ϩʔΧϧαʔό ɾਐߦεϥΠυ WebSocket௨৴ ΫϥΠΞϯτʢiPad16ʣ εΠονϟʔ 3ͷϧʔλͰΠϯτϥωοτߏங
100ΠϯνϞχλ ग़ྗ Πϕϯτ࣌ͷػثߏ
࠾༻ٕज़ɾΠϕϯτ࣌ͷػثߏ Ұཡը໘ ݉ ཧը໘ ϩʔΧϧαʔό ɾਐߦεϥΠυ WebSocket௨৴ ΫϥΠΞϯτʢiPad16ʣ εΠονϟʔ 3ͷϧʔλͰΠϯτϥωοτߏங
100ΠϯνϞχλ ग़ྗ ਐߦͱूܭΛׂ Πϕϯτ࣌ͷػثߏ
࠾༻ٕज़ɾΠϕϯτ࣌ͷػثߏ Ұཡը໘ ݉ ཧը໘ ϩʔΧϧαʔό ɾਐߦεϥΠυ WebSocket௨৴ ΫϥΠΞϯτʢiPad16ʣ εΠονϟʔ 3ͷϧʔλͰΠϯτϥωοτߏங
100ΠϯνϞχλ ग़ྗ 2ͭͷը໘ͷΓସ͑ Πϕϯτ࣌ͷػثߏ
࠾༻ٕज़ɾΠϕϯτ࣌ͷػثߏ Ұཡը໘ ݉ ཧը໘ ϩʔΧϧαʔό ɾਐߦεϥΠυ WebSocket௨৴ ΫϥΠΞϯτʢiPad16ʣ εΠονϟʔ 3ͷϧʔλͰΠϯτϥωοτߏங
100ΠϯνϞχλ ग़ྗ Πϕϯτ࣌ͷػثߏ
1. ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ 2. ࠾༻ٕज़ɾΠϕϯτ࣌ͷػثߏ 3. ੍࡞্ؾΛ͚ͭͨ͜ͱɾϋϚͬͨ͜ͱ 4. ࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ ࠓͷΞδΣϯμ
WifiରࡦʹΠϯτϥωοτΛߏஙͨ͠ - ձʹΠϯλʔωοτڥ͕༻ҙ͞ Ε͍ͯͨ - ͔͠͠ɺສ͕ҰΠϯλʔωοτʹܨ͕Β ͳ͘ͳͬͯ͠·ͬͨ࣌Λఆͯࣗ͠લͷΞ ΫηεϙΠϯτΛ3ͭ༻ҙͯ͠ɺΠϯτϥ ωοτΛߏஙͨ͠ ੍࡞্ؾΛ͚ͭͨ͜ͱɾϋϚͬͨ͜ͱ
ΫϥΠΞϯτ͕ෳͰಈ͘Α͏ʹͨ͠ - ສ͕ҰWebSocket௨৴Λอͬͨ··iPad ͕ಈ͔ͳ͘ͳͬͨ߹Λఆͯ͠ɺಉ͡νʔ ϜʹෳΫϥΠΞϯτ͕ଓͯ͠ ͳ͍ܗʹͨ͠ ੍࡞্ؾΛ͚ͭͨ͜ͱɾϋϚͬͨ͜ͱ
ΞΫηεURLͱνʔϜ໊Λඥ͚ͨ - ͕ࢮΜͩ߹Λఆͯ͠ɺґଘ CookieґଘSessionґଘͤͨ͘͞ͳ ͔ͬͨ - iPadͷΞΫηεΨΠυΛઃఆ͠ɺɹɹɹ URLόʔɾߋ৽ϘλϯͳͲΛແޮʹͯ͠ɺ ଞͷ෦ͷΞΫηεΛ͍ͩ ੍࡞্ؾΛ͚ͭͨ͜ͱɾϋϚͬͨ͜ͱ
༷ʑͳঢ়گΛఆͯ͠ػೳΛ࣮ͨ͠ - ֤νʔϜͷੜଘ֬ೝ - viewͷੜଘ֬ೝ - ΫϥΠΞϯτͷճకΊΓɾ࠶։ - ΫϥΠΞϯτͷճΛ࠶ಉظ -
etc ੍࡞্ؾΛ͚ͭͨ͜ͱɾϋϚͬͨ͜ͱ
express.ioͰϋϚͬͨ - express.ioͱ͍͏ͷɺexpress + socket.ioΛ͍͍ײ͡ʹউ खʹͭͳ͍Ͱ͘ΕΔͷ - express.ioͰrequire͍ͯ͠Δsocket.ioͷόʔδϣϯ͕ݹ - socket.io0.9
→ 1.0Ͱهड़ʹେ͖͘มΘ͍ͬͯΔɺͦ͜ʹؾ ͔ͣ req.to(id) ͕Ͱ͖ͳ͍ʂͱ͔ϋϚͬͨ - ݁ہexpress + socket.ioΛࣗͰͭͳ͛ͨʢ؆୯ʣ ੍࡞্ؾΛ͚ͭͨ͜ͱɾϋϚͬͨ͜ͱ
1. ϦΞϧλΠϜճूܭγεςϜΛ࡞ͬͨ 2. ࠾༻ٕज़ɾΠϕϯτ࣌ͷػثߏ 3. ੍࡞্ؾΛ͚ͭͨ͜ͱɾϋϚͬͨ͜ͱ 4. ࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ ࠓͷΞδΣϯμ
ͷ༷ࢠ ࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ
࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ
࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ
࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ
࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ
݁ ࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ
ʊਓਓਓਓਓʊ ʼɹେޭɹʻ ʉY^Y^Y^Yʉ ݁ ࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ
ͳΜͰେޭͳͷ͔ - Ұ੪ʹճ͕ग़ͯɺͲ͕͜ਖ਼ղ͔Θ͔Δͷ ͰΊͪΌͪ͘ΌΓ্͕Δ - ςϯϙྑ͘ਐߦͰ͖ɺ15ר͖Ͱఫऩྃ - ճɾಘूܭʹਓΛ͔ͣ͞ʹ͢ΉͷͰɺ ଞͷΠϨΪϡϥʔࣄ߲ʹରԠͰ͖ͨ -
γεςϜʹΑΔΤϥʔͳ͠ ࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ
- खॻ͖ೖྗͷ࣮ - σʔλͷӬଓԽʢMongoͱ͔ʣ - ूܭσʔλͷΞτϓοτػೳ - ֎෦αʔόʹ͓͍ͨ࣌ͷରԠ - etc
࣮ࡍʹࣾΠϕϯτͰͬͯΈͨॴײ ࠓޙ࣮͍ͨ͠ͷ
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠