FrontEngineer JungBam

import { RecoilRoot } from 'recoil'; RecoilRoot는 Provider와 비슷한 개념으로 Recoil을 사용하는 최상위 컴포넌트를 덮어서 그 컴포넌트 하위 컴포넌트들이 Recoil을 사용할 수 있게 해주는 친구다. 소규모 프로젝트에서는 그냥 RecoilRoot로 index를 덮으면 될 것 같다. 근데 공식문서를 보면 RecoilRoot가 중첩이 된다면 가장 안쪽의 RecoilRoot가 다른 값들을 먹는 값이 된다고 하는데 이게 어떤 것인지 한번 찾아봐야겠다..

React 앱을 만들고 Recoil을 사용하기 위해서는 설치를 해야한다.ㅣ npm install recoil Atom은 쉽게 말하면 state 값이다. Recoil을 사용하기 위해서는 atom을 생성해줘야 하는데 atom은 아래와 같이 생성하면 된다. 이렇게 생성된 atom은 atom의 값을 읽는 컴포넌트들이 이 atom을 바라보게 한다. => 바라본다라는 것은 atom의 변화를 감지하면 해당 컴포넌트들은 리렌더링 한다는 것이다. import { atom } from "recoil"; export const recoilAtom = atom({ key : 'RECOIL_ATOM', default: 0 })