React Query Quiz ( Beginner ) - All Questions

This easy-level React Query quiz is designed for beginners who want to understand server-state management in React applications. It covers core concepts like fetching data, caching, loading states, and basic React Query hooks in a simple, interview-friendly way.

Question 1: What problem does React Query primarily solve?

Client-side state management
Server-state management
Routing
Styling

Explanation: React Query is designed to manage server-state such as API data.

Question 2: React Query is also known as:

Redux Query
React Fetch
TanStack Query
React Async

Explanation: React Query is part of the TanStack Query family.

Question 3: Which hook is used to fetch data in React Query?

useFetch
useEffect
useQuery
useLoader

Explanation: useQuery is the primary hook for fetching data.

Question 4: What does useQuery return?

Only data
Data and loading/error state
Only loading state
Only error

Explanation: useQuery provides data, loading, and error states.

Question 5: What is a query key in React Query?

API URL
Unique identifier for cached data
HTTP method
Component name

Explanation: Query keys uniquely identify cached queries.

Question 6: Which state indicates data is being fetched?

isLoading
isIdle
isPaused
isStopped

Explanation: isLoading is true while data is being fetched.

Question 7: Where does React Query store cached data?

Redux store
Browser localStorage
In-memory cache
Session storage

Explanation: React Query stores data in an in-memory cache.

Question 8: Which option defines how long data stays fresh?

cacheTime
staleTime
retryTime
refetchTime

Explanation: staleTime controls how long data is considered fresh.

Question 9: What happens when data becomes stale?

It is deleted
It is refetched automatically
It may be refetched on events
It causes an error

Explanation: Stale data can be refetched on window focus or re-mount.

Question 10: Which event triggers refetch by default?

Window focus
Mouse hover
Scroll
Resize

Explanation: React Query refetches on window focus by default.

Question 11: Which hook is used for POST, PUT, or DELETE requests?

useQuery
useFetch
useMutation
useAsync

Explanation: useMutation is used for modifying server data.

Question 12: What does a mutation usually represent?

Reading data
Updating server data
Caching data
Clearing state

Explanation: Mutations change data on the server.

Question 13: Which property indicates a mutation is in progress?

isLoading
isFetching
isPending
isMutating

Explanation: isPending indicates an ongoing mutation.

Question 14: What happens when a query fails?

App crashes
Error state is returned
Cache is cleared
Query stops permanently

Explanation: useQuery exposes an error state when a request fails.

Question 15: Which option controls automatic retries?

retry
refetch
reload
attempts

Explanation: retry defines how many times a failed query retries.

Question 16: What does invalidateQueries do?

Deletes queries
Marks queries as stale
Stops fetching
Resets cache

Explanation: invalidateQueries marks cached data as stale.

Question 17: Which hook provides access to the query client?

useClient
useQueryClient
useCache
useStore

Explanation: useQueryClient provides access to the query client.

Question 18: Why are query keys often arrays?

For performance
To support dynamic parameters
To reduce memory
For styling

Explanation: Arrays allow query keys to include parameters.

Question 19: What does cacheTime control?

How long data is fresh
How long unused cache is kept
Retry duration
Fetch delay

Explanation: cacheTime controls how long inactive data stays in cache.

Question 20: Which provider must wrap the app to use React Query?

QueryContext
QueryProvider
QueryClientProvider
ReactQueryProvider

Explanation: QueryClientProvider makes the client available to hooks.

Question 21: Which library is required to use React Query?

redux
@tanstack/react-query
axios-query
react-async

Explanation: React Query is imported from @tanstack/react-query.

Question 22: What is the default behavior when a component remounts?

No refetch
Always refetch
Refetch if data is stale
Clear cache

Explanation: Stale data may refetch on remount.

Question 23: Which option disables automatic refetch on focus?

refetchOnMount
refetchOnWindowFocus
autoRefetch
focusRefetch

Explanation: refetchOnWindowFocus can disable focus-based refetch.

