React Query (TanStack Query)
useQuery, useMutation, invalidation, caching, refetch, loading/error states, optimistic updates, query keys, pagination
1What is the main role of useQuery in React Query?
What is the main role of useQuery in React Query?
Answer
useQuery is the fundamental hook for fetching read-only data from an API or data source. It automatically handles caching, loading states, errors, and refetch strategies. Unlike useEffect with fetch, useQuery optimizes performance by avoiding redundant requests through its intelligent caching system.
2Which hook should be used to perform a POST mutation to an API?
Which hook should be used to perform a POST mutation to an API?
Answer
useMutation is the dedicated hook for write operations like POST, PUT, PATCH or DELETE. It provides onSuccess, onError and onMutate callbacks to handle the mutation lifecycle. Unlike useQuery which is for reading, useMutation doesn't trigger the request automatically and requires an explicit call to the mutate function.
3What is the purpose of the query key in React Query?
What is the purpose of the query key in React Query?
Answer
The query key is a unique identifier that allows React Query to manage cache and dependencies between queries. It serves to identify, invalidate and refetch specific queries. A query key can be a simple string or an array including dynamic parameters. Changing the query key automatically triggers a new fetch, which allows managing dependencies declaratively.
What does staleTime represent in the useQuery configuration?
Which property indicates that useQuery is loading?
+17 interview questions
Other React / Next.js interview topics
JavaScript Essentials
React Fundamentals
React Hooks
Component Lifecycle
React Router
State Management with Context
Forms & Controlled Components
Data Fetching & API
Styling & CSS-in-JS
Next.js Fundamentals
TypeScript with React
Next.js Data Fetching
Next.js Server Actions
Next.js Routing & Navigation
Next.js API Routes
Next.js Metadata & SEO
Next.js Middleware & Auth
React Testing
Zustand State Management
React Performance Optimization
Error Boundaries & Error Handling
Advanced React Patterns
Next.js Advanced Features
Next.js Deployment & Production
Architecture & Design Patterns
React Server Components
Next.js Internationalization
React Security & Best Practices
Master React / Next.js for your next interview
Access all questions, flashcards, technical tests, code review exercises and interview simulators.
Start for free