우리의 목표

<aside> 💡 전역 상태를 사용할 수 있다. 지역 상태와 전역 상태를 분리하여 관리할 수 있다. 할 수 있다.

</aside>

왜 배우는가?

• 해커톤을 위해
• 맨 상단의 부모에서 모든 state를 관리할 수 없기 때문에

참고

• 저도 안써봤습니다

전역 상태 관리

일반적으로 React에서는 데이터는 부모로부터 props를 통해 전달된다.

그러나 컴포넌트를 나누다보면 하나의 어플리케이션 안에 여러 컴포넌트에 전달해줘야 하는 경우 props-drilling 현상이 나타나기도 한다.

• props-drilling이란?

props로 계속해서 자식 컴포넌트에 전달하면 코드가 지저분해진다.

React에서의 상태 관리?

• 기본적으로는 부모의 state를 자식에게 props로 전달해서 사용하고 있다
  • 만약 깊이가 깊어진다면? 5개 밑에 있는 자식에게 state를 전달해야 한다면?
  • 최상위 컴포넌트에서 모든 상태를 정의 및 관리할 수 있을까?

→ 이러한 이유로 전역 상태 관리를 사용합니다 (ex. redux, context api)

contextㄴ상태를 저장하는 저장소라고 생각하자

• 상태를 저장하는 저장소가 없다면 각 상태에 대해서 직접적으로 접근해줘야 한다.
  • F 컴포넌트에 접근할 경우 : Root → A → B → F
  • G 컴포넌트에 접근할 경우 : Root → A → B → E → G
  • J 컴포넌트에 접근할 경우 : Root → H → J

Recoil의 등장 배경