→ fetching, caching, 서버 데이터의 동기화를 지원해주는 라이브러리



설치

npm i @tanstack/react-query

How to use?

const { data, isLoading, error, ... } = useQuery<데이터타입>({
  queryKey: ['key'], 
  queryFn: fetchFunction
});

→ queryKey를 기준으로 캐싱

→ queryFn: () => fetchFunction(params) : params가 있을 경우


Query Client

→ React Query의 전역 캐시 관리

//index.tsx

const queryClient = new QueryClient();

<QueryClientProvider client={queryClient}>
  <App />
</QueryClientProvider>