📡 You're offline — showing cached content
New version available!
Quick Access
Tutorials React Modern Development React Query / TanStack Query

React Query / TanStack Query

6 min read
TanStack Query fetches and caches server data. useQuery({queryKey:['users'], queryFn: fetchUsers}) gives data, isLoading, and error automatically. useMutation handles creates and updates with cache invalidation.

TanStack Query (React Query)

npm install @tanstack/react-query

import { useQuery, useMutation } from "@tanstack/react-query";

function Users() {
  const { data, isLoading } = useQuery({
    queryKey: ["users"],
    queryFn: () => fetch("/api/users").then(r => r.json()),
  });

  if (isLoading) return ;
  return 
    {data.map(u =>
  • {u.name}
  • )}
; }