파피루스

[React] Redux 입문 본문

Today I Learned

[React] Redux 입문

떼굴펜 2024. 5. 22. 17:14

사용 목적 : 전역 상태 관리

 

단점 

1. 복잡하다 + 러닝커브가 있다.

2. 아주 간단한 상태 관리를 위해서도, 초기 작성해야하는 코드 량이 많다.

 

단점 개선을 위한 라이브러리

1. Recoil, Zustand : 쉽게 쓸 수 있도록 개선

2. React Query : 클라이언트 상태 관리에서 비동기 통신 작업이 어려워 (코드 양이 많음) 서버 상태와 실시간 동기화가 어렵다는 단점을 개선/개량하기 위함 + 서버 데이터 캐싱은 부가적인 장점

3. Context Api : 리액트 라이브러리만으로 비동기 

 

특징

1. 단방향 데이터 흐름 (flux 아키텍쳐처럼 단방향 데이터 흐름이다.)

2. 의도된 복잡함(까다로움) -> 데이터를 엄격하게 변경하기 위해 (유지보수와 예측가능성을 위해서)

3. 배우기 조금 까다로움

 

핵심개념

- Redux 상태를 저장소에 저장하고, CRUD가 전부입니다.

- 저장소는 store, CUD는 reducer, r은 useSelector 가 한다.

 

Store : 상태 저장소

- 앱 전체에 걸쳐 하나만 생성해서 사용하는 것이 일반적이다.

- 저장소 내 공간은 리듀서 단위로 구분하는 것이 일반적


Reducer : 저장소에 있는 상태를 변경하는 함수