글로벌 스테이트(global state)

사이트를 만들다 보면 하나의 state가 여러 페이지에서 필요한 경우가 있다. 예를들면 isLogined 같은 state는 게시글 목록이나 결제 컴포넌트 같이 여러가지 컴포넌트에서 사용된다. 이때 매번 props drilling으로 내려주는 것이 아니라 글로벌스테이트를 사용할 수 있다.
이런 전역상태관리(global state) 툴로는 context-Api, Redux, Recoil등이 있다.

Context api

context api 를 사용하면 부모폴더에서 자식폴더에 props를 넘겨주지 않고도 다른 폴더에서 사용할 수 있다.

Context 는 React 에서 제공하는 createContext 를 사용해서 생성할 수 있다.최상위 컴포넌트 (app.tsx) 에서 모든 컴포넌트로 전달해줄 State 를 담아주는 Context를 설정한다.

context-api의 단점은, 업데이트가 되지 않은 state에도 불필요한 리렌더가 일어나게 된다. 이를 보완하여 나온것이 Recoil이다.
Recoil은 state 부분만 리렌더하며, context-api보다 사용법이 간단하다.

redux

리액트에서 상태관리 관련 제일 유명한 라이브러리중 하나라고 할 수있다.
업데이트를 수동으로 추적한다.
(어렵고 비효율적)

mobx

전역 상태관리 라이브러리로 observable 사용하여 모든 변경사항을 자동으로 추적한다.

swr

swr은 데이터를 가져오기 위한 리액트 훅스이다.
캐시로 받아온 데이터를 오래된 순서대로 리턴하고 패치후 마지막 업데이트 데이터를 다시 리턴한다.