Zustand persist 사용법: 새로고침 후 상태 저장하기
Zustand의 persist 미들웨어로 새로고침 후에도 상태를 유지하는 방법을 정리합니다. localStorage, partialize, hydration 흐름을 기준으로 저장할 상태와 저장하지 않을 상태를 구분합니다.
상태관리와 데이터 카테고리는 클라이언트 상태, 서버 상태, 캐싱, 비동기 데이터 흐름을 정리합니다. Zustand, TanStack Query, Firebase, Axios 같은 도구를 함께 다룹니다.
총 46개의 글
Zustand의 persist 미들웨어로 새로고침 후에도 상태를 유지하는 방법을 정리합니다. localStorage, partialize, hydration 흐름을 기준으로 저장할 상태와 저장하지 않을 상태를 구분합니다.
Zustand에서 action을 사용해 상태 변경 로직을 컴포넌트 밖으로 분리하는 기준을 정리합니다. 필터 상태 예시를 통해 set 함수, 토글, 초기화, action 이름 짓는 방식을 함께 다룹니다.
Zustand에서 state를 읽고 action으로 변경하는 기본 흐름을 정리합니다. selector, set 함수, 이전 state 기준 업데이트, UI 상태 관리 예시까지 함께 다룹니다.
Zustand를 React 프로젝트에 설치하고 `create`로 기본 Store를 만드는 흐름을 정리합니다. 상태와 액션을 Store 안에 구성하고 컴포넌트에서 필요한 값만 선택해 사용하는 기준을 다룹니다.
useState, props, Context, Redux Toolkit, TanStack Query와 비교해 Zustand가 필요한 상황을 판단하고 기본 store·action·selector를 예제로 정리합니다.
TanStack Query staleTime gcTime 차이: 캐시 시간 기준을 중심으로 개념, 사용 기준, 실무 적용 흐름을 예제와 함께 정리합니다.
TanStack Query queryFn 사용법: 데이터 요청 책임 나누기을 중심으로 개념, 사용 기준, 실무 적용 흐름을 예제와 함께 정리합니다.
Firestore seed data 설계: 리뷰 더미 데이터 구조 잡기을 중심으로 개념, 사용 기준, 실무 적용 흐름을 예제와 함께 정리합니다.
Firebase .firebaseignore 작성법: 배포 제외 파일 관리을 중심으로 개념, 사용 기준, 실무 적용 흐름을 예제와 함께 정리합니다.
Firebase Hosting App Hosting 차이: 정적 배포와 SSR 기준을 중심으로 개념, 사용 기준, 실무 적용 흐름을 예제와 함께 정리합니다.