
최근 프론트엔드 개발을 하다 보면 React와 함께 거의 필수적으로 사용하는 라이브러리, TanStack Query가 있다. 그중에서도 useQuery는 GET 요청을 처리할 때 자주 사용되며, 서버 상태를 매우 편리하게 관리할 수 있도록 도와준다.
이처럼 편리하게 쓸 수 있다 보니 그동안은 단순히 가져다 쓰기만 했을 뿐, 내부적으로 어떻게 동작하는지는 깊이 이해하지 못하고 있었다. 그래서 이번에는 useQuery가 어떤 방식으로 동작하는지 오픈소스 코드를 직접 살펴보며 정리해 보았다.
그리고 context api로 공유하게 되는 QueryClientContext 는 내부적으로 600줄에 이르는 거대한 클래스로 이루어져 있다.