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
【コネヒトマルシェオンライン】Vue3触ってみた
Search
yamashooooo
October 20, 2020
0
290
【コネヒトマルシェオンライン】Vue3触ってみた
yamashooooo
October 20, 2020
Tweet
Share
More Decks by yamashooooo
See All by yamashooooo
【PIXIV MEETUP 2023】ピクシブ決済基盤のフロントエンドを改善していく話
yamam00s
0
860
【mediba #developers_community】フロントエンドの フレームワーク事情2022
yamam00s
0
87
【BIT VALLEY -INSIDE- Vol.17】自作キーボード入門した話
yamam00s
0
1.1k
【Roppongi.vue #3】ユーザー数1500万人のサービスにNuxtを導入して嬉しかったこと
yamam00s
1
820
Featured
See All Featured
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
7
600
GraphQLの誤解/rethinking-graphql
sonatard
68
10k
VelocityConf: Rendering Performance Case Studies
addyosmani
327
24k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
365
25k
Building a Scalable Design System with Sketch
lauravandoore
460
33k
Six Lessons from altMBA
skipperchong
27
3.6k
Making Projects Easy
brettharned
116
6k
Adopting Sorbet at Scale
ufuk
74
9.2k
The Invisible Side of Design
smashingmag
299
50k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Visualization
eitanlees
146
15k
For a Future-Friendly Web
brad_frost
176
9.5k
Transcript
Vue3৮ͬͯΈͨ ʲmedibaࣾ߹ಉษڧձʳ ίωώτϚϧγΣΦϯϥΠϯ
ࣗݾհ • Name: Shota Yamamoto • Twitter: @yamam00s • Company:
גࣜձࣾmedibaʢ2019/10 ೖࣾʣ • Team: ςΫϊϩδʔηϯλʔ Eng1G
auεϚʔτύεͷϑϩϯτࣄ • Nuxt.js • TypeScript • Vuex • Jest •
Storybook • etc…
ࠓճ৮ΕΔػೳ • CompositionAPI • Fragment • Suspense • v-model •
Teleport
Composition API
2.x·ͰͷOptions API
3.xͷ͔ΒͷComposition API
ϏδωεϩδοΫΛ ·ͱΊ͘͢ͳͬͨɻ Γग़͠Մೳɻ
None
MixinͰͰ͖ͨͷͰ🤔
Composition API vs Mixin Mixinͷා͍෦ • ໊લͷڝ߹࣌ͷڍಈ • ҉తͳґଘؔ •
ઇ่ࣜͳංେԽ
Mixin
Composition APIͰͷuseXXX
Fragment
2.x vs 3.x
ΧελϜίϯϙʔωϯτͷ ଐੑͷܧঝͲ͏ͳΔ͔
2.x vs 3.x
Suspense
ඇಉظͳίϯϙʔωϯτΛ TemplateͰ੍ޚͰ͖Δ
None
৽͍͠v-model
ΧελϜίϯϙʔωϯτͷ v-model͕ΑΓ͍͘͢ɺ ෳఆٛՄೳʹ
None
Teleport
ରͷηϨΫλʹૠೖ
·ͱΊ
ҰॹʹΩϟονΞοϓ ͍͖ͯ͠·͠ΐ͏ʂ
࠷ޙʹ medibaͰڞʹಇ͘ΤϯδχΞΛ ืू͍ͯ͠·͢ ͓͓ͪͯ͠Γ·͢ʂʂʂʂ
͋Γ͕ͱ͏͍͟͝·ͨ͠ 🙇