React使いがVueと仲良くなるためにやったこと

今までの業務でReactばかり書いてきた僕が新しい職場でNuxt・Vueを書くことになったので、触ってみた所感や新しいバージョンへの期待をまとめました。

Transcript

1. 3FBDU࢖͍͕7VFͱ
   ஥ྑ͘ͳΔͨΊʹ΍ͬͨ͜ͱ 1
2. ๏ ৿ాɹউॣ
   ๏ ϑϩϯτΤϯυΤϯδχΞ
   ๏ 3FBDU/PEF7VF /VYU
   ๏ 7VFྺ͸ϲ݄ͪΐ͍͘Β͍
   ๏ 5XJUUFS
   !UFYEFBUI 2
3. Agenda 1. なぜVueを書くことになったか 2. 仲良くなれそうなところ 3. つらいところ 4. Vue3.xへの期待 5. まとめ 3
4. ͜Ε·Ͱͷܦྺ • React/ReduxでSPA開発 • 業務の60％以上React/Reduxでのツール開発 • 残りは設計とか運用とか調査とか… • 結構何でもやってた 4
5. ͳͥVueΛॻ͘͜ͱʹͳ͔ͬͨ • 転職 • 何でも屋さんだったので、フロントエンド に集中したかった • フロントエンドやクリエイティブコーディ ングをやりたかった • 転職先ではVueも扱えないといけない 5
6. 6 ษڧ։࢝
7. 7 ษڧ࢝͠Ίͯ ͙͢ࢥͬͨ͜ͱ
8. 8 ΋ͱ΋ͱͷࢥ૝͕ҧ͏
9. ͦΕͧΕͷΠϝʔδͷҧ͍ͷཧղ͔Βೖͬͨ 9 ॊೈ HTMLΛ֦ு͢ΔΠϝʔδ ॳݟʹ༏͍͠ ݫ֨ JavaScriptΛ֦ு͢ΔΠϝʔδ ॳݟʹͱ͖ͬͭʹ͍͘
10. 10 ࣮ࡍʹ৮ͬͯΈΔ
11. ͳΜͱͳ͘ͷॴײɿ஥ྑ͘ͳΕͦ͏ͳͱ͜Ζ • Scoped Styleが標準装備なのが良い • Reactだと何かライブラリ入れないと無理 • ドキュメントが超親切 • 他のフレームワークと比べても圧倒的に初 心者に優しい • ミドルウェア入れるの簡単 • Firebase認証とかも簡単に入れられて便利 11
12. ͳΜͱͳ͘ͷॴײɿͭΒ͔ͬͨͱ͜Ζ • 関数型に慣れてると辛い • TS入れるためにVue-Class-Componentを使っ ているが、そもそもClassでコンポーネント 書きたくない • <element></element> ← <element />にしたい • JSXでも書けるらしいけど… 12
13. 13 ৽͘͠௥Ճ͞ΕΔ ػೳΛ஌Δ
14. ৽͘͠௥Ճ͞ΕΔػೳΛ஌Δ 14
15. 15 Vue 3.x΁ͷظ଴
16. Vue Composition APIʢVue3.x RFCʣ 16
17. setupؔ਺࢖͑͹ؔ਺ܕͬΆ͘ॻ͚Δ 17 React Hooksʹࣅͯͯ͞Βʹ஥ྑ͘ͳΕͦ͏
18. 18 ·ͱΊ
19. ·ͱΊ •それぞれの思想の違いを理解することが大事 •Vueの公式ドキュメントがとても親切で好き •Vue Composition APIがすごく楽しみ 19