본문 바로가기

TanstackQuery

(3)
[TanStack Query / React Query] Optimistic Updates ( 낙관적 업데이트 ) : UI 방식과 캐시 방식 https://tanstack.com/query/latest/docs/framework/react/guides/optimistic-updates 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공식 문서를 번역 정리한 글 입니다.  낙관적 업데이트는 mutation 이 성공적으로 반영될 것이라 낙관적으로 판단을 하고서버로 부터 응답이 오기 전에  UI 업데이트를 먼저 하는 것을..
[TanStack Query / React Query] TanStack Query 필터링 filters : QueryFilters와 MutationFilters https://tanstack.com/query/latest/docs/framework/react/guides/filters#query-filters 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 공식문서를 간단히 요약한 내용입니다. 기본적으로 필터들은 invalidateQueries, removeQueries, refetchQueries 등과 함께 쓰입니다.  1. Que..
[TanStack Query / React Query] prefetchQuery : 데이터 선제적 로딩 이전 토이 프로젝트에서는 react-router 와 함께 사용하여loader 를 이용하여 페이지가 열리기 전, 사전에 데이터를 가져오는 방법을 사용했었지만순수하게 TanStack Query 를 사용하여 사전에 데이터를 가져오는 방법을 찾아보았습니다.  prefetchQuery & prefetchInfiniteQuery https://tanstack.com/query/latest/docs/framework/react/guides/prefetching#prefetchquery--prefetchinfinitequery TanStack | High Quality Open-Source Software for Web DevelopersHeadless, type-safe, powerful utilities for c..