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
チームをCQRS
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
boiyama
March 30, 2018
Programming
1.6k
1
Share
チームをCQRS
We Are JavaScripters! @17th
https://wajs.connpass.com/event/81022/
の発表資料です。
boiyama
March 30, 2018
More Decks by boiyama
See All by boiyama
Reproのビジネスサイドを支えるJS
boiyama
0
180
バックオフィスに行ったソフトウェアエンジニアの業務効率化事例
boiyama
1
270
2018年、IE6対応サイトを作る
boiyama
4
990
ヤバいESLint/TSLintルール作っちゃったかもしれない
boiyama
0
1.5k
フロントエンドのサーバーレス SSR編
boiyama
0
710
Serverless for Front-end Server-Side Rendering
boiyama
1
120
Learning Elm in JS
boiyama
1
560
JSでElmを学ぶ
boiyama
0
100
フロントエンドのサーバーレス SPA編
boiyama
1
1.1k
Other Decks in Programming
See All in Programming
Angular Signal Forms
debug_mode
0
110
PDI: Como Alavancar Sua Carreira e Seu Negócio
marcelgsantos
0
120
AWSコミュニティ活動は顧客のクラウド推進に効くのか / Do AWS community activities help customers adopt the cloud?
seike460
PRO
0
140
JAWS-UG横浜 #100 祝・第100回スペシャルAWS は VPC レスの時代へ
maroon1st
0
150
〜バイブコーディングを超えて〜 チームで実験し続けたAI駆動開発
tigertora7571
0
110
SkillがSkillを生む:QA観点出しを自動化した
sontixyou
6
3.4k
Cache-moi si tu peux : patterns et pièges du cache en production - Devoxx France 2026 - Conférence
slecache
0
240
ローカルで稼働するAI エージェントを超えて / beyond-local-ai-agents
gawa
3
280
Oxlintとeslint-plugin-react-hooks 明日から始められそう?
t6adev
0
270
Kingdom of the Machine
yui_knk
2
340
Making the RBS Parser Faster
soutaro
0
380
PCOVから学ぶコードカバレッジ #phpcon_odawara
o0h
PRO
0
270
Featured
See All Featured
Practical Orchestrator
shlominoach
191
11k
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
330
Public Speaking Without Barfing On Your Shoes - THAT 2023
reverentgeek
1
370
Leading Effective Engineering Teams in the AI Era
addyosmani
9
1.9k
The browser strikes back
jonoalderson
0
980
Efficient Content Optimization with Google Search Console & Apps Script
katarinadahlin
PRO
1
500
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
69
39k
The innovator’s Mindset - Leading Through an Era of Exponential Change - McGill University 2025
jdejongh
PRO
1
160
4 Signs Your Business is Dying
shpigford
187
22k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
133
19k
Agile Leadership in an Agile Organization
kimpetersen
PRO
0
130
Fireside Chat
paigeccino
42
3.9k
Transcript
ν ʔϜ Λ C Q R S 2 0 1
8 . 3 . 3 0 We A re J a v a S c r i p t e r s # 1 7
P ro f i l e • ϑϩϯτΤϯυΤϯδχΞ at PERSOL
• GitHub: boiyaa Twitter: boiyaaaaaa
C Q R S ίϚϯυΫΤϦ શͯͷॲཧίϚϯυʢߋ৽ʣ͔ΫΤϦʢࢀরʣͰɺͦΕͧΕඞཁͳͷ͕ҧ͏͔Β͚ͯߏ͢Δͱ ͍͏ύλʔϯ ߋ৽ॲཧɿ υϝΠϯϩδοΫ༗ σʔλ߹ੑ
ࢀরॲཧɿ υϝΠϯϩδοΫແ ύϑΥʔϚϯεͱ͔ݕࡧͷ͢͠͞ͱ͔
• αʔόʔαΠυͰΑ͘ΘΕΔύλʔϯ • Akka͕༗໊ ߋ৽ ࢀর EventʢߴՄ༻ͳDBʣ Stateʢ߹ͳDBʣ Command
• αʔόʔαΠυ͚ͩͰͷߟ͑ํͰͳ͍ • ReduxͳΜ͔CQRSνοΫͳϑϨʔϜϫʔΫ Event Props Action State ʢAPIͱ͔ ɹLocalStorageͱ͔ʣ
Reducer ߋ৽ ࢀর
ਓͷׂ͜Μͳײ͡Ͱ͚͍ͨͱ͍͏
ϑϩϯτΤϯυͱόοΫΤϯυͷ৬Λ ϑϩϯτΤϯυɿը໘Λ࡞Δ όοΫΤϯυɿσʔλΛ࡞Δ ͱఆٛ͢Δͱɺ
࣮ࡍͷݱͷׂ୲͜͏ͳ͍ͬͯΔ ϑϩϯτΤϯυ୲ऀɿϑϩϯτΤϯυʴΫϥΠΞϯτ αΠυόοΫΤϯυ όοΫΤϯυ୲ऀɿαʔόʔαΠυόοΫΤϯυ
ͱ͍͏ͷ ϑϩϯτΤϯυɹˠɹϑϩϯτΤϯυΤϯδχΞ όοΫΤϯυɹˠɹαʔόʔαΠυΤϯδχΞ ͳΜͰ͜͏ͳͬͯΔʁ
FirebaseͳͲΛ࠾༻ͯ͠ΫϥΠΞϯταΠυʹ΄ͱΜͲ ͷϩδοΫΛ͖࣋ͬͯͨΓ͢Δ ͰͦΕΛαʔόʔαΠυϨϯμϦϯάͨ͠Γ͢Δ ΫϥΠΞϯτͱαʔόʔͰࣄΛ͚Δͷ࣌ʹ ϑΟοτͯ͠ͳ͍ͷͰ
ࠓҰ ϑϩϯτΤϯυɿը໘Λ࡞Δ όοΫΤϯυɿσʔλΛ࡞Δ ʹཱͪฦׂͬͯΛఆ͍ٛͨ͠͠
ը໘Λߏ͢ΔͷࢀরॲཧͱͷΈ߹ΘͤͰɺ ߋ৽ॲཧΠϕϯτϋϯυϥͰߦΘΕΔͱ͍͏͜ͱΛ౿ ·͑Δͱɺ • ը໘ͱɺը໘Λߏ͢ΔͨΊͷࢀরॲཧΛ࡞Δ • ը໘ͷΠϕϯτϋϯυϥͱߋ৽ॲཧΛ࡞Δ ͱ͍͏ײ͡Ͱࣄߋ৽ܥͱࢀরܥͰͰ͖ͦ͏
Event State Event State ը໘ ΫϥΠΞϯτ αʔόʔ όοΫΤϯυ ΤϯδχΞ ϑϩϯτΤϯυ
ΤϯδχΞ ຊདྷͷը໘Λ࡞ΔɾσʔλΛ࡞Δ৬ʹूத
JavaScriptΫϥΠΞϯτɾαʔόʔͲͪΒ࡞ΕΔݴ ޠͳ͚ͩ͋ͬͯɺ JavaScripter྆ଆ͚ͳ͍͜ͱʹ߅͕ແ͍ਓ͕ଟ͍ ͱࢥ͏ ͨͩɺԣஅ͢ΔͷͰɺ֤ͷपลࣝΛநԽ͠ ͨπʔϧαʔϏεΛ׆༻͍ͨ͠
αʔόʔαΠυാͷਓ͚ େͳϑϩϯτΤϯυΤίγεϜͷΩϟονΞοϓͷखؒΛ͔͚ͣʹࡁΉͷ • Nuxt.js: VueϕʔεͰɺΕΔࣄͷଟ͞ͱԱ͑Δࣄͷগͳ͞ͷόϥϯε͕͍͍ • Next.js: Reactϕʔεʹ͔ͯ͠ͳΓԱ͑Δࣄগͳ͘Ͱ͖͍ͯΔ
• Redux: αʔόʔαΠυͰCQRS͍ͬͯΔਓʹೃછΈ͍͢ͱࢥ͏͠ɺӬଓԽ͍ͨ͠σʔλΛ ѻ͏ϑϨʔϜϫʔΫͱͯ͠ • AMP: ΕΔࣄগͳ͍͚ͲԱ͑Δࣄ͕Ұ൪গͳ͍ɻSPAͰͳ͍ͷͰαʔόʔαΠυతʹςϯϓ ϨʔτΤϯδϯʹॻ͚͍͍ͷͰϋʔυϧ͍
ϑϩϯτΤϯυാͷਓ͚ αʔόʔαΠυͷՄ༻ੑύϑΥʔϚϯεΛࣗྗͰ୲อ͢Δͷ͍͠ͷͰɺӡ༻ϋʔυϧͷ͍ͷ • Cloud Firestore: σʔλΛΫϥΠΞϯταʔόʔؒͰಉظ͢Δεέʔϥϒϧͳ NoSQLσʔλϕʔεɻ ͦͦ͜͜ͷΫΤϦػೳʢ!=ͱ͔orͱ͔ͳ͍ʣɻ·ͩϕʔλ •
Cloud Functions for Firebase: Firestore ͷߋ৽ΛτϦΨʔʹ Node.js ͷؔΛ࣮ߦͰ͖ΔͷͰɺෳࡶͳϩδοΫΛॻ͘ॴʹ͑Δɻ • Firebase Hosting: ͱͯ؆୯ʹ੩తϑΝΠϧΛFastlyͷڧྗͳCDNͰ৴Ͱ͖ΔɻυϝΠϯূ໌ॻஶ͘͠؆୯ɻ Cloud FunctionsͷϓϩΩγͰ͖ͯɺαʔόʔαΠυϨϯμϦϯάͨ͠ը໘৴Ͱ͖Δɻ • AWS AppSync: GraphQLͰDynamoDBʢεέʔϥϒϧͳ NoSQLσʔλϕʔεʣElasticsearch ServiceʢϑϧϚωʔδυͳݕ ࡧΤϯδϯʣ͔ΒσʔλऔಘͰ͖ΔαʔϏεͳͷͰɺΫΤϦͱ૬ੑ͕ྑͦ͞͏ɻ Lambda Ͱ Node.js ͷؔΛ࣮ߦͰ͖ΔͷͰɺෳࡶͳϩδοΫॻ͚Δɻ·ͩύϒϦοΫϓϨϏϡʔ
ͱ͍͏ໝ