Tanstack Query 설정

 

 

https://tanstack.com/

TanStack | High Quality Open-Source Software for Web Developers

 

1. 설치

npm i @tanstack/react-query

 

 

2. queryClient를 생성한 후, 사용할 컴포넌트를 QueryClientProvider로 감싼다.

 -  QueryClient는 모든 서버 상태를 보관하는 store라고 이해하면 되겠다.

import { createRoot } from 'react-dom/client'
import './index.css'
import App from './App.jsx'
import { BrowserRouter } from 'react-router-dom'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'

const queryClient = new QueryClient({})

createRoot(document.getElementById('root')).render(
  <QueryClientProvider client={queryClient}>
      <BrowserRouter>
        <App />
      </BrowserRouter>
  </QueryClientProvider>
)