반응형
dehydrate
-
[React Query] (5) SSRFront-End(Web)/React - 라이브러리들 2022. 8. 12. 21:12
🧐 서론 지난 포스팅까지 진행하며, React Query를 사용해서 데이터를 다루는 주요 문법들을 정리하였다. 프로젝트를 마이그레이션하며 적용하던 중, Next.js 세팅인 점을 상기했으며 당연히 React Query도 SSR을 위한 솔루션을 제공하는 것을 알았다. Next.js에서의 SSR을 React Query와 함께 사용하기 위해 어떤 방법이 있는지 한 번 정리해보도록 하겠다. 🌺 SSR 사용하기 공식문서는 React Query가 2가지 형태의 SSR을 지원한다고 소개한다. initialData : SSR 메서드로 불러온 응답을 React Query 기본값으로 넣어주는 방법 Hydration : SSR 내에서 prefetch를 통해 쿼리를 불러온 뒤, queryClient에서 dehydrate한 ..