전역상태관리

Programming Language/React

[React] 리액트의 전역상태관리 도구, 어떤 것을 선택할까

리액트의 전역상태관리 도구들에 대해 claude에게 대화를 나눠서 얻은 글이다.리액트의 전역상태관리 도구, 어떤 것을 선택할까?들어가며React 애플리케이션 개발시 전역 상태 관리의 필요성을 마주치게 된다.React의 기본 제공되는 Context API부터 다양한 서드파티 라이브러리까지, 각각의 도구들은 저마다의 특징과 장단점을 가지고 있다.React의 기본 제공 도구: Context APIContext API의 특징React의 기본 제공되는 Context API는 간단한 전역 상태 관리에 적합하다.// Context 생성const ThemeContext = React.createContext(null);// Provider 구현const ThemeProvider = ({ children }) => { ..

Programming Language/React

[React] Zustand: 여러 상태를 사용할 때 하지말아야 할 것

이 글을 쓰게 된 배경은zustand의 z자도 모르고 썼던게 분명한 내가 잘못 사용해왔던 코드에 대한 깨달음과 부끄러움을 담은 글이다.(위 글은 Zustand의 최신 버전인 v5로 작성되었다)여러 상태를 사용할 때 하지말아야 할 것Not To Do: 구조 분해 할당으로 가져오기import { create } from 'zustand'const useEqpStore = create((set) => ({ type: 'printer', state: 'idle', process: 'none', subprocess: 'none', updateType: (newType) => set({ type: newType }), updateState: (newState) => set({ state: newState..