redux
Redux는 자바스크립트 앱을 위한 예측 가능한 상태 컨테이너이다.
일관적으로 동작하고, 서로 다른 환경(서버, 클라이언트, 네이티브)에서 작동하고, 테스트하기 쉬운 앱을 작성하도록 도와준다.
다시말해 React에서 부족한 상태를 관리하기 위한 도구로 Redux를 사용한다.
npm install --save redux
Redux는 위와 같이 설치할 수 있다.
Redux는 3가지 특징이 있다.
1. 여러 state를 하나의 store에 저장할 수 있다.
서버로부터 가져온 상태는 시리얼라이즈되거나(serialized) 수화되어(hydrated) 전달되며
클라이언트에서 추가적인 코딩 없이도 사용할 수 있다.
또한 하나의 상태 트리만을 가지고 있기 때문에 디버깅에도 용이하다.
2. State는 읽기 전용이다.
뷰나 네트워크 콜백에서 결코 상태를 직접 바꾸지 못 한다.
기록을 남길 수 있고, 시리얼라이즈할 수 있으며, 저장할 수 있고, 이후에 테스트나 디버깅을 위해서 재현하는 것도 가능하다.
3.변화는 순수 함수로 작성되어야 한다.
. Redux의 액션은 디스패치에 의해 실행되고, 동일한 인자값은 항상 동일한 결과를 반환한다.
액션은 단순 객체로 이벤트가 발동되었을 때만 작동하며, 액션 생성기라는 액션을 만들어내는 함수를 생성해야 한다.
Redux는 어디에 사용하면 좋을까?
애플리케이션의 여러 곳에서 공유되는 데이터에는 Redux를 사용하는 것이 좋고,
온라인 쇼핑몰 같은 다른 페이지를 갔다가 돌아왔을 때 그 상태를 유지할 필요가 있는 데이터에도 적용하는 것이 좋다.
'FRONT-END' 카테고리의 다른 글
[Material-ui] 시작하기 (0) | 2020.07.06 |
---|---|
[Redux] 리액트 - 리덕스 적용 (0) | 2020.07.02 |
[React]React Core Concept (0) | 2020.05.25 |
DOM (0) | 2020.04.24 |
HTML / CSS (0) | 2020.04.23 |