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
useSWRをuseContextの代わりに使ってみる試み
Search
Kanon
August 16, 2024
1
540
useSWRをuseContextの代わりに使ってみる試み
React Osaka Reboot
https://react-osaka.connpass.com/event/320355/
Kanon
August 16, 2024
Tweet
Share
More Decks by Kanon
See All by Kanon
統計データで2024年の クラウド・インフラ動向を眺める
ysknsid25
2
1k
GAS × Discord bot × Gemini で作ったさいきょーの情報収集ツール
ysknsid25
1
1.1k
テストコード品質を高めるためにMutation Testingライブラリ・Strykerを実戦導入してみた話
ysknsid25
8
3.3k
そうだ、神戸へ行こう
ysknsid25
2
15k
テストコードの品質を客観的な数値で担保しよう〜Mutation Testのすすめ〜
ysknsid25
12
4.8k
「ばん・さく・つき・たー!」にならないためにSHIROBAKOから 学んだこと
ysknsid25
4
1.2k
東遊園地近辺のおすすめランチ・カフェ
ysknsid25
4
16k
Featured
See All Featured
No one is an island. Learnings from fostering a developers community.
thoeni
19
3.1k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
45
2.3k
VelocityConf: Rendering Performance Case Studies
addyosmani
327
24k
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
Reflections from 52 weeks, 52 projects
jeffersonlam
348
20k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
3
340
Raft: Consensus for Rubyists
vanstee
137
6.7k
The Cost Of JavaScript in 2023
addyosmani
46
7.2k
How to Ace a Technical Interview
jacobian
276
23k
The Language of Interfaces
destraynor
155
24k
Building Better People: How to give real-time feedback that sticks.
wjessup
366
19k
Practical Orchestrator
shlominoach
186
10k
Transcript
useSWRをuseContextの代わりに 使ってみる試み Kanon (@samurai_se) #react_osaka 1
2 自己紹介 ↓詳しくは↓ • 本業はKtor(Kotlin), Next.jsで副業がLaravel, Nest.js,Next.js • Kobe.tsという勉強会を主催しています •
地方コミュニティが好き Kanon アニオタ声豚酒カスラーメンレンジャー 水瀬いのり無限恒久永遠推し samurai_se
きっかけ 3
クラスメソッドのReact事情大公開スペシャル #3 4
このスライド 5
6 わかるような…?
useSWRとは 7
Vercel社製のデータフェッチライブラリ 基本的な使い方 8
useContextとして使ってみる 9
更新を伴わないcontextとして使う 10
初期表示時 11
カウントアップすると…? 12
更新を伴うcontextとして使う 13
画面イメージ 14
カウントボタンを押す 15
おわりに • だいたいこういうイメージで使えば、多くの場面で useContextではなくswrでグローバルに値を共有できそ う • 直接ライブラリの導入を抑えたければ、useContextの 代わりにswrを使ってみてもよさそう • ただswrのキャッシュ管理に使われているのは
useContextなので、直接入れるか間接的に入れてるか の違い 16
17 📢 おわりに宣伝 🙏 オフラインLT会を 神戸で開催してます! TS+周辺技術 Figma、npmなどなど 範囲が広いので登壇しやすい!
18 ご清聴、あざざました