TanStack Query (React Query) 사용 가이드

참고 원문: https://www.heropy.dev/p/HZaKIE 기준 버전: @tanstack/react-query v5 (5.61+)

TanStack Query는 서버 데이터의 가져오기 · 캐싱 · 동기화를 담당하는 라이브러리다. 이 스킬은 v5 단일 객체 시그니처(useQuery({ ... }))를 전제로 한다.

결정 원칙

작업 유형에 따라 훅을 고른다:

상황	사용할 훅
데이터 조회(GET)	`useQuery`
페이지네이션 / 무한 스크롤	`useInfiniteQuery`
생성·수정·삭제(POST/PUT/PATCH/DELETE)	`useMutation`
Next.js SSR + Suspense 경계	`useSuspenseQuery` (Next.js 섹션 참조)

useState + useEffect + fetch 조합으로 서버 데이터를 다루려는 코드를 봤다면, 거의 모든 경우 위 훅 중 하나로 대체하는 것이 맞다.