Hatena Blog Tags
はてなブログ トップ
React Query
このタグでブログを書く

React Query

このタグの解説についてこの解説文は、すでに終了したサービス「はてなキーワード」内で有志のユーザーが作成・編集した内容に基づいています。その正確性や網羅性をはてなが保証するものではありません。問題のある記述を発見した場合には、お問い合わせフォームよりご連絡ください。
Web開発における知見共有系ページ•1年前

ReactのTQueryKeyを使用してクエリの結果をキャッシュ化

ReactのTQueryKeyとは TQueryKeyを使用してキャッシュ化された場合、同じAPIは再度実行されることはない ReactのTQueryKeyとは TQueryKey は、React Query というライブラリで使用される型です。 React Query は、サーバーの状態管理を簡素化するための強力なツールです。 TQueryKey は、キャッシュを識別するためのキーを表す型であり、クエリを一意に識別するために使用されます。通常、TQueryKey は次のような形式をとります： string number Array カスタムオブジェクト このキーは、クエリキャッシュを管理し、…

#React Query#TQueryKey#キャッシュ#クエリキャッシュ

ネットで話題

もっと見る
446ブックマークNext.js + Prisma + NextAuth.js + React Query で作るフルスタックアプリケーションの新時代どうも、@yuyaaar です。 最近は Next.js アプリを見ることが多くなってきました。もはや JAM スタックの王道、と言っても過言ではないかもしれません。 ですが、やっぱりフルスタックとなると、データベースや認証などが必要になってきて、その辺のやり方がいまいちよくわからない、という人も多いのではないでしょうか...yuyao.me
193ブックマーク2022年Reactを使ってる人には必ず知っていてほしい最強のdata fetchingライブラリであるRTK Queryの優位性とメンテナンスの際に役立つTips - Qiitaqiita.com
104ブックマーク【脱Redux】SWRやReact Queryを使った状態管理戦略zenn.dev
58ブックマークNext.js + Prisma + NextAuth.js + React Queryを試した - $shibayu36->blog;blog.shibayu36.org
56ブックマーク2025年のReact状態管理、正直どれがいいの？ - Zustand, Jotai, Redux, Recoil, Valtio, XState, TanStack Query をざっくり解説 - Qiita2025年のReact状態管理、正直どれがいいの？ - Zustand, Jotai, Redux, Recoil, Valtio, XState, TanStack Query をざっくり解説ReactreduxjotaizustandTanStackQuery 「Redux使ってるけど、もっと軽いの無いのかな...」 「Recoilって今でも現役なの？」 「ZustandとJotai、どっちがいいんだろう...」 Reactの状態管理ラ...qiita.com
51ブックマークTanStack Router（& Query）はSPA開発で求めていたものだった✨【Reactのルーティングとデータ取得】zenn.dev
50ブックマークReact Query Builder(firstName like 'Stev%' and lastName in ('Vai', 'Vaughan') and age > '28' and (isMusician = TRUE or instrument = 'Guitar') and groupedField1 = groupedField4 and birthdate between DATE '1954-10-03' and '1960-06-06') Export/importConvert to and from SQL, MongoDB, and several other query formats. Th...react-querybuilder.js.org
46ブックマークGitHub - TanStack/query: 🤖 Powerful asynchronous state management, server-state utilities and data fetching for the web. TS/JS, React Query, Solid Query, Svelte Query and Vue Query.github.com
45ブックマークSWR vs React Query - fsubalscrapbox.io

関連ブログ

Web開発における知見共有系ページ•1年前

React Queryのメリットと使いどころと

React Queryのメリット React Queryの書き方 React Queryの使いどころ React Queryのメリット React Queryは、Reactアプリケーションでデータの取得、管理、キャッシュなどを簡単に行うためのライブラリです。 React Queryのメリットはいくつかあります。1. 簡単なデータ管理: React Queryは、APIからデータを取得し、キャッシュし、更新するためのシンプルで一貫したAPIを提供します。 これにより、複雑なデータフェッチロジックをシンプルかつ効果的に実装できます。2. 自動キャッシュと再取得: React Queryは、データの…

#React Query#useQuery#キャッシュ#状態管理#DevTools
かもメモ•2年前

React React-Query で同期的に mutation を実行したい

React の fetcher ライブラリに React Query をよく使っています。 特定の mutation を実行してエラーになったら別の mutation を実行させたい仕様があり同期的に mutation を実行 (try 〜 catch 内で mutation を実行) させる方法のメモ React-Query の mutation の基本 cf. Mutations | TanStack Query Docs import { useMutation } from '@tanstack/react-query'; const useApiCreatePost = () => …

#TypeScript#React Query
aptpod Tech Blog•3年前

Next.js とReact Query でデータを表示したり更新する

こんにちは。intdash グループ フロントエンドエンジニアの佐藤です。 Next.js を使った管理画面を作成するプロジェクトを担当する機会がありました。 管理画面は「頻繁にデータが更新されることがない」、「同時アクセスはあまり起きない」という前提の元に作成することが多いと考えています。 なのでサーバー、表示ともにパフォーマンス的に無駄なリクエストを投げたくはありません。 それを解決するため、プロジェクトにReact Query を導入しました。 今回はその導入事例をご紹介したいと思います。

#Next.js#React Query
たかぎとねこの忘備録•3年前

React NativeでReact Queryを使ってみよう

React Native React Queryを使ってみようという話。ネタバレすると、今回はuseQueryのみで、useMutationなどは使わない。 TL;DR 今回のコードはこちらのリポジトリで全容を確認できる。 github.com プロジェクトの準備 まずはプロジェクトを作成する。 expo init --template expo-template-blank-typescript cd project-name デザインをしやすくするためにNative Baseをインストールする。 yarn add native-base expo install react-native-…

#React Query#React Native
僕です。•4年前

ReactQuery × Suspense の組み合わせが便利すぎて感動した話

qiita.com

#React Query#React Hooks#TypeScript
OITA: Oika's Information Technological Activities•4年前

react-query : クラスコンポーネントのコードで導入するいくつかの方法

引き続き React Query のターン。 useQuery か、なるほどいいねこれということで導入しようと思っても、手元のコードは全然 class component ですよっていう場合に、どうやって導入していく方法があるかという整理。 おおよそそのまま、クラスコンポーネントでhooks使うにはどうするかっていう話になります。 検証コード 例として、以下のようなシンプルなコードを考える。 外部リソースとしてユーザ一覧を管理している 画面からユーザの追加を行う 画面でユーザ一覧を表示する

#React Query#react#React Hooks
OITA: Oika's Information Technological Activities•4年前

react-query : useQuery への依存をスタブに差し替えてコンポーネントテスト

引き続き React Query の話。 ある関数コンポーネントが useQuery によって取得される外部データに依存している場合に、そのuseQueryで取得される外部データをダミーに置き換えて、コンポーネントテストを書く方法。 なかなかまとまった情報が見つからなかったので記録しておく。 テストには Jest & React Testing Library を使用。

#React Query#react#React Testing Library#Jest
OITA: Oika's Information Technological Activities•4年前

react-query：invalidate と reset の挙動の違い

お勉強メモ。嘘ついたらごめんなさい。 React Query で、cacheTime, staleTime と、invalidateQueries, resetQueries あたりの使い分けの話。 お試し用コードは最後に載せてます。

#react#React Query