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
今更 WebSocket で遊ぶ話 #javado
Search
Kihara, Takuya
February 09, 2020
Technology
0
410
今更 WebSocket で遊ぶ話 #javado
Java Doでしょう #17:Javaユーザーに伝えたい開発運用&フリーテーマ会!
https://javado.connpass.com/event/164021/
Kihara, Takuya
February 09, 2020
Tweet
Share
More Decks by Kihara, Takuya
See All by Kihara, Takuya
AWS Amplify Gen 2 GA記念 ~Gen1との違いを確認
tacck
0
31
Amplify Gen2 が GA したよ! #jawsug_sapporo #jawsug
tacck
0
140
Flutter で "Hello World!! #ゆるWeb札幌
tacck
0
100
AWS Lambda で LLRT を動かしてみた #北海道まったりLT大会
tacck
0
94
地方から始める登壇のステップアップ 〜Java Do から JJUG CCC への登壇参加記録 #javado
tacck
0
140
ゆるWebの新型コロナ Before/After とこれからのこと #seb_yearend
tacck
0
35
AWS Amplify と Amazon Bedrock を使ってオレオレ生成AIサイトを作る #ゆるWeb札幌
tacck
0
220
「普通」のエンジニアとしての生存戦略〜または、いかにして技術を楽しむか。 #情報メディア入門
tacck
0
90
噂の Amazon Bedrock を Java から使ってみる #javado
tacck
1
350
Other Decks in Technology
See All in Technology
累計ダウンロード数1億8000万を超えるアプリケーションプラットフォームのレガシーシステム脱却とモダン化への道
kmitsuhashi
0
120
Matterport を使ってクラスメソッド各拠点のバーチャルオフィスツアーを作成してみた
wakatsuki
0
160
公共領域から学ぶ クラウド移行についてエンジニアが意識していること
kawakawa2222
0
140
目標設定は好きですか? アジャイルとともに目標と向き合い続ける方法 / Do you like target Management?
kakehashi
10
3k
ABEMAにおけるLLMを用いたコンテンツベース推薦システム導入と効果検証
cyberagentdevelopers
PRO
1
720
フルリモートワークはエンジニアの夢を叶えたか? #cm_odyssey
mamohacy
2
600
[NIKKEI Tech Talk] KDDI/KAG Scrum & Community for Engineering Training
curanosuke
2
220
テストケースの自動生成に生成AIの導入を試みた話と生成AIによる今後の期待
shift_evolve
0
180
年間一億円削減した時系列データベースのアーキテクチャ改善~不確実性の高いプロジェクトへの挑戦~
lycorptech_jp
PRO
3
2.9k
AOAI Dev Day LLMシステム開発 Tips集
hirosatogamo
15
3.7k
地理情報とAPIのトレンド
nagix
0
160
コンテナ・K8s研修 - 前半 コンテナ基礎・ハンズオン【MIXI 24新卒技術研修】
mixi_engineers
PRO
0
170
Featured
See All Featured
The Mythical Team-Month
searls
217
43k
10 Git Anti Patterns You Should be Aware of
lemiorhan
652
58k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
353
29k
The Invisible Side of Design
smashingmag
294
50k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
36
9.1k
YesSQL, Process and Tooling at Scale
rocio
166
14k
Gamification - CAS2011
davidbonilla
78
4.9k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
44
4.7k
Code Review Best Practice
trishagee
58
16k
Unsuck your backbone
ammeep
666
57k
What’s in a name? Adding method to the madness
productmarketing
PRO
21
2.9k
Build your cross-platform service in a week with App Engine
jlugia
227
17k
Transcript
גࣜձࣾϊʔεσΟςʔϧ ։ൃ%JWJTJPOٕज़ਪਐ(SPVQ UBDDLݪ !UBDDL +BWB%PͰ͠ΐ͏ KBWBEP ࠓߋ8FC4PDLFUͰ ༡Ϳ ݄
!UBDDL +BWB%PͰ͠ΐ͏ KBWBEP • ໊લ ݪ / @tacck •
ॴଐ גࣜձࣾϊʔεσΟςʔϧ ։ൃDivision ٕज़ਪਐGroup / Leader • ओ࠵ • ΏΔWebษڧձ@ࡳຈ • εϚʔτεϐʔΧʔͰ༡΅͏ձ@ࡳຈ • ͖ͳϑΟΪϡΞεέʔτͷٕ εϓϨουɾΠʔάϧ ୭ PHP Conference Hokkaido 2019
!UBDDL +BWB%PͰ͠ΐ͏ KBWBEP 8FC4PDLFUͱ
!UBDDL +BWB%PͰ͠ΐ͏ KBWBEP • Webϒϥβ - WebαʔόؒͰ͑Δɺ ͓खܰͳํ௨৴ͷن֨ɻ • Webϒϥβ؍ͰɺJavaScriptͷ
ΠϕϯτϕʔεͰ࣮Մೳɻ → ΠϕϯττϦΨʔͰDOMߋ৽͕Ͱ͖Δ →→ νϟοτͳͲͷϦΞϧλΠϜΞϓϦ͕࡞Γ͍͢ɻ 8FC4PDLFUͱ
!UBDDL +BWB%PͰ͠ΐ͏ KBWBEP • Webαʔό (Node.js) • “post”ϝοηʔδΛड͚औͬͨΒɺ idΛ֬ೝͯ͠ΧϯτΞοϓɻ •
ΧϯτΞοϓޙʹɺ“selections”ϝοηʔδΛ શΫϥΠΞϯτʹ݁Ռૹ৴ɻ ؆୯ͳϦΞϧλΠϜථΞϓϦ
!UBDDL +BWB%PͰ͠ΐ͏ KBWBEP socket.on('message', message => { console.log(message) const obj
= JSON.parse(message) const type = obj.message const data = obj.data if (type === 'post') { selections[data.id].count++ } wss.clients.forEach(client => { client.send(JSON.stringify( { message: 'selections', data: selections } )) }) })
!UBDDL +BWB%PͰ͠ΐ͏ KBWBEP • Webϒϥβ (Vue.js) • “selections”ϝοηʔδΛड͚औͬͨΒɺ ͱΧϯτΛߋ৽ɻ •
ϘλϯΫϦοΫͰɺ “post”ϝοηʔδૹ৴ɻ ؆୯ͳϦΞϧλΠϜථΞϓϦ
!UBDDL +BWB%PͰ͠ΐ͏ KBWBEP mounted() { this.ws = new WebSocket('wss://tacck-ws.herokuapp.com/') const
self = this this.ws.addEventListener('message', message => { const obj = JSON.parse(message.data) const type = obj.message const data = obj.data if (type === 'selections') { self.selections = data } }) }, methods: { send(id) { this.ws.send(JSON.stringify( { message: 'post', data: { id: id } } )) } }
!UBDDL +BWB%PͰ͠ΐ͏ KBWBEP ࢼͦ͏ https://github.com/tacck/websocket-sample-client-vuejs https://github.com/tacck/websocket-sample-server-nodejs
!UBDDL +BWB%PͰ͠ΐ͏ KBWBEP FOE