리덕스

리덕스란? 자바스크립트 애플리케이션에서 상태를 효율적으로 관리할 수 있게 도와주는 도구입니다.
복잡한 상태관리가 이루어지는 SPA(Single Page Application)에서 특히 유용하게 사용됩니다.

리덕스를 사용하는 이유

리액트를 사용하면서, 상태 관리를 하는 것은 매우 중요한 요소 중 하나입니다. 리액트로 만들 수 있는 단일 페이지 애플리케이션(SPA, Single Page Application)는 data 혹은 UI의 변화가 복잡, 다양해지는 경우가 많아집니다. 그에 따라 단일 페이지를 이루는 컴포넌트들의 데이터 교류 또한 복잡해지기 때문에 이를 효율적으로 관리할 방법이 필요합니다. 리덕스는 이러한 복잡한 상태 관리를 효율적으로 할 수 있게 도와주는 도구입니다.

• 기존에 사용하던 state 관리 방식
  
  만약 최하위 자식요소가 부모요소의 어떠한 상태변화를 인지시켜야 하는 상황이라면 최상위 부모요소는 하위 자식요소헤게 props로 상태와 상태를 변경하는 method를, 또 그 자식요소는 다음 자식요소에게 props로 상태와 상태를 변경하는 method를 이런식으로 상태관리를 하다보면 프로젝트의 구조가 복잡해질수록 기하급수적으로 해야 할 일이 늘어납니다.

• 리덕스 도입
  
  리덕스는 쉽게 설명하면 상태관리의 로직을 컴포넌트 밖에서 처리하는 것입니다.
  리덕스를 사용하면 스토어(store)라는 객체 내부에 상태를 담게 됩니다. 이를 사용하면 다음구조로 프로젝트를 관리할 수 있습니다.

Redux Keywords

---

Action : 상태변화를 일으킬 때 참조하는 객체
Dispatch : 액션을 스토어에 전달하는 것을 의미
Reducer : 상태를 변화시키는 로직이 있는 함수
Subscribe : 스토어 값이 필요한 컴포넌트는 스토어를 구독
Store : 애플리케이션의 상태 값들을 내장

리덕스 규칙

스토어는 단 한 개

스토어는 언제나 단 한개여야합니다.
스토어를 여러 개 생성해서 상태를 관리하면 안됩니다. 그 대신 리듀서를 여러 개 만들어서 관리할 수 있습니다.

state는 읽기 전용

리덕스의 상태, state값은 읽기 전용입니다.

이 값은 절대로 직접 수정하면 안된다. 그렇게 하면 리덕스의 구독 함수를 제대로 실행하지 않거나

컴포넌트의 리렌더링이 되지 않을 수 있습니다.
상태를 업데이트할 때는 언제나 새 상태 객체를 만들어서 넣어 주어야 합니다.