인프런 커뮤니티 질문&답변
작성한 질문수
state 관리에 대한 정리
해결된 질문
작성
·
32
·
수정됨
0
안녕하세요 정환님 !!!
정환님 강의를 듣다가 state관리쪽에 개념이 갑자기 섞여서 질문을 하게되었어요
저는 현재 다음과 같은 방향으로 이해를 하고있어요
한 페이지내에서 여러 컴포넌트를 사용할때 간단한 자식 구조에서는
props를 사용한다.한 페이지내에서 여러 컴포넌트를 사용할때 3~4 혹은 그이상으로 자식관계가 걸쳐있는 상태에서는
conntext API를 사용한다.로그인과 같이 특정 페이지가 아니라 여러 페이지에서 관리가 필요한
state는 zustand처럼 전역 라이브러리를 사용한다.
제가 이해한 방향이 맞을까요??
답변 3
0
안녕하세요 kaeuhy님 이정환입니다.
전반적으로는 맞습니다. 다만 Zustand를 도입하시게 되면 Context API는 보통 잘 사용하지 않게 됩니다. Zustand가 Context API의 기능을 이미 다 제공해 주거든요!
0
해당 컴포넌트 내부에서만 쓰이는 state 이면 컴포넌트 내부에서
useState, useReducer를 사용합니다.부모-자식 간 간단한 전달이라면
props로 전달합니다.자식 간의 상태 공유이면 부모 컴포넌트에 상태를 끌어 올립니다
(Lifting State Up)깊은 계층 간에 전달(
props drilling)이라면Context API를 사용합니다.복잡한 전역 상태 및 비동기 처리 등의 상태 관리가 필요하다면
TanStack Query, Zustand,Redux등의 상태 관리 라이브러리를 사용합니다.
0
안녕하세요, 인프런 AI 인턴입니다. kaeuhy님.
React의 상태 관리에 대한 방향을 정리하시다 보니 헷갈리는 부분이 있으시군요. 질문에 대한 답변과 함께 각 방법의 사용에 대해 간단히 요약해드리겠습니다.
Props:
- 부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달할 때 사용됩니다.
- 주로 컴포넌트 계층 내에서 상태가 깊이 중첩되지 않을 때 간단하게 사용할 수 있습니다.
- 부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달할 때 사용됩니다.
Context API:
props drilling문제를 해결하기 위해 사용됩니다.
- 여러 컴포넌트에 걸쳐 데이터가 전달되어야 할 때 유용합니다. 예를 들어, 현재 선택된 테마, 현재 사용자 정보와 같은 전역적으로 사용되는 데이터에 적합합니다.
Zustand와 같은 전역 상태 관리 라이브러리:
- 복잡한 상태 관리가 필요한 상황에서 유용합니다.
- 상태 변경에 대한 논리와 데이터 흐름이 복잡할 때, store를 중앙에서 관리함으로써 앱의 복잡성을 줄일 수 있습니다.
- 로그인 정보, 유저 상태, 공통 설정 값 등 여러 페이지에 걸쳐 활용되는 데이터를 관리할 때 적합합니다.
- 복잡한 상태 관리가 필요한 상황에서 유용합니다.
각각의 방법은 React의 상태 관리에 대해 특정한 필요에 맞춰 최적의 도구를 선택해야 한다는 맥락이 있습니다.
참고로, Context 관련 상태관리 도구 질문에 대한 이정환 강사님의 답변도 도움이 될 것입니다. 질문에서 설명한 React Context API와 Zustand의 차이점을 설명하고, 상태 관리 도구 선택에 대한 고려 사항을 공유하고 있습니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.