React 전역상태관리를 리덕스에서 리코일로 바꾼이유!

 

 

 

 

현제 카냐에서 마이페이지를 개발하는 중에 

데스크탑 버전을 먼저 만들고 데스크탑부분에서는 outlet처리를 하여 카테고리별 컴포넌트가 나올수있도록 구성하였다.

 

이 후 미디어쿼리로 모바일 버전을 제작하며 outlet처리한 비지니스로직을 활용하기에 최대한 컴포넌트 재활용을 위해

모바일버전에도 outlet를 살리되 프로필부분을 전역관리해 쓰고자하였다.

 

 

outlet처리한 로직을 모바일로 바꾸다보니 내가 쓴글을 클릭하면 아래와 같이 프로필과 함께 컴포넌트가 나왔다. 

 

그래서 프로필부분을 전역으로 관리해 카테고리 클릭 시 나오지않게 하도록하였다.

 

 

boolean타입만 받아오면 되는 로직이라 이것을 현재 사용하는 상태관리 라이브러리인  리덕스에 추가하기위해서는 

많은 과정을 걸치게된다.

 

[ REDUX 버전 ]

 

  1. 리덕스 폴더에 슬라이스, 스토어 생성

 

2.  슬라이스에 임포트하고 이니셜스테이트, 리듀서, 엑스트라리듀서, export 등 많은 작업을 해주어야함

 

 

3. 스토어에 임포트해서 추가



 

4.  전역 관리할 컴포넌트에 임포트하여 사용

 

간단하게 true, false만 가져오면 되는데 위 의 로직이 너무 복잡하다고 느껴졌다.

 

이를 간단하게 할 방법이없을까 생각하여 리코일을 도입해보았다.

 

[ recoil 버전 ]

1. 리코일 폴더 생성

2.  별도 폴더 생성 후 기본값 추가

 

3. 전역관리 할 컴포넌트에 임포트하여 사용

 

리덕스로 하면 다소 과정이 많은 전역관리가 리코일로 하니 정말 간단하게 로직을 구현할 수 있었다.