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
フロントエンドのDXと今後
Search
Yosuke Furukawa
PRO
June 15, 2023
Programming
6
5.7k
フロントエンドのDXと今後
2023/6/15 に発表したフロントエンドのDXと今後についての発表です。
Yosuke Furukawa
PRO
June 15, 2023
Tweet
Share
More Decks by Yosuke Furukawa
See All by Yosuke Furukawa
Node.js, Deno, Bun 最新動向とその所感について
yosuke_furukawa
PRO
10
3.8k
Welcome JSConf.jp 2024
yosuke_furukawa
PRO
1
4.1k
tc39 x jsconf.jp Panel Discussion 2024
yosuke_furukawa
PRO
0
240
Removing Corepack
yosuke_furukawa
PRO
9
1.6k
JavaScript Runtime とはなにか
yosuke_furukawa
PRO
15
2.8k
Strip Types と Storage
yosuke_furukawa
PRO
4
410
Module Harmony について
yosuke_furukawa
PRO
3
1.7k
LTのやり方
yosuke_furukawa
PRO
16
2.6k
AppRouter Panel Talk
yosuke_furukawa
PRO
3
810
Other Decks in Programming
See All in Programming
NEWT Backend Evolution
xpromx
1
140
レベル1の開発生産性向上に取り組む − 日々の作業の効率化・自動化を通じた改善活動
kesoji
0
300
状態遷移図を書こう / Sequence Chart vs State Diagram
orgachem
PRO
2
200
マッチングアプリにおけるフリックUIで苦労したこと
yuheiito
0
190
Quand Symfony, ApiPlatform, OpenAI et LangChain s'allient pour exploiter vos PDF : de la théorie à la production…
ahmedbhs123
0
220
テストから始めるAgentic Coding 〜Claude Codeと共に行うTDD〜 / Agentic Coding starts with testing
rkaga
15
5.6k
[SRE NEXT] 複雑なシステムにおけるUser Journey SLOの導入
yakenji
0
150
テスターからテストエンジニアへ ~新米テストエンジニアが歩んだ9ヶ月振り返り~
non0113
2
220
脱Riverpod?fqueryで考える、TanStack Queryライクなアーキテクチャの可能性
ostk0069
0
500
Startups on Rails in Past, Present and Future–Irina Nazarova, RailsConf 2025
irinanazarova
0
240
おやつのお供はお決まりですか?@WWDC25 Recap -Japan-\(region).swift
shingangan
0
140
PipeCDのプラグイン化で目指すところ
warashi
1
300
Featured
See All Featured
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
Making Projects Easy
brettharned
116
6.3k
Rails Girls Zürich Keynote
gr2m
95
14k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
990
Building an army of robots
kneath
306
45k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Navigating Team Friction
lara
187
15k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
282
13k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
60k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Transcript
ϑϩϯτΤϯυͷDX ͱࠓޙ 6/15 @ Developer Experience Day 2023
Twitter: @yosuke_furukawa Github: yosuke-furukawa
ٕज़ސΛ͍ࣾͯ͠Δ • ϦΞʔΩςΫτʹ͍ͭͯͷ • ςετͷΓํͷ • ίʔυϨϏϡʔͷΓํʹ͍ͭͯ • ΞϓϦͷύϑΥʔϚϯεΛ্͍͚͛ͨͲ...
ٕज़ސΛ͍ࣾͯ͠Δ • ϦΞʔΩςΫτʹ͍ͭͯͷ • ςετͷΓํͷ • ίʔυϨϏϡʔͷΓํʹ͍ͭͯ • ΞϓϦͷύϑΥʔϚϯεΛ্͍͚͛ͨͲ... Γ͍ͨ։ൃ͕Ͱ͖͍ͯͳ͍
ݪҼ༷ʑ • ϝϯόʔͷशख़͕Γͳ͍ • ϓϩδΣΫτͷ͕࣌ؒΓͳ͍ • ඇػೳཁ݅ͷॏཁੑΛཧղͯ͠Β͑ͳ͍ • աڈͷ։ൃϓϩηε͔Βൈ͚ग़ͤͳ͍
ͳΜͰ "ͦΕ" ͕͍ͨ͠ͷʁ • ։ൃͷੜ࢈ੑΛ্͍͛ͨ • ͨͩ͜ͷੜ࢈ੑͱ͍͏ݴ༿ࣗମ͕ଟ༷ͳҙຯ ΛؚΜͰ͍Δ • ͕࣌ؒ࣠ଘࡏ͍ͯͯ͠ɺͦ͜ΛͲ͏Δ͔ʹ
ΑͬͯมΘΔ
։ൃͷੜ࢈ੑΛ্͍͛ͨ • ্͛ͯͲ͏͍ͨ͠ʁ • ͬͱΞτϓοτͯ͠ΞτΧϜΛՔ͍͗ͨ • Ծઆ => ݕূͷϓϩηεΛԿճ͍ͨ͠ •
ଞʹʁ • Ϟμϯͳ։ൃΛֶͿ͜ͱͰٕज़ऀͱֶͯ͠ͼΛಘ͍ͨ • ΠέͯΔϑϨʔϜϫʔΫʹ͢Δ͜ͱͰٕज़ϓϨθϯεΛ্͛ͯ ࠾༻ʹߩݙ͍ͨ͠
։ൃͷੜ࢈ੑΛ্͍͛ͨ • ্͛ͯͲ͏͍ͨ͠ʁ • ͬͱΞτϓοτͯ͠ΞτΧϜΛՔ͍͗ͨ • Ծઆ => ݕূͷϓϩηεΛԿճ͍ͨ͠ •
ଞʹʁ • Ϟμϯͳ։ൃΛֶͿ͜ͱͰٕज़ऀͱֶͯ͠ͼΛಘ͍ͨ • ΠέͯΔϑϨʔϜϫʔΫʹ͢Δ͜ͱͰٕज़ϓϨθϯεΛ্͛ͯ ࠾༻ʹߩݙ͍ͨ͠ ۩ମతͳՁΛఏڙ͍ͨ͠ ͋Δ͖࢟ʹ͍ͨ͠
ՁΛఏڙ͢Δ͜ͱΛ value ͔ΒདྷΔͱ͍͏ҙຯͰ valid ͳঢ়ଶΛࢦ͢
ਖ਼͋͘͠Δ͖࢟ʹ͢Δ͜ͱ very ͔Β͖͓ͯΓɺ veri fi ed ͳঢ়ଶΛࢦ͢
Ձͷఏڙͱ͋Δ͖࢟ͷٻ • ͜ΕΒͲͪΒ͔͕͚͍ܽͯͯɺͲͪ Βୡ͍ͯ͘͠ඞཁ͕͋Δ • ͪΖΜϏδωεͱ͍͏ҙຯͰՁͷఏڙ ͷํʹॏ͕ஔ͔ΕΔ • ҰํͰ͋Δ͖࢟Ͱͳ͍ͱঃʑʹͷͮ͘ Γ͔Βݱͷϝϯόʔ͕Εͯߦͬͯ͠·͏
͜ͷόϥϯεΛͲ͏อ͔ͭ ͬͺΓ͍͠
2ͭͷΞϓϩʔνͰ ղܾ͍͖͍ͯͨ͠
1. ϘτϜΞοϓ
ϘτϜΞοϓͷΞϓϩʔν • ݱͷϨϕϧͰݟΛͨΊ্͍ͯ͛ͯ͘ • ษڧձͩͬͨΓϋοΧιϯͩͬͨΓ༗ޮ • ڭ͑ͯ͘ΕΔਓΛั·͑ͯڭ͑ͯ͏ํ๏ ͋Δ
2. τοϓμϯ
τοϓμϯͷΞϓϩʔν • ࢦͱͳΔͷΛܾΊ͔ͯͦ͜Β͓Ζ͍͖͍ͯͨ͠ • ϑϩϯτΤϯυͷઃܭʹࢦΛͨͤΒΕ͍ͯͳ͍͔ Βํ͕ϒϨΔ • ઃܭͦͷͷΞϓϦέʔγϣϯಛੑʹدͬͯมΘΔ ͕ɺઃܭΛ͢ΔͨΊͷํͳΒ͋ΔఔدͤूΊͨ ݟΛݩʹ࡞ΕͰ͖ΔͷͰͳ͍͔ɾɾɾʁ
• ϑϩϯτΤϯυͷࢦΛ࡞Εͳ͍͔ɾɾɾʁ
ͦΜͳંʹग़ձͬͨͷ͕ ͪ͜Β DX CriteriaͱͻΖ͖͍ͩͪͱ ͷύωϧτʔΫ
ύωϧτʔΫ • ϑϩϯτΤϯυͷ৫ͷ(postdev) https://blog.nijibox.jp/article/postdev1/
͜͜Ͱͷ͠߹͍ͷ༰ • ըҰతͳΞϓϩʔνͰͳ͘ɺͦͷͦͷʹ Ԡͨ͡Ξϓϩʔν͕औΕΔ৫͕ͦ͜ڧ͍৫ • ڧ͍৫ʹͳͬͯ։ൃΛ͢Δࡍͷώϯτͱͯ͠ DX Criteria ͷΑ͏ͳࢦΛ༻ҙ͍ͨ͠ •
Ͱ͖ΕϑϩϯτΤϯυʹಛԽͨ͠ DX Criteria ͱ͔Λݕ౼ͯ͠Έ͍ͨ
͜͜Ͱͷ͠߹͍ͷ༰ • ըҰతͳΞϓϩʔνͰͳ͘ɺͦͷͦͷʹ Ԡͨ͡Ξϓϩʔν͕औΕΔ৫͕ͦ͜ڧ͍৫ • ڧ͍৫ʹͳͬͯ։ൃΛ͢Δࡍͷώϯτͱͯ͠ DX Criteria ͷΑ͏ͳࢦΛ༻ҙ͍ͨ͠ •
Ͱ͖ΕϑϩϯτΤϯυʹಛԽͨ͠ DX Criteria ͱ͔Λݕ౼ͯ͠Έ͍ͨ ͡Ό͋ͬͯΈΕ͍͍ Μ͡Όͳ͍Ͱ͔͢ʁ
ͱͷ͜ͱͰ
ຊ: ϑϩϯτΤϯυʹ͓͚Δ DX Criteria Λ࡞ͬͨ࡞Ζ͏ͱ ͍ͯ͠Δ
ϑϩϯτΤϯυ൛DX Criteria • ຊՈ DX Criteria ߴͳԾઆݕূΛճͯ͠৫ͷૉૣ͍ݕ ূͱࣦഊͱֶͼΛ࠷େԽ͠Α͏ͱ͢ΔͨΊͷํͰ࡞ΒΕͨ ౕ •
ͦͷΤοηϯε෦ͭͭ͠ɺϑϩϯτΤϯυྖҬʹಛԽ ͢Δ • ຊՈձࣾͷଟ͍͕ɺϑϩϯτΤϯυͱ͍͏ྖҬʹด͡ ΔͷͰɺձࣾͷগͳΊ • ҰํͰσβΠϯͱͷڠۀؔ࿈෦ॺͱͷଟΊ
ϑϩϯτΤϯυ൛ DX Criteria • ࡞ऀ • yosuke_furukawa • ahomu •
ϨϏϡʔ • hirokidaichi
ϑϩϯτΤϯυ൛ DX Criteria • ओཁ5߲ • ։ൃɾӡ༻ͷੜ࢈ੑΛࢧ͑Δٕज़ελοΫ • ϢʔβʔମݧΛࢧ͑Δඇػೳཁٻ •
ՁͷσϦόϦʔΛߦ͏ϓϩηε • γεςϜɾΞϓϦέʔγϣϯӡ༻ʢΞʔΩςΫνϟʣ • νʔϜϏϧσΟϯά
ͪͳΈʹ·ͩ ຏ͖ࠐΈதͰ͢ʂʂʂ
։ൃɾӡ༻ͷੜ࢈ੑΛࢧ͑Δ ٕज़ελοΫ
։ൃɾӡ༻ͷੜ࢈ੑΛࢧ͑Δٕ ज़ελοΫ • ੜ࢈ੑΛ্͛ΔͨΊʹٕज़໘ͰϥΠϒϥϦπʔ ϧΛͬͯରॲ͢Δ • ͨͩٯʹ͜ΕΓա͗ҙ • ΫϥΠΞϯταΠυͷར༻ڥɺUIͷϕετϓϥ ΫςΟεͷมԽɺϥΠϒϥϦͷΞοϓσʔτͳ
Ͳɺͱʹ͔͘มߋमਖ਼͕ଟ͍ՕॴͰ͋Γɺͦ͜ ʹରͯ͠Ͳ͏औΓΉ͔ͱ͍͏ςʔϚ
ྫΛڍ͛Δ
։ൃɾӡ༻ͷੜ࢈ੑΛࢧ͑Δٕ ज़ελοΫ • ੩తݕࠪͱܕ͚ • Linter, formatter, editor, Ռͯ TypeScript
ͰͬͯΔ ͔ɺɺɺͳͲɻ • TSΛ࠷ॳ͔Βج४ʹೖΕΔ͔໎͕ͬͨɺ͏ຆͲͷ ։ൃऀ͕͍ͬͯΔͷͱͯ͠બఆ • ։ൃͷπʔϧΛ͏ͷྑ͍͕ɺৼΓճ͞Εͳ͍Α͏ ʹ͍ͨ͠ΑͶɺͱ͍͏ࢥ͍ΛࠐΊ͍ͯΔɻ
։ൃɾӡ༻ͷੜ࢈ੑΛࢧ͑Δٕ ज़ελοΫ • ੩తݕࠪͱܕ͚ • ʢֶशͱվળʣ੩తܕ͚ݴޠίʔυϑΥʔϚολʔΛ༻͍ͯίʔυ ϕʔεͷಡΈ͢͞ͱอकੑΛ্͍ͤͯ͞Δ͔ • ʢϝτϦΫεʣόΫͷൃੜɺίʔυϨϏϡʔͷ࣌ؒͳͲͷϝτϦΫεΛ औಘ͠ɺ׆༻͍ͯ͠Δ͔
• ʢϓϥΫςΟεʣܕใΛAPIϨϕϧͰڞ༗͢ΔͨΊͷπʔϧΛ׆༻ͯ͠ ͍Δ͔ • ʢΞϯνύλʔϯʣ ੩తܕ੍Λదʹ༻ͯ͠ɺະવʹόάΛ͙͜ͱ Λ༏ઌ͍ͯ͠Δ͔ɺ͋Δ͍ܕ੍Λແࢹͯ͠ਐḿΛٸ͙͕ͳ͍͔
։ൃɾӡ༻ͷੜ࢈ੑΛࢧ͑Δٕ ज़ελοΫ • πʔϧνΣΠϯͱ։ൃޮ • πʔϧʹΑΔޮੑͷΞοϓ͕Ͳ͜·ͰͰ͖ͯ ͍Δ͔ • ྫ͑ build
πʔϧ͕͗ͨ͢Γ͠ͳ͍͔ • Mock ͱ͔Λదʹͬͯ։ൃޮ্͛ͯΔ͔
։ൃɾӡ༻ͷੜ࢈ੑΛࢧ͑Δٕ ज़ελοΫ • πʔϧνΣΠϯͱ։ൃޮ • ʢֶशͱվળʣLinter, formatter ͳͲπʔϧηοτΛڞ௨ Խ͍ͯ͠Δ͔ •
ʢϝτϦΫεʣπʔϧͷ࣮ߦ࣌ؒΛܭଌ͠ɺޮੑΛఆ ظతʹܭଌͰ͖͍ͯΔ͔ • ʢΞϯνύλʔϯʣҰ؏ੑͷͳ͍πʔϧબఆաͳΧε λϚΠζʹΑΓɺ։ൃޮ͕Լͯ͠͠·͍ͬͯͳ͍͔
։ൃɾӡ༻ͷੜ࢈ੑΛࢧ͑Δٕ ज़ελοΫ • ࣋ଓՄೳͳӡ༻ͷͨΊͷٕज़બఆ • ٕज़τϨϯυʹৼΓճ͞Ε͍ͯͳ͍͔ • ΞϓϦέʔγϣϯͷಛੑཧղ͍ͯ͠Δͷ͔ • ࣄۀઢͰϥΠϒϥϦϑϨʔϜϫʔΫΛબ
ఆ͍ͯ͠Δ͔
։ൃɾӡ༻ͷੜ࢈ੑΛࢧ͑Δٕ ज़ελοΫ • ࣋ଓՄೳͳӡ༻ͷͨΊͷٕज़બఆ • (ֶशͱվળ) ٕज़τϨϯυΛ͠ɺ৽ͨͳπʔϧϥΠϒϥ ϦͷධՁΛఆظతʹߦ͍ͬͯΔ͔ • ʢϝτϦΫεʣ
طଘͷ༻ٕज़ͷΞοϓσʔτසɺٕज़ε λοΫͷෳࡶ͞ɺηΩϡϦςΟࣄͳͲΛධՁɾվળ͍ͯ͠Δ ͔ • ʢΞϯνύλʔϯʣྲྀߦΓͷٕज़࠷৽ϥΠϒϥϦΛແཧʹऔ ΓೖΕɺٕज़ελοΫ͕աʹෳࡶԽͯ͠͠·͍ͬͯͳ͍͔
ϢʔβʔମݧΛࢧ͑Δ ඇػೳཁٻ
ϢʔβʔମݧΛࢧ͑Δඇػೳཁ ٻ • ඇػೳཁٻΛΨϯແࢹͯ͠ਐΊΔͱ݁ہग़དྷ্ ͕ͬͨͷ͕͍ʹ͘͘ͳΔ • ͲͷඇػೳཁٻʹͲͷఔԠ͑Δ͖ͰɺͲ͏ର ॲ͢Δ͔Λఆٛͯ͠ɺݕ౼ࡐྉʹͯ͠Β͍͍ͨ • ϑϩϯτΤϯυͰݴ͑ύϑΥʔϚϯεɺΞΫη
γϏϦςΟɺϝϯςφϯαϏϦςΟɺσβΠϯɺ ͳͲͳͲͨ͘͞Μඇػೳཁٻ͕͋Δ
ྫΛڍ͛Δ
ϢʔβʔମݧΛࢧ͑Δඇػೳཁ ٻ • ύϑΥʔϚϯε • ϨΠςϯγʔͱεϧʔϓοτͷ֓೦Λཧղ͠ɺԿ͕Կ Ͱ ʮLighthouse 100ͩʂʯͱ͔ʹͳ͍ͬͯͳ͍ ͜ͱ
• దٓύϑΥʔϚϯενϡʔχϯάίϯςετͳͲͰֶ ΔλΠϛϯάΛ࡞ͬͯཉ͍͠ • ݱঢ়ੳͱඪઃఆ͕Ͱ͖Δࡐྉ͕ἧ͍ͬͯͯ΄͍͠
ϢʔβʔମݧΛࢧ͑Δඇػೳཁ ٻ • ύϑΥʔϚϯε • ʢֶशͱվળʣCPUϝϞϦɺωοτϫʔΫͱݴͬͨجຊతͳ߲ʹ͍ͭ ͯͷϓϩϑΝΠϧΛऔΕɺݟํʹֶ͍ͭͯश͍ͯ͠Δ͔ • ʢϝτϦΫεʣJavaScriptCSSɺը૾ͱ͍ͬͨ੩తΞηοτͷσʔλα ΠζΛܭଌ͠ɺύϑΥʔϚϯεόδΣοτͱͯ͠༧ࢉཧ͕Ͱ͖͍ͯΔ͔
• ʢΞϯνύλʔϯʣ͕ࣗͨͪ৴͍ͯ͠ΔΣϒΞϓϦέʔγϣϯ͕Ͳ Ε͘Β͍ͷϑΝΠϧαΠζΛ৴͍ͯ͠Δ͔ΛѲ͍ͯ͠ͳ͍ • ʢΞϯνύλʔϯʣඪΛ࣋ͨͣʹܭଌ͠ɺࡍݶͳ͘νϡʔχϯάΛ͠Α ͏ͱ͍ͯ͠Δ
ϢʔβʔମݧΛࢧ͑Δඇػೳཁ ٻ • ΞΫηγϏϦςΟ • ׂΓͱ·ͩಋೖͰ͖͍ͯΔ։ൃ͕গͳ͍ྖҬ • ಛʹ։ൃ໘Ͱπʔϧग़͖͍ͯͯΔͷ ͷɺຊདྷతͳҙຯͰͷΞΫηγϒϧͳΞϓϦ έʔγϣϯͷ։ൃ·ͩτϥΠΞϧΛ͍ͯ͠
Δ৫͕ଟ͍ͱ͍͏ҹ
ϢʔβʔମݧΛࢧ͑Δඇػೳཁ ٻ • ΞΫηγϏϦςΟ • ʢϝτϦΫεʣΞΫηγϏϦςΟͷ੩తղੳΛߦ͏πʔϧΛ༻͍ͯɺఆظతʹܭଌΛߦͬͯ ͍Δ͔ • ʢϓϥΫςΟεʣ࣮νΣοΫϦετΛ࡞͠ɺ४ڌ͍ͯ͠Δ͜ͱΛ֬ೝ͍ͯ͠Δ͔ •
ࢀߟ: https://waic.jp/docs/jis2016/test-guidelines/202012/ • https://www.digital.go.jp/resources/introduction-to-web-accessibility-guidebook/ • ʢΞϯνύλʔϯʣHTMLͷηϚϯςΟΫεΛແࢹ࣮ͨ͠ʹͳ͍ͬͯΔ • ʢΞϯνύλʔϯʣλονύουϙΠϯςΟϯάσόΠεͰͷΈ੍ޚͰ͖ΔUIʹͳͬͯ͠ ·͍ͬͯΔ • ʢΞϯνύλʔϯʣνΣοΫπʔϧ͚ͩʹཔΓɺςετ࣮ࢪऀʹΑΔ֬ೝ͕ߦΘΕ͍ͯͳ͍
ՁͷσϦόϦʔΛߦ͏ ϓϩηε
ՁͷσϦόϦʔΛߦ͏ϓϩη ε • CI/CDͳͲܧଓͯ͠σϦόϦʔΛߦ͏ࡍʹʮߴ ʹԾઆݕূ͢ΔʯΈ͕ඞཁʹͳΔ • ϑϩϯτΤϯυྫ֎Ͱͳ͘ɺಛʹA/Bςετ ͳͲͰ࡞ΓΛҧ͑ΔͱʹͳΓ͍͢ • ଞʹΤϥʔোൃੜ࣌ʹΠϯϑϥʹ͖ͤΓ
ʹ͢ΔͳͲͷରԠ͕औΒΕͯ͠·͏ͱʹͳΔ
ྫΛڍ͛Δ
ՁͷσϦόϦʔΛߦ͏ϓϩη ε • ςετ • ʢֶशͱվળʣςετΧόϨοδج४ࣗಈςετΛ༻ҙ͠ɺ͜ΕΒΛܧଓతʹվળ͢ΔͨΊ ͷ͕νʔϜͰऔΒΕ͍ͯΔ͔ • ʢϝτϦΫεʣΧόϨοδΛՃͯ͠ςετ͕Ͳ͜Λ௨ա͍ͯ͠Δͷ͔֬ೝͰ͖͍ͯΔ •
ʢϝτϦΫεʣͯ͢ͷςετ͕PR͝ͱʹ30ҎͰऴΘΔ͜ͱΛ֬ೝ͍ͯ͠Δ • ʢϓϥΫςΟεʣPR͝ͱʹճ͢ςετͳͷ͔ͦΕͱఆظ࣮ߦ͢Δςετͳͷ͔Λఆ͍ٛͯ͠ Δ • ʢϓϥΫςΟεʣunit ςετ, integration ςετ, e2e ςετ, Visual Regression ςετͳͲͷ ֤छςετͷಛੑΛཧղ͠ɺదʹӡ༻Ͱ͖͍ͯΔ • ʢΞϯνύλʔϯʣҰ෦ͷਓ͚͕ͩςετΛॻ͖ɺҰ෦ͷਓςετΛॻ͔ͳ͍ͱ͍ͬͨΑ͏ ʹࣗಈςετΛݸʑਓͷྗඪͳͲʹͳ͍ͬͯΔɻ
ՁͷσϦόϦʔΛߦ͏ϓϩη ε • σϓϩΠ • ʢϓϥΫςΟεʣa/b test, feature fl ag,
canary releaseͳͲ ͷࢼ࣮ͯ͠ફͨ͠ޙͰมߋ͍͢͠σϓϩΠΛߦ͍ͬͯΔ͔ • ʢϓϥΫςΟεʣҟৗ࣌ʹ͙͢ʹΓͤΔΑ͏ʹ Blue Green Deploy ͳͲͷΈ͕͋Δ͔ • ʢΞϯνύλʔϯʣσϓϩΠҰճʹରͯ͠1࣌ؒҎ্ͷ࣌ؒ ͕͔͔Δ
γεςϜɺΞϓϦέʔγϣϯ ӡ༻ʢΞʔΩςΫνϟʣ
ྫΛڍ͛Δ
γεςϜɺΞϓϦέʔγϣϯӡ ༻ • BFFɺAPIઃܭ • ʢϓϥΫςΟεʣϑϩϯτΤϯυΤϯδχΞଆ͔ ΒAPIઃܭΛఏҊͰ͖Δڥʹͳ͍ͬͯΔ͔ • ʢΞϯνύλʔϯʣόοΫΤϯυΤϯδχΞ͚ͩ ͕ओಋͯ͠APIΛઃܭ͓ͯ͠ΓɺϑϩϯτΤϯυ
ΤϯδχΞ͕ར༻͠ʹ͍͘ઃܭʹͳ͍ͬͯͳ͍͔
γεςϜɺΞϓϦέʔγϣϯӡ ༻ • Πϯϑϥ • ʢϓϥΫςΟεʣϑϩϯτΤϯυ୲ऀ Web ʹؔΘΔΠϯϑϥͷߏΛѲͰ͖͍ͯ ͯɺোରԠʹࢀըͰ͖Δ •
ʢΞϯνύλʔϯʣϓϩμΫτͷಛੑΛؑΈͳ ͍ըҰతʹ༻ҙ͞Εͨߏ͕ڧ੍͞Εͯ͠·͏
νʔϜɺ৫
νʔϜɺ৫ • ઐ৫ͷӡ༻ • ྲྀΕͷૣ͍ϑϩϯτΤϯυྖҬʹରԠ͢ΔͨΊʹ ͓͍ͬͯͨ΄͏͕͍͍͜ͱ • ྫ͑ઐ৫Λஔ͠ɺԣஅతʹؔΘΕΔΑ͏ʹ ͢ΔɺͳͲ •
͍ΘΏΔΠωʔϒϦϯάνʔϜͷΑ͏ͳӡ༻Λ ఆ
νʔϜɺ৫ • ୲ɺ৬είʔϓͷఆٛ • ϑϩϯτΤϯυΤϯδχΞίϛϡχέʔγϣϯͷϋϒʹͳΓ͍͢ • ҰํͰྡ৫ͷࣄ͞Ε͍͢ • ྫ) σΟϨΫγϣϯۀΛϑϩϯτΤϯυΤϯδχΞ͕ߦ͍ͬͯΔ
• ྫ) ϚʔέςΟϯά৫ଆͰඞཁͳGAͷௐࠪઃఆΛϑϩϯτΤϯ υΤϯδχΞ͕ߦ͍ͬͯΔͳͲ • ϝϯόʔ͕ຊདྷൃش͖͢όϦϡʔΛ્ͯ͠͠·͏Α͏ͳέʔε͕ ͳ͍Α͏ʹ͍ͨ͠
ྫ·ͩͳ͠ɾɾɾ Ӷҙ࡞தʂ
͜Μͳײ͡ͰӶҙ࡞தͰ͢
ࠓޙͳΜͱ͔͘Β͍ʹ ୈҰग़ͤΔΑ͏ʹ͠·͢
ͨͩ͜ͷج४͋͘·Ͱ ج४Ͱ͋ͬͯʮ͜Ε͕ୡͰ ͖͍ͯͳ͍͔Βବͳ։ൃʯ ͱ͍͏෩ʹଊ͑ͯ΄͘͠ͳ͍ Ͱ͢ɻ
ຊͷҙຯͰڧ͍৫ըҰ తʹج४ʹै͏৫Ͱͳ ͘ɺج४Λॊೈʹଊ͑ͯࣗ ͨͪʹΧελϚΠζͰ͖Δ ৫ͩͱࢥ͍ͬͯ·͢ɻ
͕ࣗݟ͖ͯͨ։ൃͷதͰ ࠔͬͯΔਓͨͪΛࠓޙগ͠Ͱ ॿ͚ʹͳΕͱࢥ͍·͢ɻ
ࠓޙ
ࣗͷ؍ଌൣғͰͲΜͲΜ ϦΞʔΩςΫτͳͲ͕ٻΊΒ Ε͍ͯΔ͕ɺਖ਼ͦ͜·Ͱຖ ճඞཁͳͷ͔ʁͱࢥͬͨΓ͠ ·͢ɻ
ϑϩϯτΤϯυͷϥΠϒϥϦ ϑϨʔϜϫʔΫͷߋ৽͕େ มͰɾɾɾ ͱ͍͏ͷΛΑ͘ฉ͖·͢ɻ
Xxx ͕Φϫίϯ͔ͩΒɺ৽͠ ͍yyyʹΖ͏ɻͰͳ͘ɺ ͦͦϦΞʔΩ͕ඞཁͳͷ ͔Λߟ͑ΒΕΔΑ͏ͳ৫ ϝϯόʔΛ࡞͍͖͍ͬͯͨͳ ͱࢥ͍ͬͯ·͢ɻ
ͦ͏͡Όͳ͍ͱ ϑϩϯτΤϯυ։ൃͦͷͷ ͕ࣗॏͰ௵ΕΔΜ͡Όͳ͍͔ ͱݒ೦͍ͯ͠·͢ɻ
৭ΜͳΞϓϩʔνΛऔͬͯগ ͠Ͱྑ͍͖͍ͯͨ͘͠ͱ ࢥ͍ͬͯ·͢ɻ
·ͱΊ
·ͱΊ • ৭Μͳ։ൃ৫Λݟ͖͕ͯͨɺ·ͩΓ͍ͨ͜ͱ͕Ͱ͖͍ͯΔͱ͍͏৫গͳ͍ • ͦͷݪҼ༷ʑ͕ͩɺϏδωεͱ։ൃͷ͋Δ͖࢟ͷΪϟοϓͰࠔ͍ͬͯΔΑ͏ʹ ݟ͑Δ • ͜ΜͳҰͭͷιϦϡʔγϣϯͰͳΜͱ͔͢ΔΑ͏ͳ͡Όͳ͍ • ϘτϜΞοϓʹϝϯόʔҰਓͻͱΓ͕͢Δํ๏ͱτοϓμϯʹͦͷํΛࣔ
͢ํ๏͕ඞཁ • τοϓμϯʹ͍ͬͯ͘ํ๏ͱͯ͠ϑϩϯτΤϯυ൛ͷDX CriteriaΛ࡞͍ͬͯΔ • ͍͔ͭ͘հͨ͠ͷͰɺؤுͬͯ͜Ε͔Βଓ͚͍͖ͯ·͢ɻϑΟʔυόοΫ͕͋ Εڭ͍͑ͯͩ͘͞