zustand로 상태관리 하면서
메뉴 접었다 펴는 toggle value를 persist 걸어두려는데
이렇게 할 때 일단 로컬이나 세션스토리지에 접근해야
비었는지 원하는 값이 있는지 확인해서 T/F 할거잖음
근데 실행하거나 새로고침 하면서 렌더링 되는 과정에서
서버 측에서는 스토리지에 접근을 못하니까
컴포넌트에서 toggle value값 필요한데 나는 접근 못 해 하면서 에러 한 번 뱉은다음
클라이언트가 접근해서 값을 가져오는 중인데
useEffect는 또 최상위 컴포넌트에만 쓸 수 있다고 하니까
메인 레이아웃에 자식 컴포넌트로 붙은 사이드 메뉴에서는 못 쓰고
먼가 진짜 벽 느끼는중
내가 이해를 잘못하고 있나 싶기도 하고
zustand는 persist 미들웨어 달아주면 그거 알아서 처리될텐데 뭐가문제인거임?
그게 안돼서 문제란거임. 서버에는 localStorage가 없자나. 커스텀 스토리지 만들어야함 - dc App
아래 링크에서 "3. 스토어를 초기화 하는 함수를 만들어 줍니다." 참고해봐
https://prod.velog.io/@yhg0337/%EB%91%90%EB%B2%88%EC%A7%B8.-Zustand%EC%99%80-%ED%95%A8%EA%BB%98-SSR-Hydration
https://docs.pmnd.rs/zustand/integrations/persisting-store-data#usage-in-next.js
- dc App
다들 감사함다 이따 저녁에 또 해볼게요 새벽에 넘 답답해서 글쓰고 쭉 잤음 ㅎㅎ....
뭔소리 하는 거임 토글 매뉴 스테이트를 왜 서버측에 저장함 클라이언트 스토리지에 저장해야지
RSC 얘기잖아
그러니까 이게 클라이언트 스토리지에 저장을 해두긴 했는데.. 예를들어 zustand로 create 하면서 persist middleware 사용할 때 value값과 toggle이라는 메서드를 정의해두려는데요. 이 때 value를 localstorage.getitem(asdf)으로 해뒀더니 페이지가 렌더링 될때 next가 ssr 하는과정에서 value를 사용하는 페이지를 렌더 하려는데 value값을 가져오려니 서버에서는 로컬스토리지에 접근할 수가 없으니까 값을 못 가져온다고 에러를 뱉고있어요 ㅠ
로컬 스토리지를 꼭 써야하는 상황인지부터 확인해봐야겠는데