로딩
요청 처리 중입니다...

[컨퍼런스] FEConf 2021: 상태관리, 이제 Recoil 하세요

 [컨퍼런스] FEConf 2021: 상태관리, 이제 Recoil 하세요

Recoil 이란? Recoil 이란 페이스북에서 만든 전역 상태 라이브러리 입니다.

React의 내부상태만 이용하고 작은 Atom 단위로 관리하며, 상태가 변경되면 atom을 참조하는 컴포넌트들만 리렌더링된다는 특징이 있습니다. 또한, Facebook에서 만들었기 때문에, React의 향후 호환성부분이나 성능 이점에 대해서도 기대해볼 수 있습니다.

Atom 써보기 예를 들어, Modal 컴포넌트를 구현한다고 해봅시다. Modal 을 열고닫는 기능 자체는 아주 간단하지만, 실제로 열고 닫는 이벤트가 각각 다른 컴포넌트에서 이루어지기 때문에, 전역 상태를 활용할 수 있습니다.

아래 코드는 상태를 정의하는 방법인데요, atom이라는 함수에 key와 기본값을 설정해주면 됩니다. 이후에, 아래처럼 Recoil 에서 제공하는 state를 다루는 함수들에 조금전에 정의해둔 atom을 넣으면, 바로 React의 hooks 처럼 사용할 수 있습니다.

이때, Recoil 에서는 읽기전용함수와 쓰기전...

# FEConf # React # Recoil # 컨퍼런스