Reactのさまざまなデータフェッチ方法を比較して理解して正しく使用する - SWR・TanStack Query編
「Reactのさまざまなデータフェッチ方法を比較して理解して正しく使用する」シリーズの2記事目です。今回は「SWR・TanStack Queryを用いたデータフェッチ」について理解していきます。 イントロ+useEffectを用いたデータフェッチ SWR・TanStack Queryを用いたデータフェッチ ← 👀この記事 Pages Routerでのデータフェッチ+App Routerでのデータフェッチ+まとめ Repository 以下は今シリーズで用いたリポジトリです。 🔽クライアントサイドフェッチの調査に用いたリポジトリ：React+Vite（useEffect, SWR・TanStack Query） 🔽サーバーサイドフェッチの調査に用いたリポジトリ：Next.js Pages Router, App Router SWRを用いたクライアントサイドフェッチ SWRを用いてデー
Reactのさまざまなデータフェッチ方法を比較して理解して正しく使用する - useEffect編
昨今のReact・Next.js界隈では様々なデータフェッチの仕組みが提供されていますが、一体どのような場面でどのデータフェッチ方法を使用したらベストなのでしょうか？ 開発のためにたくさんの選択肢が出てきた今、きちんとそれぞれの特長を知って正しく適当に使ってあげたいものですね🌟 そこで、 ☝🏻CSRで基本的な「クライアントサイドデータフェッチ」として useEffect hooksを用いたデータフェッチ ✌🏻「クライアントサイドデータフェッチ」に加えて「クライアントサイドキャッシュの仕組みを利用して状態管理ができる」ことで有名なデータフェッチライブラリのSWR, TanStack Query 🤟🏻「サーバサイドデータフェッチ」として(1)Next.jsでのgetServerSidePropsを利用したデータフェッチ・(2)App Router組み込みのキャッシュ機構とRSCを用い
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
