개요
- 상태 관리의 주요 원칙을 이해하면, 컴포넌트간에 느슨하게 결합된, 구조적으로 아름다운 코드를 작성할 수 있습니다.
궁금점
- 로컬 상태와 전역 상태란?
- 전역 상태가 필요한 이유는?
- 상태 관리 라이브러리가 필요한 이유는?
상태란?
- 상태가 변하는 데이터입니다.
- 특히 프론트엔드에서는 "UI에 동적으로 표현되는 데이터" 입니다.
상태 찾기
- 상태
- 상태 변경이 일어나는 곳
- 상태 변경의 영향을 받는 곳
Side Effect 란?
- "함수의 입력 외에도 함수의 결과에 영향을 미치는 요인" 입니다.
- 대표적으로 네트워크요청, API 호출이 Side Effect 입니다.
로컬 상태 vs 전역 상태
로컬 상태
- 컴포넌트 내에서만 영향을 끼치는 상태
- 폼(form) 엘리먼트의 데이터는 대부분 로컬 상태입니다.
전역 상태
- 다른 컴포넌트와 상태를 공유하고 영향을 끼치는 상태
- 장바구니에 담긴 물품, 데이터 로딩 여부 등
데이터 무결성
개요
- 데이터의 정확성을 보장하기 위해 데이터의 변경이나 수정 시 제한을 두어 안정성을 저해하는 요소를막고 데이터 상태들을 항상 옳게 유지하는 것입니다.
신뢰할 수 있는 단일 출처 (Single source of truth)
- 데이터 무결성을 위한 방법론
- 동일한 데이터는 항상 같은 곳에서 데이터를 가지고 온다
전역 상태 관리 예시
다크모드
국제화 설정
히스토리 기능 (Undo/Redo)
상태 관리 툴
목적
- 전역 상태 저장소 제공이 대표적입니다.
props drilling문제 해결
Aim for the TOP, Developer