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
4.8k
フロントエンドのDXと今後
2023/6/15 に発表したフロントエンドのDXと今後についての発表です。
Yosuke Furukawa
PRO
June 15, 2023
Tweet
Share
More Decks by Yosuke Furukawa
See All by Yosuke Furukawa
tc39 x jsconf.jp Panel Discussion 2024
yosuke_furukawa
PRO
0
150
Removing Corepack
yosuke_furukawa
PRO
9
1.3k
JavaScript Runtime とはなにか
yosuke_furukawa
PRO
15
2.5k
Strip Types と Storage
yosuke_furukawa
PRO
4
340
Module Harmony について
yosuke_furukawa
PRO
3
1.5k
LTのやり方
yosuke_furukawa
PRO
16
2.2k
AppRouter Panel Talk
yosuke_furukawa
PRO
3
700
Node.js v22 で変わること
yosuke_furukawa
PRO
13
5.3k
リアーキテクトと開発生産性について
yosuke_furukawa
PRO
25
9.6k
Other Decks in Programming
See All in Programming
Jakarta EE meets AI
ivargrimstad
0
600
AI時代におけるSRE、 あるいはエンジニアの生存戦略
pyama86
6
1.1k
レガシーシステムにどう立ち向かうか 複雑さと理想と現実/vs-legacy
suzukihoge
14
2.2k
Duckdb-Wasmでローカルダッシュボードを作ってみた
nkforwork
0
120
Nurturing OpenJDK distribution: Eclipse Temurin Success History and plan
ivargrimstad
0
880
Why Jakarta EE Matters to Spring - and Vice Versa
ivargrimstad
0
1.1k
Snowflake x dbtで作るセキュアでアジャイルなデータ基盤
tsoshiro
2
520
광고 소재 심사 과정에 AI를 도입하여 광고 서비스 생산성 향상시키기
kakao
PRO
0
170
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
1
100
Better Code Design in PHP
afilina
PRO
0
120
NSOutlineView何もわからん:( 前編 / I Don't Understand About NSOutlineView :( Pt. 1
usagimaru
0
330
Content Security Policy入門 セキュリティ設定と 違反レポートのはじめ方 / Introduction to Content Security Policy Getting Started with Security Configuration and Violation Reporting
uskey512
1
530
Featured
See All Featured
Building an army of robots
kneath
302
43k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
26
1.4k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
860
ReactJS: Keep Simple. Everything can be a component!
pedronauck
665
120k
We Have a Design System, Now What?
morganepeng
50
7.2k
The Cult of Friendly URLs
andyhume
78
6k
Fontdeck: Realign not Redesign
paulrobertlloyd
82
5.2k
[RailsConf 2023] Rails as a piece of cake
palkan
52
4.9k
Bash Introduction
62gerente
608
210k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.3k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
1.9k
BBQ
matthewcrist
85
9.3k
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Λ࡞͍ͬͯΔ • ͍͔ͭ͘հͨ͠ͷͰɺؤுͬͯ͜Ε͔Βଓ͚͍͖ͯ·͢ɻϑΟʔυόοΫ͕͋ Εڭ͍͑ͯͩ͘͞