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
React使いがVueと仲良くなるためにやったこと
Search
texdeath
October 17, 2019
Programming
0
290
React使いがVueと仲良くなるためにやったこと
今までの業務でReactばかり書いてきた僕が新しい職場でNuxt・Vueを書くことになったので、触ってみた所感や新しいバージョンへの期待をまとめました。
texdeath
October 17, 2019
Tweet
Share
More Decks by texdeath
See All by texdeath
コードメトリクス計測による課題可視化と品質確保 / Visualize issues and ensure quality by measuring code metrics
texdeath
0
330
クライアントワークと管理画面の話
texdeath
0
220
次世代ヘッドレス開発室が提供するヘッドレスEC
texdeath
0
640
中期プロジェクトで e2eテストを導入してみて感じたこと
texdeath
2
7.8k
おさらいVue Composition API
texdeath
0
460
Optional Chainingについて
texdeath
3
180
副業として個人事業主をやる場合の メリット・デメリット
texdeath
0
110
Container Componentは必要なのか
texdeath
4
640
Kotlin/JSでReactアプリを作ってみた
texdeath
1
920
Other Decks in Programming
See All in Programming
DataformでPythonする / dataform-de-python
snhryt
0
150
実践!App Intents対応
yuukiw00w
1
140
Quality Gates in the Age of Agentic Coding
helmedeiros
PRO
1
120
それ CLI フレームワークがなくてもできるよ / Building CLI Tools Without Frameworks
orgachem
PRO
17
3.7k
Claude Code と OpenAI o3 で メタデータ情報を作る
laket
0
110
ZeroETLで始めるDynamoDBとS3の連携
afooooil
0
150
書き捨てではなく継続開発可能なコードをAIコーディングエージェントで書くために意識していること
shuyakinjo
0
200
MCPで実現できる、Webサービス利用体験について
syumai
7
2.4k
構文解析器入門
ydah
7
2k
「次に何を学べばいいか分からない」あなたへ──若手エンジニアのための学習地図
panda_program
3
710
No Install CMS戦略 〜 5年先を見据えたフロントエンド開発を考える / no_install_cms
rdlabo
0
430
What's new in Adaptive Android development
fornewid
0
130
Featured
See All Featured
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Side Projects
sachag
455
43k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Java REST API Framework Comparison - PWX 2021
mraible
32
8.8k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.6k
Rails Girls Zürich Keynote
gr2m
95
14k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
21
1.4k
Building Applications with DynamoDB
mza
95
6.5k
Docker and Python
trallard
45
3.5k
Transcript
3FBDU͍͕7VFͱ ྑ͘ͳΔͨΊʹͬͨ͜ͱ 1
๏ ాɹউॣ ๏ ϑϩϯτΤϯυΤϯδχΞ ๏ 3FBDU/PEF7VF /VYU ๏ 7VFྺϲ݄ͪΐ͍͘Β͍
๏ 5XJUUFS!UFYEFBUI 2
Agenda 1. なぜVueを書くことになったか 2. 仲良くなれそうなところ 3. つらいところ 4. Vue3.xへの期待 5.
まとめ 3
͜Ε·Ͱͷܦྺ • React/ReduxでSPA開発 • 業務の60%以上React/Reduxでのツール開発 • 残りは設計とか運用とか調査とか… • 結構何でもやってた 4
ͳͥVueΛॻ͘͜ͱʹͳ͔ͬͨ • 転職 • 何でも屋さんだったので、フロントエンド に集中したかった • フロントエンドやクリエイティブコーディ ングをやりたかった •
転職先ではVueも扱えないといけない 5
6 ษڧ։࢝
7 ษڧ࢝͠Ίͯ ͙͢ࢥͬͨ͜ͱ
8 ͱͱͷࢥ͕ҧ͏
ͦΕͧΕͷΠϝʔδͷҧ͍ͷཧղ͔Βೖͬͨ 9 ॊೈ HTMLΛ֦ு͢ΔΠϝʔδ ॳݟʹ༏͍͠ ݫ֨ JavaScriptΛ֦ு͢ΔΠϝʔδ ॳݟʹͱ͖ͬͭʹ͍͘
10 ࣮ࡍʹ৮ͬͯΈΔ
ͳΜͱͳ͘ͷॴײɿྑ͘ͳΕͦ͏ͳͱ͜Ζ • Scoped Styleが標準装備なのが良い • Reactだと何かライブラリ入れないと無理 • ドキュメントが超親切 • 他のフレームワークと比べても圧倒的に初
心者に優しい • ミドルウェア入れるの簡単 • Firebase認証とかも簡単に入れられて便利 11
ͳΜͱͳ͘ͷॴײɿͭΒ͔ͬͨͱ͜Ζ • 関数型に慣れてると辛い • TS入れるためにVue-Class-Componentを使っ ているが、そもそもClassでコンポーネント 書きたくない • <element></element> ←
<element />にしたい • JSXでも書けるらしいけど… 12
13 ৽͘͠Ճ͞ΕΔ ػೳΛΔ
৽͘͠Ճ͞ΕΔػೳΛΔ 14
15 Vue 3.xͷظ
Vue Composition APIʢVue3.x RFCʣ 16
setupؔ͑ؔܕͬΆ͘ॻ͚Δ 17 React Hooksʹࣅͯͯ͞Βʹྑ͘ͳΕͦ͏
18 ·ͱΊ
·ͱΊ •それぞれの思想の違いを理解することが大事 •Vueの公式ドキュメントがとても親切で好き •Vue Composition APIがすごく楽しみ 19