상태 관리

primav·2025년 3월 20일

React

목록 보기
33/35
post-thumbnail

요즘 정말 많은 상태 관리가 있는데, 어떤 상태 관리 방식이 적절한지, 내가 상태 관리 방식에 대해 잘 알고 있는지에 대해 정리를 해보고자 이 글을 작성하게 됐다 !!

📌 상태 관리란?

React에서 상태(State)란 UI의 데이터나 특정 값들을 저장하고 관리하는 개념이다. 하지만, 애플리케이션이 커질수록 컴포넌트 간 상태 공유가 필요해지고, 이를 체계적으로 관리해야 하는 상황이 온다.

그렇다면, React에서 상태 관리 방법은 어떤 것들이 있을까? 그리고 어떤 상황에서 어떤 상태 관리 라이브러리를 선택해야 할까?

🎯 상태의 종류

먼저, 상태를 크게 두 가지로 나눌 수 있다.

1. 로컬 상태 (Local State)

특정 컴포넌트 내부에서만 사용하는 상태
useState, useReducer를 사용하여 관리

👀 언제 사용하는가?

  • 하나의 컴포넌트에서만 필요한 상태일 때
  • 부모-자식 관계에서만 간단한 상태 공유가 필요할 때

2. 전역 상태 (Global State)

여러 컴포넌트에서 공유해야 하는 상태
Context API, Redux, Recoil, Zustand 등의 라이브러리를 사용하여 관리

👀 언제 사용하는가?

  • 여러 컴포넌트에서 공통적으로 사용하는 데이터 (ex. 로그인 정보, 테마 설정 등)
  • 부모-자식 관계를 넘어서 여러 곳에서 상태를 공유해야 할 때

🎯 상태 관리 라이브러리 비교

React에서 사용되는 대표적인 상태 관리 방법들을 비교해보자.

라이브러리특징장점단점
useState / useReducer기본적인 상태 관리간단한 상태 관리 가능전역 상태 관리 어려움
Context API기본적인 전역 상태 관리Redux 없이 글로벌 상태 가능성능 최적화 필요
Redux전역 상태 관리 표준예측 가능한 상태 관리, 디버깅 용이설정이 복잡하고 코드가 많아짐
RecoilReact 전용 상태 관리간단한 문법, 비동기 상태 관리 가능생태계가 Redux보다 작음
Zustand가벼운 전역 상태 관리Redux보다 간단하고 직관적대규모 프로젝트에서는 부족할 수 있음

🎯 상황별 맞는 상태관리

  1. 간단한 상태 → useState, useReducer
  2. 작은 규모의 전역 상태 → Context API
  3. 대규모 프로젝트, 복잡한 상태 → Redux
  4. React 전용 상태 관리, 직관적인 API → Recoil
  5. Redux보다 가벼운 상태 관리 → Zustand

💡 결론

현직 개발자 분들께 물어보니 요즘은 상태 관리를 안하는 것이 최고의 방법이라고 하셨다 .. ㅎㅎ
리액트 쿼리를 사용하는 것이 좋은 것 같다 ..!!

0개의 댓글