리액트 상태

리진아·2024년 9월 4일

리액트의 상태 : 렌더나 이벤트 등에 의해 변경될 수 있는 동적인 값 (값이 변하면 상태가 변하는 값)


상태의 종류

1. 전역상태 (Global State)

프로젝트 전체에서 관리되는 상태
전역에서 관리하는 만큼 상태의 위치에 상관없이 사용 및 변경 가능

2. 지역상태 (Local State)

컴포넌트 내부에서 관리되는 상태
하위 컴포넌트로 데이터를 전달하기 위해서는 props를 사용
(보통 Form 데이터들)

3. 컴포넌트 상태

여러가지 컴포넌트에서 관리되는 상태
(모달)

각 컴포넌트 간의 직접적인 데이터 전달이 어려워서 데이터를 부모 컴포넌트에 보내고 다시 해당 상태 데이터를 필요한 컴포넌트로 전달해야 함.
=> 이렇게 Props Drilling이 많아질 경우 Prop의 출처를 찾기 어려움
=> 따라서 상태관리를 해줘야 됨



상태관리를 해야하는 이유

  • 유지보수에 용이
  • 복잡한 시스템일수록 작업의 상태를 추적하기 어려워서
  • 중복코드 방지, 재사용성 증가
  • 성능 최적화
  • 상태가 어디에서 왔고, 어디를 거쳐서 어디까지 갔고.. 이걸 다 기억할 수 있으면 상태관리 안 해도 됨 ,,



상태관리 라이브러리

useState
  • state를 관리하여 DOM을 업데이트하는 react hook
Context API
  • React 컴포넌트 트리 안에서 전역 상태를 공유할 수 있도록 만들어진 방법
Redux
  • 전역 상태관리를 위한 도구로, 어플리케이션 전체에 대한 중앙 저장소 역할
React Query
  • 서버와 클라이언트 간 비동기 작업을 쉽게 다룰 수 있게 도와주는 라이브러리로, 서버상태를 관리하는 라이브러리
profile
이것저것 개발 블로그

0개의 댓글