Question 24: What does React Query replace in many apps?

Redux entirely
Manual useEffect data fetching
React state
Context API

Explanation: React Query simplifies manual data fetching logic.

Question 25: Which state means data is already cached but refetching?

isLoading
isIdle
isFetching
isPaused

Explanation: isFetching indicates background refetching.

Question 26: What is the main benefit of caching?

More API calls
Faster UI and fewer requests
Complex code
More memory usage

Explanation: Caching improves performance and reduces network calls.

Question 27: Which feature keeps UI data fresh automatically?

Auto caching
Background refetching
Local state
Manual polling

Explanation: Background refetching updates data automatically.

Question 28: What does enabled option control?

Retry behavior
Whether query runs automatically
Cache clearing
Refetch timing

Explanation: enabled controls conditional query execution.

Question 29: Which option allows polling data at intervals?

pollTime
interval
refetchInterval
refreshTime

Explanation: refetchInterval enables polling.

Question 30: What does React Query treat API data as?

Client state
Server state
Local state
Derived state

Explanation: React Query focuses on server state.

Question 31: Which property holds fetched data?

result
response
data
value

Explanation: Fetched data is available in data.

Question 32: Which option disables retries completely?

retry: false
retry: 0
retry: off
retry: none

Explanation: retry: false disables retry attempts.

Question 33: What does onSuccess callback do?

Runs when query succeeds
Runs before fetch
Runs on error
Runs on mount

Explanation: onSuccess executes after successful fetch.

Question 34: Which hook is best for dependent queries?

useEffect
useQuery with enabled
useMutation
useReducer

Explanation: enabled allows dependent query execution.

Question 35: Which option helps reduce unnecessary refetches?

cacheTime
staleTime
retry
enabled

Explanation: Higher staleTime reduces refetch frequency.

Question 36: What does React Query avoid managing?

Loading state
Error state
Server caching
Form input state

Explanation: React Query does not manage local form state.

Question 37: Which hook clears cached queries manually?

resetQueries
invalidateQueries
clearCache
removeQueries

Explanation: removeQueries removes cached queries.

Question 38: Which feature improves perceived performance?

Optimistic updates
Delayed fetch
Manual caching
Blocking UI

Explanation: Optimistic updates update UI before server response.

Question 39: Which hook is commonly used with forms and submissions?

useQuery
useEffect
useMutation
useMemo

Explanation: useMutation handles form submissions.

Question 40: What happens if multiple components use the same query key?

Multiple requests fire
Cache is shared
App crashes
Queries conflict

Explanation: React Query shares cached data by key.

Question 41: Which option controls query retry delay?

retryDelay
retryTime
delay
timeout

Explanation: retryDelay controls retry timing.

Question 42: What does refetch() do?

Clears cache
Manually refetches data
Stops polling
Disables query

Explanation: refetch manually triggers data fetching.

Question 43: Which option prevents query from running on mount?

enabled: false
refetchOnMount: false
retry: false
cacheTime: 0

Explanation: enabled: false stops automatic execution.

Question 44: What is the biggest benefit of React Query for beginners?

Less boilerplate and better defaults
No need for APIs
Faster JSX
Automatic Redux replacement

Explanation: React Query simplifies data fetching with minimal setup.

Question 45: Which state indicates an error occurred?

isError
hasError
errorState
failed

Explanation: isError becomes true when a query fails.

Question 46: What is the main role of QueryClient?

Fetch data
Render UI
Manage cache and queries
Handle routing

Explanation: QueryClient manages caching and query behavior.

Question 47: React Query works best with which type of data?

Local component state
Derived UI state
Remote server data
CSS state

Explanation: React Query is optimized for server data.

Question 48: What is the key takeaway of React Query?

It replaces React
It manages server state efficiently
It manages UI state
It removes async code

Explanation: React Query simplifies and optimizes server-state management.

Back to programming Quizzes

React Query Quiz ( Beginner )

Questions

~15

Minutes

Min Limit