[Step2.2] hippo: Zustand 적용하기 - #5
Conversation
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Free Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
WalkthroughContext API 기반의 ChangesContext API → Zustand 전역 상태 마이그레이션
예상 코드 리뷰 노력🎯 2 (Simple) | ⏱️ ~10 minutes Note 🎁 Summarized by CodeRabbit FreeYour organization is on the Free plan. CodeRabbit will generate a high-level summary and a walkthrough for each pull request. For a comprehensive line-by-line review, please upgrade your subscription to CodeRabbit Pro by visiting https://app.coderabbit.ai/login. Comment |
|
@coderabbitai review |
✅ Action performedReview finished.
|
| { | ||
| name: "restaurant-storage", | ||
| partialize: (state) => ({ selectedCategory: state.selectedCategory }), | ||
| }, |
There was a problem hiding this comment.
[제안]
카테고리 필터는 브라우저를 닫아도 유지해야 하는 설정값보다 현재 탐색 중인 임시 상태에 가깝다고 판단해서 저는 sessionStorage로 변경했습니다. localStorage는 탭 간에도 공유되고 브라우저를 닫아도 남아있기 때문에, 이 경우엔 sessionStorage를 사용하는 것이 더 적합할 것 같습니다!
| }), | ||
| { | ||
| name: "restaurant-storage", | ||
| partialize: (state) => ({ selectedCategory: state.selectedCategory }), |
There was a problem hiding this comment.
[배움]
저는 서버 데이터와 카테고리 필터를 각각 다른 store로 분리했는데, partialize를 사용하면 단일 store를 유지하면서도 저장할 상태를 선택할 수 있군요. 두 방식 모두 서버 데이터가 localStorage에 저장되는 걸 방지한다는 점에서 같은 문제를 해결하고 있는데, partialize를 쓰면 파일 수를 줄일 수 있어서 더 간결해 보여요.
| ``` | ||
|
|
||
| ### AddRestaurantModal — onSubmit prop 제거 | ||
| ### 이벤트 핸들러와 스토어 액션의 분리 |
There was a problem hiding this comment.
[배움]
저도 같은 구조로 구현했는데 명확하게 정리하지 못하고 넘어갔던 부분을 정리해주셔서 이해가 편해졌습니다!
| useEffect(() => { | ||
| fetchRestaurants(); | ||
| }, [fetchRestaurants]); | ||
|
|
There was a problem hiding this comment.
[질문]
RestaurantList는 목록을 보여주는 역할인데, 초기 fetch를 여기서 담당하면 데이터를 언제 불러올지 결정하는 책임도 함께 갖게 되지 않나요? App.jsx에서 호출하는 방식과 비교해서 이 위치를 선택하신 이유가 궁금합니다!
There was a problem hiding this comment.
"데이터를 가져오는 것"과 "화면에 보여주는 것"을 같은 컴포넌트가 담당하는 것이 자연스럽다고 생각했습니다.
이 컴포넌트가 마운트될 때 데이터가 필요하다는 사실이 코드에서 바로 보여서 이 위치를 선택했습니다!
2 participants
개인 목표 달성 여부
create,set,get, selector 개념을 직접 사용하며 Zustand 스토어 구조를 익힌다.Summary by CodeRabbit
새 기능
변경 사항