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
エンジニアとQAでコラボするフロントエンドリアーキテクチャ開発の事例
Search
Nokogiri
October 31, 2023
Technology
3.2k
4
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
エンジニアとQAでコラボするフロントエンドリアーキテクチャ開発の事例
Nokogiri
October 31, 2023
More Decks by Nokogiri
See All by Nokogiri
Zustandを用いた実践的状態管理
undefined_name
3
890
React Testing Libraryでの WAI-ARIAロールの活用事例
undefined_name
1
220
自動テストは何の役に立つのか そして役に立たないのか
undefined_name
5
1.8k
Pipe Operator (|>) の紹介
undefined_name
2
400
FizzBuzzで学ぶOCP
undefined_name
0
160
オブジェクト指向のプラクティスをフロントエンドで活用する
undefined_name
7
1.8k
モププロ@kintone開発チーム
undefined_name
1
660
勉強会で登壇者に 質問しづらい課題を解決する サービスをリリースしました🎉
undefined_name
2
1.3k
Usefull GitLens
undefined_name
3
910
Other Decks in Technology
See All in Technology
シンガポールで登壇してきます
yama3133
0
120
世界、断片、モデル。そして理解
ardbeg1958
1
110
DMM.com 購入改善推進チーム におけるCodeRabbitを用いた レビューフロー改善の一例
ysknsid25
2
620
Making sense of Google’s agentic dev tools
glaforge
1
200
完全自律ロボットを作りたくて、先に開発を自律させた話(ROS Japan UG #63 LT)
rryz09
0
510
Oracle Exadata Database Service on Cloud@Customer X11M (ExaDB-C@C) サービス概要
oracle4engineer
PRO
2
8.4k
Mastraエージェント、どのクラウドにデプロイする?
minorun365
PRO
2
180
事業価値を⽣み出すSREへ SREが担うべき意思決定の5層
kenta_hi
2
3.6k
AI Agent SaaS を支える自社仮想化基盤への挑戦と実運用 / ai-agent-saas-virtualization
flatt_security
2
3.8k
Compose 新機能総まとめ / What's New in Jetpack Compose
yanzm
0
170
ADDF - ループエンジニアリングするフレームワークを作ったら/I Didn't Set Out to Build Loop Engineering, But ADDF Did
fruitriin
0
120
Empower GenAI with Agile - あなたのアジャイルが生成AIのバフになる仕組み
hageyahhoo
1
180
Featured
See All Featured
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
marcoroth
2
320
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
220
Unsuck your backbone
ammeep
672
58k
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.4k
Technical Leadership for Architectural Decision Making
baasie
3
440
How to build an LLM SEO readiness audit: a practical framework
nmsamuel
1
800
Ten Tips & Tricks for a 🌱 transition
stuffmc
0
150
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
340
Principles of Awesome APIs and How to Build Them.
keavy
128
18k
Embracing the Ebb and Flow
colly
88
5.1k
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
760
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
Transcript
ΤϯδχΞͱ2"ͰίϥϘ͢Δ ϑϩϯτΤϯυϦΞʔΩςΫνϟͷ։ൃࣄྫ #"3ϑϩϯτ͑ΜͲ͏ʮϑϩϯτΤϯυϦΞʔΩςΫτʯ /PLPHJSJ !OLHSOLHS ϑϩϯτΤϯυΤϯδχΞ!DZCP[V
/PLPHJSJ !OLHSOLHS w αΠϘζגࣜձࣾcϑϩϯτΤϯυΤϯδχΞ w ೖࣾɻLJOUPOFͷ৽نػೳ։ൃνʔϜΛܦ ͔ͯΒLJOUPOFͷϑϩϯτΤϯυͷج൫ ৽ϓϩδΣΫτʢϑϩϦΞʣͷ্ཱͪ͛ظ͔Βࢀ ըɻݱࡏϓϩδΣΫτΛਪਐཱ w
ϙέϞϯରઓΨνʢϙέιϧͷμϝܭࢉπʔϧͷ։ൃʣɺೋࣇͷ
LJOUPOFʹ͍ͭͯ w ۀγεςϜΛࣗ༝ʹ࡞ΕΔΫϥυϓϥοτ ϑΥʔϜ w ϦϦʔεͯ͠ w άϩʔόϧల։த w ϓϥάΠϯͳͲΛ࡞͢Δύʔτφʔձ͕ࣾଟ
ଘࡏ
ࠓͷΰʔϧ w ϑϩϦΞͷ׆ಈʹ͍ͭͯ w ΤϯδχΞͱ2"ಉ͡νʔϜͰ։ൃͰ͖Δ w ৬ೳͰઢΛҾ͔ͣʹาΈدΓͳ͕Β։ൃͰ͖Δ ҎԼʹ͍ͭͯͬͯΒ͑Δ
ͳ͢͜ͱ w LJOUPOFͷϑϩϯτΤϯυϦΞʔΩςΫτϓϩδΣ ΫτʢϑϩϦΞʣͱ w ։ൃͷྲྀΕ w ΤϯδχΞ㱻2"ͷίϥϘϨʔγϣϯࣄྫ w ৬ೳΛލ͍ͩίϥϘϨʔγϣϯͷͨΊʹ
ϑϩϦΞͱ
ϑϩϦΞͱ w LJOUPOFͷϑϩϯτΤϯυΛϦΞʔΩςΫτ͢ΔϓϩδΣΫτ w LJOUPOFͷϑϩϯτΤϯυ$MPTVSF5PPMTͱ͍͏ϥΠϒϥϦͰॻ͔Ε ͓ͯΓɺ͜ΕΛ3FBDUʹஔ͖͍͑ͯ͘ w ͨͩͷϦϥΠτͰͳ͘ɺܧଓతʹLJOUPOFͷϑϩϯτΤϯυͷվળ ͕Ͱ͖ΔΑ͏ͳج൫࡞ΓؚΊͯߦ͏
ϓϩδΣΫτͷΰʔϧ w ʮLJOUPOFશͯͷϖʔδ͕3FBDUʹΑͬͯදࣔ͞Ε͍ͯΔʯ w ʮϑϩϯτΤϯυ͕ػೳίϯϙʔωϯτ୯ҐͰׂ͞ΕɺͦΕΛ ཧ͢Δ֤νʔϜ͕ಠཱͯ͠ϥΠϒϥϦߋ৽ٕज़બఆΛߦ͑Δঢ়ଶʹ ͳ͍ͬͯΔʯ w ʮఆৗతͳϢʔβʔମݧʹؔ͢Δࢦඪʢ8FCύϑΥʔϚϯεɺΞΫ ηγϏϦςΟͳͲʣͷܭଌ͕ߦΘΕɺνʔϜͷؔ৺ࣄʹͳ͍ͬͯΔʯ
࣮ࡍʹ৽͍ͯ͠Δը໘ͷྫ
ओͳϝϯόʔͱ৬ೳ w ϓϩμΫτΦʔφʔɺΤϯδχΞɺ2"ɺεΫϥϜϚελʔ͕̍νʔϜ ʹॴଐ͠։ൃΛ͍ͯ͠Δ w σβΠφʔɺBZΤΩεύʔτɺϩʔΧϥΠζ୲ͳͲνʔϜ֎Ͱ దٓίϛϡχέʔγϣϯΛͱΓͳ͕Β։ൃ͍ͯ͠Δ w ͦΕͧΕͷओͳׂ͋Δ͕ɺ৬ೳΛΫϩεΦʔόʔ͠ͳ͕Β৽Λ ਐΊ͍ͯΔ
αΠϘζͷ2"ͬͯͲΜͳࣄʁ w ϓϩμΫτͷ࣭ʹΛ࣋ͭϩʔϧ w ։ൃ͞Εͨػೳʹ͍ͨͯ͠ͲͷΑ͏ͳςετ͕ඞཁ͔ܭը w ςετΛ࣮ࢪ͢Δ w ࣗಈςετΛॻ͘ϝϯόʔ͍Δ w
ಛʹϑϩϯτΤϯυͷ2"ϝϯόʔϚεૢ࡞ͳͲ͚ͩͰͳ͘Ωʔ Ϙʔυૢ࡞ͳͲBZपΓͷࢼݧΛߦ͏͜ͱ͋Δ
։ൃͷྲྀΕ
৽ͷखॱ w ը໘ػೳ୯ҐͰͷ৽ͯ͠ϦϦʔε w جຊతʹطଘͷ༷࠶ݱ͢ΔΑ͏ʹॻ͖͑Λߦ͏ɻ w શʹݱߦػೳอূ͢ΔΘ͚Ͱͳ͍ w σβΠϯ৽ͱηοτͰϦϦʔε͢Δ͜ͱ͋Γ·͢ ৽ػೳ։ൃͱલఏ͕গ͠ҟͳΔ
εϓϦϯτͷྲྀΕ w ࣮͖͢ػೳͷચ͍ग़͠ w ࢼݧ؍ͷચ͍ग़͠ w εϓϦϯτܭը w ࣮ ςετʢࣗಈɾखಈʣ
w 13Ϛʔδ
ΤϯδχΞ㱻2"ͷ ίϥϘϨʔγϣϯࣄྫ
࣮͖͢ػೳͷચ͍ग़͠ w ΤϯδχΞͱ2"Ͱ༷ॻɺڍಈΛ֬ೝ͠ͳ͕Β࡞Δ͖ػೳΛચ ͍ग़͢ w 2"طଘ༷ͷཧղ͕ਂ͍ͷͰʮ࣮༷ॻʹ͔͔Ε͍ͯͳ͍ ػೳ͕͋Δʯʮ͜͜ෆ۩߹͕͋ΔʯͳͲॿݴΛ͢Δͱ͕Ͱ͖Δ w طଘ༷Λ࠶ݱ͢ΔϓϩδΣΫτ͔ͩΒͦ͜2"ͷݟ͕༗༻ w
ΤϯδχΞطଘͷίʔυΛݟͯΑΓৄࡉͳৼΔ͍Λ֬ೝͰ͖ Δ
2"ͱΤϯδχΞͰ૬ஊ͠ͳ͕Β࡞͍ͬͯ͘
ࢼݧ؍ͷચ͍ग़͠ w ओʹ2"͕։ൃ͢Δػೳʹରͯ͠ඞཁͳࢼݧͷચ͍ग़͠Λߦ͏ w ΤϯδχΞࢹͰಛʹ࣮໘͔ΒؾʹͳΔͱ͜ΖͳͲΛ͑Δ w ΤϯδχΞͱ2"Ͱ૬ஊ͠ͳ͕Βςετͷ࣮ࢪํ๏ΛܾΊ͍ͯ͘
ςετͷ࣮ࢪํ๏ આ໌ ิ Ϣχοτ KFTUΛͬͨςετ ؔͷ*Oͱ0VUΛݕࠪ͢Δ ΤϯδχΞ͕ཧɺ2"ཧ͠ͳ ͍ ΠϯςάϨʔγϣϯ 3FBDU5FTUJOH-JCSBSZΛͬͨςετ
ը໘ػೳ୯ҐͷৼΔ͍Λݕࠪ͢Δ ϒϥβςετ 4UPSZCPPLͱQMBZXSJHIUΛͬͨςετ ओʹυϥοάΞϯυυϩοϓ͕ൃੜ͢ΔৼΔ͍Λݕࠪ͢Δ 735 4UPSZCPPLͱ$ISPNBUJDΛͬͨςετ ϥΠϒϥϦΞοϓσʔτͳͲͰఆ֎ͷݟͨͷ͕ࠩͳ͍͜ͱΛݕࠪ͢Δ && 4FMFOJVNΛͬͨςετ αʔόʔαΠυͱͷ݁߹෦Λݕࠪ͢Δ جຊతʹϋοϐʔύεͰ̍ը໘ έʔε खಈ ্هςετͰ୲อͮ͠Β͍Օॴɺ2"ͷܦݧ্ո͍͠ͱ͜ΖͳͲΛݟΔͨ ΊͷςετɻΫϩεϒϥβςετͳͲ
࣮ࡍͷςετͱछྨͷ͚۠
εϓϦϯτܭը w εϓϦϯτΛΤϯδχΞͱ2"ͰͲ͏ա͔͋͢͝Δఔܭը͢Δ w ܭըʹແཧ͕ͳ͍͔ॱௐ͔ͳͲΛேձͰνΣοΫ͢Δ
εϓϦϯτܭըͷྫ
࣮ ςετʢࣗಈɾखಈʣ w ࣮ΤϯδχΞͰߦ͍ɺίʔυϨϏϡʔɺςετࣗಈԽ·Ͱྃ͠ ͨΒ2"ʹखಈࢼݧΛґཔ͢Δ w ରԠ͢ΔػೳʹΑͬͯΤϯδχΞ͕ಈ࡞֬ೝͷΈͰ0,ͱ͢Δ͋ Δ w 2"ͷखಈࢼݧ͕ؒʹ߹Θͳ͍߹ΤϯδχΞ͕ख͏͜ͱ͋Δ
࣮ ςετʢࣗಈɾखಈʣ w 2"͕ࣗಈࢼݧͷίʔυΛϨϏϡʔ͢Δ͜ͱ͋Δ w ͦͷͨΊʹࣗಈࢼݧͷίʔυʹࢼݧखॱΛίϝϯτͱͯ͠هड़͢Δ ͜ͱ͋Δ w 2"͕ςετࣗಈԽʹνϟϨϯδ͢Δ͜ͱ͋ΓɺΤϯδχΞ͕ςε τͷܗ.PDLͷΈΛ࡞ͯ͠2"͕ςετΛॻ͘͜ͱ͋Δ
2"ͱΤϯδχΞͰ͓ޓ͍ʹͰ͖Δ͜ͱΛ૿͍ͯ͘͠
৬ೳΛލ͍ͩ ίϥϘϨʔγϣϯͷͨΊʹ
৬ೳΛ͑ͯίϥϘ͢ΔͨΊʹͰ͖Δ͜ͱ w ڞ௨ͷνʔϜͷඪΛઃఆ͢Δ w εϓϦϯτͷྃ݅ʹࢼݧྃΛೖΕΔ w ϓϩδΣΫτͷඪɺΫΦʔλʔͷඪɺεϓϦϯτͷඪ w ීஈ͔Βίϛϡχέʔγϣϯ͕औΕΔؔੑΛ࡞Δ w
ຖேձͰձ͢Δ w ཧతʹձͬͯؔੑΛߏங͢Δ
৬ೳΛ͑ͯίϥϘ͢ΔͨΊʹͰ͖Δ͜ͱ w ৬ೳͰࣄΛ۠Β͓ͣޓ͍ͷࣄΛͬͯΈΔ w ΤϯδχΞ͕ࢼݧઃܭɺ2"͕ςετࣗಈԽͳͲ w ڞ௨ͷඪୡͷͨΊʹྖҬΛΫϩεΦʔόʔ͍ͯ͘͠
None
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ 8&"3&)*3*/(