Coding Study/Tanstack Query(2)
-
Tanstack Query 설정
https://tanstack.com/ TanStack | High Quality Open-Source Software for Web DevelopersHeadless, type-safe, powerful utilities for complex workflows like Data Management, Data Visualization, Charts, Tables, and UI Components.tanstack.com 1. 설치npm i @tanstack/react-query 2. queryClient를 생성한 후, 사용할 컴포넌트를 QueryClientProvider로 감싼다. - QueryClient는 모든 서버 상태를 보관하는 store라고 이해하면 되겠다.import { createRoot }..
2025.11.12 -
useQuery 사용법
1. React 에서의 일반적인 데이터 패칭 방법 1) 데이터를 받아오는 비동기 함수를 작성export async function fetchMovieDetail(id: string) { const options = { method: 'GET', headers: { accept: 'application/json', Authorization: `Bearer ${API}`, }, } const response = await fetch( `https://api.themoviedb.org/3/movie/${id}?language=ko`, options ) if (!response.ok) { throw new Error('영화 정보를 불러오지 못했습니다.'..
2025.11.12