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
マイクロサービスとクライアント: 理想と現実の狭間で / Ideal and Reality...
Search
qsona
October 30, 2018
Technology
5
4.3k
マイクロサービスとクライアント: 理想と現実の狭間で / Ideal and Reality of microservices from the client-side
Microservices Meetup vol.9 (FiNC App & Frontend) でのウェルカムトークの資料です。
qsona
October 30, 2018
Tweet
Share
More Decks by qsona
See All by qsona
サーバー間 GraphQL と webmock-graphql の話 / server-to-server graphql and webmock-graphql
qsona
4
580
Backend エンジニア視点からの GraphQL / GraphQL from a perspective of backend engineer
qsona
28
8.9k
3 Practices about Service-to-Service GraphQL Ruby Client
qsona
1
1.1k
いかにして GraphQL を組織に導入するか (新規開発編) / how we introduce GraphQL on scratch development
qsona
6
4.1k
Well-organized Transaction Script - リファクタリングの妥協的手法 -
qsona
4
1.5k
GraphQL と Prisma から考える次のN年を見据えた技術選定 / Architecture decision for the next N years at StudySapuri
qsona
25
16k
最高のマスターデータ管理手法考察 & VSCode Extension を活用した話 / developing masterdata management tool by using vscode extension
qsona
9
8.3k
GraphQL を活用したスキーマ駆動開発の実践 / schema-driven development with GraphQL
qsona
6
7.4k
GraphQL を利用したアーキテクチャの勘所 / Architecture practices with GraphQL
qsona
37
17k
Other Decks in Technology
See All in Technology
TUNA Camp 2026 京都Stage ヒューリスティックアルゴリズム入門
terryu16
0
620
サイボウズ 開発本部採用ピッチ / Cybozu Engineer Recruit
cybozuinsideout
PRO
10
76k
AWS Systems Managerのハイブリッドアクティベーションを使用したガバメントクラウド環境の統合管理
toru_kubota
1
190
私がよく使うMCPサーバー3選と社内で安全に活用する方法
kintotechdev
0
140
「AIエージェントで変わる開発プロセス―レビューボトルネックからの脱却」
lycorptech_jp
PRO
0
180
Zephyr(RTOS)でOpenPLCを実装してみた
iotengineer22
0
150
【社内勉強会】新年度からコーディングエージェントを使いこなす - 構造と制約で引き出すClaude Codeの実践知
nwiizo
30
14k
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
11k
出版記念イベントin大阪「書籍紹介&私がよく使うMCPサーバー3選と社内で安全に活用する方法」
kintotechdev
0
110
俺の/私の最強アーキテクチャ決定戦開催 ― チームで新しいアーキテクチャに適合していくために / 20260322 Naoki Takahashi
shift_evolve
PRO
1
470
The essence of decision-making lies in primary data
kaminashi
0
180
QA組織のAI戦略とAIテスト設計システムAITASの実践
sansantech
PRO
1
250
Featured
See All Featured
Why You Should Never Use an ORM
jnunemaker
PRO
61
9.8k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
110
The agentic SEO stack - context over prompts
schlessera
0
720
jQuery: Nuts, Bolts and Bling
dougneiner
66
8.4k
Learning to Love Humans: Emotional Interface Design
aarron
275
41k
Designing Powerful Visuals for Engaging Learning
tmiket
1
310
What does AI have to do with Human Rights?
axbom
PRO
1
2.1k
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
300
sira's awesome portfolio website redesign presentation
elsirapls
0
200
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
260
What the history of the web can teach us about the future of AI
inesmontani
PRO
1
500
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Transcript
ϚΠΫϩαʔϏεͱΫϥΠΞϯτ: ཧͱݱ࣮ͷڱؒͰ @qsona / FiNC Technologies Inc. 2018-10-30 Microservices
Meetup vol.9 (FiNC App & Frontend)
ୈ1෦: ϚΠΫϩαʔϏεͷ݁߹ϨΠϠʔ
ϚΠΫϩαʔϏεͷྑ͞ !3 • ٕज़ҟ࣭ੑ – ͦΕͧΕ࠷దͳݴޠɾϥΠϒϥϦɾσʔλετΞΛར༻Ͱ͖Δ – ٕज़తෛ࠴ΛҾ͖ͣΓʹ͍͘ • ճ෮ੑ
(Resilience) – αʔϏεʹো͕ى͖ͯશମͷӨڹগͳ͍ • σϓϩΠͷಠཱ • খࣗ͘͞ɾಠཱͨ͠৫ – ίϛϡχέʔγϣϯύεΛݮΒ͠ɺҙࢥܾఆΛૉૣ͘
αʔϏεͷૄ݁߹͔ΒདྷΔ ߴ͍ࣗ༝ɾࣗ
αʔϏε͕ີ݁߹ʹͳΔͱ ϚΠΫϩαʔϏεͷྑ͞ফ͑Δ
ϚΠΫϩαʔϏεΛ݁߹͢Δऀୡ ... ݁߹ϨΠϠʔΛཧղ͠ɺ దʹରॲ͠ͳ͚ΕͳΒͳ͍ ࣄۀܭը, ΠϯϑϥετϥΫνϟ, ϑϩϯτΤϯυ, Ӧۀ, ԣஅతͳϏδωε, εΩϧηοτ,
σʔλੳ, ηΩϡϦςΟ, ίετϚωδϝϯτ, etc..
݁߹ͷྫ (1) ϚΠΫϩαʔϏεͱӦۀ !7 • ;ͭ͏ӦۀελοϑɺಛఆͷϚΠΫ ϩαʔϏεத৺ͷ৫ʹଐ͞ͳ͍ • ͔͠͠ɺ͠ଐ͍ͯͨ͠Βʁ –
Ӧۀελοϑ͕ࣗͷαʔϏεʹৄ͍͠ – αʔϏεͷมߋʹڧ͍ (αʔϏεʹมߋ͕͋ͬ ͨͱ͖ʹવӦۀελοϑʹप͞ΕΔ) – Ӧۀઌ͔ΒͷϑΟʔυόοΫ͕࣮ʹө͞ Ε͍͢ – αʔϏεͷڧ͍Ѫண͕࣋ͯΔ ϚΠΫϩαʔϏενʔϜA ϚΠΫϩαʔϏενʔϜB ΫϥΠΞϯτ(Ӧۀઌ)
݁߹ͷྫ (1) ϚΠΫϩαʔϏεͱӦۀ !8 • ͪΖΜ͜ΕΤϯυϢʔβʔΛແࢹ ͨ͠ص্ͷۭ – ϚΠΫϩαʔϏε(ػೳ)୯ҐͰӦۀ͞Εͯ ސ٬خ͘͠ͳ͍
– ΤϯυϢʔβʔϚΠΫϩαʔϏε͕౷߹͞ ΕͨମݧΛΜͰ͍Δ ϚΠΫϩαʔϏενʔϜA ϚΠΫϩαʔϏενʔϜB ΫϥΠΞϯτ(Ӧۀઌ)
݁߹ͷྫ (1) ϚΠΫϩαʔϏεͱӦۀ !9 • ӦۀνʔϜϚΠΫϩαʔϏεΛ౷߹ ͢Δ (݁߹ϨΠϠʔ) • νʔϜΛ·͕ͨͬͨίϛϡχέʔγϣ
ϯͷऔΓํΛߟ͑Δඞཁ͋Γ ϚΠΫϩαʔϏενʔϜA ϚΠΫϩαʔϏενʔϜB ΫϥΠΞϯτ(Ӧۀઌ) ӦۀνʔϜ
݁߹ͷྫ (2) ϚΠΫϩαʔϏεͱԣஅϏδωε !10 • ෳͷϚΠΫϩαʔϏεΛԣஅతʹར༻͢Δ ϏδωεϞσϧ • FiNCͰͷྫ: ಛεϚʔτΞϓϦ
– ಛఆͷܦ࿏͔ΒΞϓϦΛΠϯετʔϧ͢Δͱ ಛϢʔβʔʹͳΓɺ ಛઐ༻ΦϯϘʔσΟϯά͕࢝·Δ – ಛઐ༻ϛογϣϯ͕ղ์͞ΕΔ – ಛϢʔβʔ༻ʹΧελϚΠζ͞Εͨ push௨͕৴͞ΕΔ
݁߹ͷྫ (2) ϚΠΫϩαʔϏεͱԣஅϏδωε !11 • ෳͷϚΠΫϩαʔϏεΛԣஅతʹར༻͢Δ ϏδωεϞσϧ • FiNCͰͷྫ: ಛεϚʔτΞϓϦ
– ಛఆͷܦ࿏͔ΒΞϓϦΛΠϯετʔϧ͢Δͱ ಛϢʔβʔʹͳΓɺ ಛઐ༻ΦϯϘʔσΟϯά͕࢝·Δ – ಛઐ༻ϛογϣϯ͕ղ์͞ΕΔ – ಛϢʔβʔ༻ʹΧελϚΠζ͞Εͨ push௨͕৴͞ΕΔ • User Tag αʔϏε • Onboarding αʔϏε • Mission αʔϏε • Push௨ αʔϏε ͦΕͧΕ͕ ϚΠΫϩαʔϏεʹରԠ
݁߹ͷྫ (2) ϚΠΫϩαʔϏεͱԣஅϏδωε !12 • ίϛϡχέʔγϣϯܦ࿏͕ෳࡶʹͳΔ • ͷॴࡏ͕͍͋·͍ʹͳΓ͕ͪ – ֤αʔϏε͝ͱʹରԠࡁ·͍ͤͯΔ͕…
– end-to-end ͰͷڍಈͷνΣοΫ͕ෆेͩͬͨΓ – ʮಛεΩʔϜʯͱ͍͏ମݧͷશମΛୡ͢ΔͨΊͷϘʔϧ͕མ͍ͪ͢ • ༏ઌॱҐ͚ͮͷ – ࣗͷαʔϏεͷλεΫͱͲͪΒΛ༏ઌͤ͞Δͷ͔ – ಛͷ߹ʮ༏ઌॱҐ͕࠷ߴʯͰ͋Δ͜ͱ͕໌Β͔ͩͬͨͷͰɺ ͦ͜·ͰͰͳ͔ͬͨ
ୈ1෦ ·ͱΊ !13 • ͯ͢ͷϚΠΫϩαʔϏε͕ૄ݁߹ͳͷ͕ཧ – ٕज़ҟ࣭ੑ, খنͰࣗͨ͠৫, etc... •
ϚΠΫϩαʔϏεΛ݁߹͍ͯ͠ΔϨΠϠʔͷଘࡏ͕ݱ࣮ • ݁߹ʹΑΓى͖͏Δʹର͠ɺదʹରॲ͢Δඞཁ͕͋Δ – (۩ମࣄྫʹର͢Δղܾࡦɺࠓճ৮Ε·ͤΜ) – ͜ͷ2ͭͷࣄྫʹରͯ͋͠·Γ brilliant ͳղܾࡦͳ͍ɺͱ͍͏ҹ
ୈ2෦: ϑϩϯτΤϯυͰͷ݁߹
ϑϩϯτΤϯυ (Web, Native App, ...) ϚΠΫϩαʔϏεͷ݁߹ϨΠϠʔ
ϑϩϯτΤϯυͰͷ݁߹ !16 • ϑϩϯτΤϯυΤϯδχΞ ΤϯυϢʔβʔΛ࠷ڧ͘ҙࣝ͢Δ – ΤϯυϢʔβʔ͕ݟ͍ͨͷϚΠΫϩαʔϏεͰͳ͍ – ౷߹͞ΕͨϢʔβʔମݧ
ϑϩϯτΤϯυͰͷ݁߹ !17 (ҎԼɺຊจΑΓҾ༻) ʮFOLIOͰɺBackends For FrontendsʢBFFʣΛ࠾༻͍ͯ͠Δ ͷͰ͕͢ɺ͜ΕʹΑͬͯ͞·͟·ͳαʔϏεAPIΛఏڙ͢Δࡍ ͷΛΞʔΩςΫνϟతʹղܾ͠Α͏ͱࢼΈ͍ͯ·͢ɻ(தུ) FOLIOͷαʔϏεͰɺޱ࠲Λཧ͢ΔɺגՁΛදࣔ͢Δͱ͍ͬ ͨػೳ͕ɺͦΕͧΕϚΠΫϩαʔϏεͱͯ͠ػೳ͍ͯ͠·͢ɻҰ
ํͰɺϢʔβʔ͕ݟΔը໘͔ΒݸผͷαʔϏεΛݺͼग़͢ͱɺ ϒϥβͷෛՙ͕ߴ·ΓɺੑೳྼԽͳͲͷΛҾ͖ىͯ͜͠ ͠·͍·͢ɻBFFͰ֤ϚΠΫϩαʔϏεͷݺͼग़͠Λू͢Δ͜ ͱͰɺ͜ΕΒͷΛղܾ͍ͯ͠·͢ɻ·ͨBFFΛઃ͚Δ͜ͱ ͰɺαʔϏεUIͷ౷ҰײΛอ͍ͪ͢ͱ͍͏ར͋Γ·͢ɻϚ ΠΫϩαʔϏεͰଟذʹΘͨΔػೳ͕ͦΕͧΕಠཱͯ͠ಈ͍͍ͯ ͯɺϑϩϯτΤϯυͰɺͦΕΛूͯ͠1ຕͷը໘ͰݟͤΔɻ Ϣʔβʔ͕ཉ͍͠ͷ͋͘·Ͱը໘Λ௨ͨ͡“ମݧ”ͳͷͰɺͦ ΕΛεϜʔζʹఏڙ͢ΔͨΊʹ֤෦ॺͱ࿈ܞͯ͠ϑϩϯτΤϯυ ͷҰຕͷը໘ʹू͢Δɻ͔֬ʹ͜ΕϋϒతͳׂͰ͢Ͷʯ ϑϩϯτΤϯυΤϯδχΞશମΛͭͳ͙“ϋϒ”ͷΑ͏ͳଘࡏ ΤϯδχΞʹٻΊΒΕΔίϛϡχέʔγϣϯೳྗɹࣾͷ“ϋϒ”ͱͯ͠ػೳ͢ΔϑϩϯτΤϯυΤϯδχΞϦϯάʔFOLIO ݟ ༸ีࢯ - Forkwell Press
FiNC͕औΓΜͰ͖ͨ͜ͱ • APIͷϦιʔεࢦԽ • APIΨΠυϥΠϯ • iOS/AndroidͷઃܭΛἧ͑Δ • ৫ͷϦϑΝΫλϦϯά (ϏδωεͰνʔϜׂ͠ɺΫϥΠΞϯτΤϯδχΞͱ
αʔόʔΤϯδχΞ͕ಉ͡νʔϜͰ։ൃ) • Backends for Frontends • Micro Frontends ※͍ͣΕࠓͷΠϕϯτͷத Ͱ৮ΕΔτϐοΫͰ͢
APIͷϦιʔεࢦԽɾAPIΨΠυϥΠϯ !19 • Backend API ڧ͘ϦιʔεΛҙࣝ͢Δ – ಉ͡υϝΠϯΛද͢ͳΒಉ͡ܗࣜ • Backend
API ͷܗࣜΛͰ͖Δ͚ͩἧ͑Δ – ϖʔδϯάͳͲ – جຊతʹنΛकΔ͚ͩͰ͍͍ͷͰɺ όοΫΤϯυͷࣗ༝͕ୣΘΕΔΘ͚Ͱͳ͍ • Ͳ͏ͯ͠ඞཁͳΒҳͰ͖Δ • ͦͦAPI͕ྑ͘ఆٛ͞Ε͍ͯͳ͍ͱɺ ΫϥΠΞϯτͰͷ݁߹ͷෛ୲͕૿͑Δ
Backends For Frontends ͱ Micro Frontends !20 • ΞʔΩςΫνϟ͔Βͷ2ͭͷΞϓϩʔν –
ͨͩ͠ɺํੑେ͖͘ҟͳΔ • Backends For Frontends ... ੵۃతʹ݁߹ΛҾ͖ड͚ɺෳࡶ͞ʹରॲ • Micro Frontends ... ݁߹ϨΠϠʔΛϑϩϯτΤϯυͷUIʹͣΒ͠ɺബ͘͢Δ
ΤϯυϢʔβʔʹͱͬͯͷཧ ։ൃऀɾ৫ʹͱͬͯͷཧ ͦΕΒΛݱ࣮ʹམͱ͠ࠐΉ