Redux

황순은·2021년 5월 17일
0

TIL

목록 보기
7/9
post-thumbnail

Redux는?

스토어를 이용한 상태관리 라이브러리
예측가능한 상태관리 컨테이너.

리액트에서 state는 컴포넌트 안에서 관리하기 때문에 자식끼리 데이터 사용은 불가능하다. 이 경우는 부모로 Lifting State Up을 해야하기 때문에 불편하고 복잡해진다. 이런 복잡성을 해결하기 위해 Redux를 사용한다.

Redux의 세가지의 원칙

  1. Single source of truth ⇒ Store
    단일 진실 공급원 원칙
    동일한 데이터는 항상 같은 곳에서 데이터를 가지고 온다.
  2. State is read-only ⇒ Action
    state는 직접 수정 불가능
    액션 객체를 통해서 새로운 state를 생성해내는 방식
  3. Changes are made with pure functions ⇒ Reducer
    인풋이 같으면 항상 같은 아웃풋을 만들어 낸다.

Store

상태가 관리되는 오직 하나의 공간

Action

자바스크립트 객체, 스토어에게 어플리케이션에 필요한 데이터를 운반하는 역할. 타입을 지정해주고, 필요한 데이터 객체안에 담아준다.

Reducer

현재 상태와 action을 이용해 새로운 상태를 만들어 낸다.

이러한 원칙을 지켜야 하는 이유?

  • Action 객체는 dispatch에게 전달되고, dispatch는 reducer를 호출해서 새로운 state 생성한다.
  • 데이터는 한 방향으로 흘러야 하기 때문이다.

Redux의 장점

  • 상태를 예측 가능하게 만들어 준다.
  • 유지보수
  • 디버깅에 유리하다(action과 state log 기록 시) redux dev tool
  • 순수함수를 사용하기 때문에 테스트를 붙이기 쉽다.
profile
안녕하세요.

0개의 댓글