Overview

지금까지 살펴본 useContext + **useReducer**의 조합으로 앱 글로벌 State도 충분히 관리 가능하다 생각하지만 실제 앱 개발 시에는 드로잉 최적화, 오류 처리, 캐시 등 고려할 사항이 많음

→ State 관리 라이브러리를 사용하여 해결

현 시점 자주 사용되는 State 관리 라이브러리

• Redux
• Recoil

해당 절에서는 Recoil을 전제로 State 관리 라이브러리의 기본을 설명

install recoil

npm install recoil

Recoil

Atom

Atom은 Recoil에서 가장 기본적인 상태 단위로 State를 관리하는 스토어이며, 앱 고유 키로 관리하는 것이 기본 Atom은 값을 저장하고 여러 컴포넌트에서 공유할 수 있는 상태

Selector

Atom에서 가져온 데이터를 가공, 연산, 필터링하여 새로운 값을 만들어주는 함수

Atom에서 직접 값을 가져올 수도 있지만, 연산을 수반하는 값은 Selector를 통해 가져와야 State에 관련된 처리가 컴포넌트에 산재되어 있는 것을 방지할 수 있음