JavaScript 비동기 흐름 다시 보기 (07) - React Query는 Promise를 어떻게 UI 상태로 바꾸는가query function의 fulfilled와 rejected 결과가 React Query의 isPending, isError, data, error, isFetching으로 이어지는 흐름을 정리합니다.
Next.js의 use client는 CSR이 아니다Next.js App Router의 use client가 SPA의 CSR과 어떻게 다른지, hydration과 data fetching 관점에서 정리합니다.
중첩 모달 문제를 라이브러리로 풀면서 배운 것들react-layered-dialog를 만들고 공개하면서, 다이얼로그 문제를 풀 때 무엇을 남기고 무엇을 버려야 하는지 다시 정리했습니다.
프론트엔드 데이터 패칭 다시 보기 (05) - Next.js App Router에서는 이 패턴을 어떻게 다시 설계해야 하는가App Router에서 서버 컴포넌트, DAL, 최상단 orchestration, client cache의 역할을 어떻게 나누면 좋은지 정리합니다.프론트엔드 데이터 패칭 다시 보기 (04) - prefetch와 hydration은 언제 도움이 되고 언제 구조를 흐리는가prefetch와 hydration이 초기 로드에 왜 강한지, 그리고 컴포넌트가 많아질수록 왜 중복 요청과 serialization 비용, ownership 혼란으로 이어질 수 있는지 정리합니다.프론트엔드 데이터 패칭 다시 보기 (03) - TanStack Query는 서버 상태를 어떻게 추상화하는가query key, cache, staleTime, mutation, invalidation이 왜 한 세트로 묶이는지, TanStack Query가 서버 상태를 어떤 모델로 다루는지 정리합니다.프론트엔드 데이터 패칭 다시 보기 (02) - 서버 상태를 다룬다는 것은 정확히 무엇인가캐시, stale data, refetch가 왜 한 묶음으로 따라오는지, 서버 상태를 로컬 상태와 같은 방식으로 다룰 수 없는 이유를 정리합니다.프론트엔드 데이터 패칭 다시 보기 (01) - React에서 비동기 데이터 처리는 왜 자꾸 복잡해지는가useEffect 하나로 시작한 데이터 패칭이 왜 로딩, 중복 요청, stale data, 화면 간 불일치 문제로 빠르게 커지는지 서버 상태 관점에서 정리합니다.