Redux → SWR(2): SWR로 Redux 대체 가능한가?
·
React
Data fetching library *SWR을 살펴보기 이전에 Data fetching library가 무엇인지 알아봅시다. 2020년부터 React Query 나 SWR 와 같은 data fetching 라이브러리들이 인기를 끌고 있습니다. 1년 동안 받은 깃헙 스타 개수를 기반으로 인기 지수를 측정하는 risingstars의 React Ecosystem을 확인하면 React Query가 9위, SWR이 14위(2023년 기준)로, 여전히 인기를 유지하고 있습니다. Data fetchng library 왜 사용할까요? 이는 우선, 리액트 프로젝트에서 일반적으로 사용하는 상태(state)에 대해 알아보아야 합니다. Local State: 리액트 컴포넌트 안에서만 사용되는 state Global Sta..
Redux → SWR(1): Redux의 한계
·
React
상태관리의 필요성 리액트로 웹 개발 시 프로젝트가 커질 수록 상태(state)관리의 필요성은 커집니다. 상태관리가 제대로 되지 않으면 추적이 어렵고, 에러를 예측할 수 없게 되고 이는 유지보수를 어렵게 만듭니다. 리액트 상태관리를 도와주는 라이브러리는 Redux, Mobx, Recoil 정도가 있으며, 방법의 차이는 있겠지만 이들이 해결하려는 문제는 같습니다. 모든 컴포넌트에 공유 가능한 전역 상태의 정의 각 컴포넌트에서의 전역 상태 접근과 변경 Redux *상태관리 라이브러리의 예시로는 가장 많이 사용되는 Redux로 진행합니다. 상태관리 문제를 해결하는 방법 카운터의 초기상태와 변이방법을 리듀서로 정의합니다. function counter(state = 0, action) { switch (actio..