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
ProgressiveにVueを導入している話 / vue-progressive-integ...
Search
hivesbee
September 06, 2019
Programming
1
620
ProgressiveにVueを導入している話 / vue-progressive-integration
hivesbee
September 06, 2019
Tweet
Share
More Decks by hivesbee
See All by hivesbee
組織・プロセス・技術 フロントエンドの生産性向上への複眼的アプローチ
hivesbee
0
28
Design System Meets Vue.js
hivesbee
0
140
mabl を融和させるための取り組み in クラウドサイン / how-to-fusion-mabl-in-cloudsign
hivesbee
0
210
フロントエンドの組織について考える / think-about-front-end-organization
hivesbee
5
2.9k
ProgressiveにVueを導入している現場から送る小ネタ / vue-progressive-integration-tips-dialog
hivesbee
1
590
クラスへの割り込み処理とProxyとReflect / method-intercept-with-proxy-and-reflect
hivesbee
1
120
Other Decks in Programming
See All in Programming
スマホから Youtube Shortsを見られないようにする
lemolatoon
11
4.6k
CI_CD「健康診断」のススメ。現場でのボトルネック特定から、健康診断を通じた組織的な改善手法
teamlab
PRO
0
200
Catch Up: Go Style Guide Update
andpad
0
210
複雑化したリポジトリをなんとかした話 pipenvからuvによるモノレポ構成への移行
satoshi256kbyte
1
990
Go言語の特性を活かした公式MCP SDKの設計
hond0413
1
210
タスクの特性や不確実性に応じた最適な作業スタイルの選択(ペアプロ・モブプロ・ソロプロ)と実践 / Optimal Work Style Selection: Pair, Mob, or Solo Programming.
honyanya
3
160
Pull-Requestの内容を1クリックで動作確認可能にするワークフロー
natmark
2
480
デミカツ切り抜きで面倒くさいことはPythonにやらせよう
aokswork3
0
220
非同期jobをtransaction内で 呼ぶなよ!絶対に呼ぶなよ!
alstrocrack
0
620
Railsだからできる 例外業務に禍根を残さない 設定設計パターン
ei_ei_eiichi
0
420
クラシルを支える技術と組織
rakutek
0
200
「ちょっと古いから」って避けてた技術書、今だからこそ読もう
mottyzzz
10
6.4k
Featured
See All Featured
Building Better People: How to give real-time feedback that sticks.
wjessup
368
20k
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.6k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Thoughts on Productivity
jonyablonski
70
4.9k
Writing Fast Ruby
sferik
629
62k
Statistics for Hackers
jakevdp
799
220k
Agile that works and the tools we love
rasmusluckow
331
21k
Scaling GitHub
holman
463
140k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.7k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
Transcript
1SPHSFTTJWFʹ7VFΛ ಋೖ͍ͯ͠Δ 7TFOEBJ7VFKT/VYUKTNFFUVQ .BTBTIJ)BHBʢ!)JWFTCFFʣ
⾣6ODBVHIU3FGFSFODF&SSPS)BHBJTOPUEFpOFE .BTBTIJ)BHB (JUIVCIJWFTCFF 5XJUUFS!)JWFTCFFʢ;͕͊ʣ 'SPOUFOE&OHJOFFSBU$MPVE4JHO (SBEVBUFEઋిߴઐʢͩͬͨͱ͜Ζʣ ❤7VFKT K2VFSZ Έͣ͞Θʢલམ߹ʹ͋Γ·͢ʣ ɹ͜ͷલͷBZ$POGFSFODFͰதຊͷਓೝఆΛड͚Δ
ࠓճ͓͢Δ͜ͱ 1SPHSFTTJWFʹ 7VFΛಋೖ͍ͯ͠ΔݱͰͷ ಋೖઓུ࣮ࡍͷઃܭϓϥΫςΟεΛ Ίʹ͝հ
໔ࣄ߲ ॾઆ͋Γ·͢
None
ܖަব͕ࡁΜͩࡁͷܖॻΛΞοϓϩʔυ͠ɺ ૬खํ͕ঝೝ͢Δ͚ͩͰܖΛΉ͢Ϳ͜ͱ͕ग़དྷ·͢ɻ ॻྨͷड৴ऀΫϥυαΠϯʹొ͢Δඞཁ͕͋Γ·ͤΜɻ ܖక͔݁Βܖॻཧ·ͰՄೳͳ ΫϥυܕͷిࢠܖαʔϏε ܖަবࡁͷܖॻΛΞοϓϩʔυ͠ɺ૬खํ͕ঝೝ͢Δ͚ͩͰܖΛ݁Ϳ͜ͱ͕ग़དྷ·͢ɻ ॻྨͷड৴ऀΫϥυαΠϯʹొ͢Δඞཁ͕͋Γ·ͤΜɻ ΫϥυαΠϯͱʁ
ΫϥυαΠϯͱʁ ిࢠܖͳΒ εϐʔυΞοϓ҆શੑ࣮ݱͰ͖·͢ ܖక݁·Ͱͷ ϦʔυλΠϜͷॖ िؒ ࢴͷܖॻ ిࢠܖॻ ίϯϓϥΠΞϯεͱ
ηΩϡϦςΟڧԽ ϝʔϧɾυϝΠϯ࿈ಈͷຊਓೝূ ిࢠॺ໊ʴೝఆλΠϜελϯϓͰ ܖ࣌ͷશੑΛ୲อ ✔ ෦ ✔
ΫϥυαΠϯͱʁ
ΫϥυαΠϯͱʁ
͔͜͜Βຊ
എܠ ࠷ॳͷಓ͠Δͷͨͯํ 1SPHSFTTJWFʹ͢͢ΊΔͨΊͷઃܭϓϥΫςΟε
എܠ ೖࣾ࣌Ͱͷٕज़ελοΫʜʜ Πϯϑϥɿ"84 αʔόʔɿHP SFWFM ϑϩϯτʢ1$൛ʣɿK2VFSZ ϑϩϯτʢ41൛ʣɿK2VFSZ 7VFKTʢܥʣ ͱ͍͏͜ͱͰϑϩϯτͷओ࣠ HPͷςϯϓϨʔτΤϯδϯͱK2VFSZ
K2VFSZ͋Δ͋Δ ϏδωεϩδοΫͱ%0.͕ࠞࡏ ϑΝΠϧׂʹΑΔϞδϡʔϧԽΛߦ͍͕ͬͯͨɺ ΠϕϯτͷൃՐλΠϛϯάͳͲͳͲෳࡶੑ͕૿͖ͯͨ͠ ͦͷ··QVCMJTI͍ͯͨ͠ͷͰ ίϝϯτ͕ॻ͚ͳ͍ʢҙ֎ͱେࣄʣ 7VFKTΛຊ֨ಋೖ͢ΔྲྀΕʹ
8IZ7VFKTʁ ΨΠυϥΠϯΛͬ͟ͱݟ͍ͯͦ͢͏ KTY͕ͪΐͬͱͱ͖ͬͭͮΒͦ͏ 4'$ͱσβΠφʔͷੑ͕ߴ͍ ͋ͱ΄Μͷग़དྷ৺ʢॏཁʣ
എܠ ࠷ॳͷಓ͠Δͷͨͯํ 1SPHSFTTJWFʹ͢͢ΊΔͨΊͷઃܭϓϥΫςΟε
ʮ7VFKTೖΕ·͠ΐ͏ʂʯ ʜ Ͳ͏ͬͯʁ
େ͖ͳํͱͯ͠ʜʜ %SBTUJDʹม͍͑ͯ͘ ظܾઓܕ ͋ΔఔͷόάΛڐ༰͢Δඞཁ͋Γ Γ͖Δͱʮ͔͍͍ͬ͜ʯͬͯݴΘΕΔ 1SPHSFTTJWFʹม͍͑ͯ͘ ظઓܕ όά͍͑ͯ͘ ҋͱର͠ଓ͚͍ͯ͘ Γ͖Δͱʮ͓ർΕ͞·ʯͬͯݴΘΕΔ
࠷ॳͷಓ͠Δͷͨͯํ Ͳ͏அ͢Δ͔ʁ
࠷ॳͷಓ͠Δͷͨͯํ ϓϩμΫτͷಛੑͱ ։ൃ৫ͷ໘͔Β ߟ͑Δ
ϓϩμΫτͷಛੑ͔Βಓ͠ΔΛߟ͑Δ ΫϥυαΠϯʹిࢠܖͷαʔϏε ԾʹαʔϏε͕མͪΔͱʜʜ ͓٬͞·ͷܖ࡞ۀ͕Ͱ͖ͳ͍ˠ͓٬͞·ͷϏδωεʹӨڹେ ಛʹ݄݄ॳʹམͪͨΒக໋త ӨڹൣғΛڱ͘ɺΛى͜͞ͳ͍Α͏ʹ
։ൃ৫ͷ໘͔Βಓ͠ΔΛߟ͑Δ ࣌ɺ̍ਓͷϑϩϯτΤϯυΤϯδχΞ ࢥ͍͖ͬΓม͍͑ͯ͘ʹ ϑϩϯτͷϝϯόʔ͕Γͳ͍ ͦͷؾʹͳΕͰ͖͔ͨ͠Εͳ͍͕ ػೳՃͱ͜ͷ࡞ۀΛಉ࣌ʹ͢͢ΊΔ͜ͱʹͳΓ ऴᖼΛܴ͑Δʢࢲ͕ʣ ϝϯόʔΛ૿͍ͯ͘͜͠ͱؚΊɺಋೖܭըΛ͍ͨͯͯ͘
Ͱ͖͕͋ͬͨಓ͠Δ %SBTUJDʹม͍͑ͯ͘ 1SPHSFTTJWFʹม͍͑ͯ͘ ϝϯόʔͷ૿ՃܭըʹؚΊɺ1SPHSFTTJWFʹಋೖ͍ͯ͘͠
Ͱ͖͕͋ͬͨಓ͠Δ ελʔτ 7VFKTಋೖ։࢝ ΰʔϧ 7VFKTͰϑϧϦϓϨʔε ը໘ͷҰ෦Ͱ 7VFKTಋೖ ϝϯόʔΛ ૿͍ͯ͘͠ 7VFKT
ಋೖൣғͷ֦େ ͷৡ ʢϧʔςΟϯάɺεςʔτཧʣ
ಓ͠Δ͕Ͱ͖Δͱ ࣗવͱઃܭ͕Έ্͕Δ
ࠓͷϑϩϯτΤϯυઃܭ (P SFWFM 1BHF"WVF 1BHF#WVF 1BHF$WVF 8FCQBDL ࢠ ࢠ ࢠ
ࢠ ࢠ ࢠ ϧʔςΟϯάαʔόʔଆͷ·· SFWFMͰग़ྗ͞ΕͨIUNMʹ7VFKTΛ͍͋ͯͯ͘
ࠓͷϑϩϯτΤϯυઃܭʢൈਮʣ ϚϧνϖʔδΞϓϦέʔγϣϯ ϧʔςΟϯάݱߦͷ··ɺ7VFSPVUFSར༻͠ͳ͍ ϖʔδΤϯτϦϙΠϯτ 8FCQBDL͏ʢίϝϯτॻ͖͍ͨΠϯϙʔτ͍ͨ͠ʣ 7VFYجຊΘͳ͍
ࠓͷϑϩϯτΤϯυઃܭʢײʣ ͜͏ͬͯݟΔͱϞμϯͳΠέΠέͳϑϩϯτͱ͍͑ͳ͍ ݱঢ়Λཧղ্ͨ͠Ͱ࠷దղΛऔΔͨΊʹ ͋͑ͯΘͳ͍ɺͱ͍͏ͷେ͍ʹΞϦʢͩͱࢥ͏ʣ ΠέΠέͳͷͷ༠ʹෛ͚ͣɺಓʹ͢͢ΊΔ ڧ͍৺͕ཁ݅ͱͯ͠ඞཁ
എܠ ࠷ॳͷಓ͠Δͷͨͯํ 1SPHSFTTJWFʹ͢͢ΊΔͨΊͷઃܭϓϥΫςΟε
1SPHSFTTJWFʹ͢͢ΊΔͨΊͷઃܭϓϥΫςΟε Ϛϯτ͢Δίϯϙʔωϯτͷཻ ࢠίϯϙʔωϯτͷཻ
ͦͷ̍ɿϚϯτ͢Δίϯϙʔωϯτͷཻ (P SFWFM 1BHF"WVF 1BHF#WVF 1BHF$WVF 8FCQBDL ࢠ ࢠ ࢠ
ࢠ ࢠ ࢠ ͜͜ͷʜʜ
ͦͷ̍ɿϚϯτ͢Δίϯϙʔωϯτͷཻ (P SFWFM 1BHF"WVF 1BHF#WVF 1BHF$WVF 8FCQBDL ࢠ ࢠ ࢠ
ࢠ ࢠ ࢠ ͜͜ʂ
ͦͷ̍ɿϚϯτ͢Δίϯϙʔωϯτͷཻ ϏδωεϩδοΫͱͯ͠ΓཱͭϨϕϧͷେ͖͞ͰϚϯτ ը໘ͷݕࡧ෦ɺμΠΞϩάɺFUDʜʜ "UPNJD%FTJHOͰ͍͏ͱ͜Ζͷ0SHBOJTNT͘Β͍ Ұ൪লΤωˍΛہॴԽͰ͖Δ
ͦͷ̍ɿϚϯτ͢Δίϯϙʔωϯτͷཻ লΤωɺͱʁ ˠίϯϙʔωϯτཻͷ࠷େɾ࠷খέʔεͰͦΕͧΕߟ͑Δ ."9ɿը໘શମʹϚϯτ ୯७ʹ࿑ྗ͕͔͔Δ IUNMςϯϓϨʔτʹग़ྗ͞Ε͍ͯΔσʔλͷ࠶ݱͱ͔ඞཁ ༨ܭͳͷ·ͰखΛண͚ͨ͘ͳ͍
ͦͷ̍ɿϚϯτ͢Δίϯϙʔωϯτͷཻ .*/ɿখ͞ͳίϯϙʔωϯτ͝ͱʹϚϯτ ίϯϙʔωϯτͷIUNMςϯϓϨʔτσʔλͷྲྀ͠ࠐΈΛͭͭ͠ɺ ίϯϙʔωϯτͷ֎ͰϏδωεϩδοΫΛऔΓѻ͏͜ͱʹ ṖϞδϡʔϧര $PNQPOFOU $PNQPOFOU Ṗ IUNM
ͩͬͨΒίϯϙʔωϯτʹऔΓࠐΜͩ΄͏ָ͕
ͦͷ̍ɿϚϯτ͢Δίϯϙʔωϯτͷཻ ΛہॴԽͰ͖Δɺͱʁ ʢى͖͍͚ͯͳ͍͜ͱ͚ͩͲʣ ϖʔδʹԿ͔͠Βόάͬͨ߹ɺ ϏδωεϩδοΫ͝ͱམͪΔͷͰը໘ͷଞͷՕॴʹӨڹΛٴ ΅͞ͳ͍
ͦͷ̍ɿϚϯτ͢Δίϯϙʔωϯτͷཻ ؙͷͱ͜Ζʹ7VFKTΛϚϯτ Ծʹίί͕όάͬͯϖʔδͷதͷ ଞͷػೳ͕མͪͳ͍ͷͰ͋ΔఔӨڹΛہॴԽͰ͖Δ Ѽઌ Ѽઌ̍ ϑΝΠϧ໊
ͦͷ̎ɿࢠίϯϙʔωϯτͷཻʹ͍ͭͯ (P SFWFM 1BHF"WVF 1BHF#WVF 1BHF$WVF 8FCQBDL ࢠ ࢠ ࢠ
ࢠ ࢠ ࢠ ͜͜ͷʜʜ
ͦͷ̎ɿࢠίϯϙʔωϯτͷཻʹ͍ͭͯ (P SFWFM 1BHF"WVF 1BHF#WVF 1BHF$WVF 8FCQBDL ࢠ ࢠ ࢠ
ࢠ ࢠ ࢠ ͜͜ʂ
ͦͷ̎ɿࢠίϯϙʔωϯτͷཻʹ͍ͭͯ ڞ௨Խ͠ͳ͍ʢڧ͍৺Λͭʣ 'BU$PNQPOFOUΛڐ༰͢Δ
ͦͷ̎ɿࢠίϯϙʔωϯτͷཻʹ͍ͭͯ ࠓͷઃܭը໘ͷҰ෦ʹ7VFKTΛϚϯτ ෦࠷దͷͷ͕ग़དྷ্͕ͬͯ͠·͏ݒ೦ औΓճ͍͢͠͠ίϯϙʔωϯτΛ࡞ΔͨΊʹ w ϖʔδ͝ͱʹίϯϙʔωϯτ͕ग़ἧͬͨλΠϛϯάͰΔ ˞ίϯϙʔωϯτͰऩ·ΔΑ͏ͳϨϕϧͰͩͬͨΒղͯ͠0, w ·ͨΨνͬͯڞ௨Խ࡞ۀΛߦ͏ඞཁ͋Γ ͦͷͨΊʹҰ࣌తͳ'BU$PNQPOFOUڐ༰͞ΕΔ͖
΄͔ʹ΄͔ʹ [JOEFYʹෛ͚ͳ͍μΠΞϩάͮ͘Γͩͱ͔ ˠͪ͜ΒલճͷࢿྉΛ͝ཡ͍ͩ͆͘͞ $44ͷઃܭͬͨΓͱ͔ ☝ίίΒΜؚΊͯ࠙ձͰ͝ҙݟͱ͔͍͚ͨͩΕ
·ͱΊ
·ͱΊ ͦͷ໊ͷ௨Γ7VFKT1SPHSFTTJWFʹಋೖͰ͖Δ ಓ͠Δͷͨͯํ͕େࣄ ϞμϯͳΠέΠέͳϓϥΫςΟεʹखΛ৳͢ͱ ͦͷཌྷΛম͔ΕΔ͜ͱʹͳΔͷͰؾΛ͚ͭͯ ཧղ্ͨ͠Ͱ͍͍ͱ͜ͲΓͰ͖ΔΑ͏ʹ͍ͬͯ͜͏
ͦ͏͍͑ʜʜ
ͦ͏͍͑ʜʜ
8FBSF)JSJOH
͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ Χϓʔʂ