Frontend/Zustand2 [Zustand] 상태 및 액션 설계 패턴 (작성 중) 목차1. 상태 설계 패턴2. 액션 설계 패턴1. 상태 설계 패턴① Store 구조화 기본 원칙 Zustand의 Store는 상태, 액션(함수) 계산된 값(Computed Value), 총 세가지로 나눠서 설계를 한다.const useCountStore = create((set, get) => ({ count: 0, setCount: () => set((state) => ({count: state.count + 1})), doubleCount: () => get().count * 2})); 상단의 소스코드에서 count는 상태에 해당하며setCount는 count의 값을 1 증가하는 액션을 수행하는, 상태를 변경하는 함수이고그리고 doubleCount는 get() 함수를 통해 상태의 값을 .. 2025. 6. 25. [Zustand] Zustand 맛보기 목차1. Zustand란?_① 상태 관리 라이브러리를 사용해야 하는 이유_② Zustand 설치 및 기본 예제1. Zustand란? Zustand는 독일어로 "상태", "형편", "상황"등을 의미하는 단어로'redux', 'recoil'과 같은 React에서 사용되는 상태 관리 라이브러리 중 하나이다. Zustand는 보일러 플레이트를 사용하지 않기 때문에 코드 작성이 간결하며별도의 Provider 없이도 사용할 수 있다는 장점을 가지고 있는 상태 관리 라이브러리이다.① 상태 관리 라이브러리를 사용해야 하는 이유 Zustand라는 라이브러리가 어떤건지는 대충 알았으나굳이 Zustand 같은 상태 관리 라이브러리를 써야하는 지에 대해 의문점이 들것이다.기본적으로 React로 개발한 프로젝트는 여러 개의 컴.. 2025. 6. 24. 이전 1 다음