props 문법의 한계
state를 하위 컴포넌트에서 그대로 쓰면 에러가 생긴다. 이때 props라는 문법으로 전송하면 마음대로 갖다 쓸 수가 있다. 허락받는 개념이라고 생각하면 된다.
그런데 만약 컴포넌트가 백만 개 중첩되어 있다면 state를 전해주기 위해 props 문법을 과용하게 된다. 그게 불편해서 Redux라는 라이브러리 문법을 사용하는 것이다.
Redux를 설치하면 개발자가 state를 보관할 수 있는 파일을 하나 만들 수 있다. 그럼 여기에 원하는 state를 전부 보관할 수 있게 된다. 그러면 모든 컴포넌트가 이 state를 바로 꺼내다 쓸 수 있다. 이렇게 하면 전체적으로 코드가 간결해진다.
Redux 사용을 위한 기본 세팅 방법은 다음과 같다. 이 부분은 따로 이해할 필요 없이 복사 붙여넣기 해서 쓰면 된다.
컴포넌트 파일에서 체중이라는 변수를 갖다 쓰려면 다음처럼 하면 된다. 이 또한 Redux 라이브러리의 기본 문법이기 때문에 그냥 복사 붙여넣기 해서 쓴다.
상태 관리에 용이
Redux를 사용하지 않았을 때는 몸무게 state가 각각의 컴포넌트에서 변경되어 버그가 생길 수 있다. 그러면 개발자는 모든 컴포넌트를 전부 일일이 뒤져봐야 한다.
Redux를 사용하면 몸무게라는 state를 수정하고 싶을 때 수정 방법을 미리 정의해둘 수 있다.
그러면 컴포넌트들은 필요한 state를 직접 수정하지 않고 Redux에 수정을 요청만 하면 된다. 이렇게 하면 버그가 생겼을 때 Redux 파일만 살펴보면 되기 때문에 상태 관리가 훨씬 편해지는 것이다. 이로 인해 큰 프로젝트를 진행할 때 Redux는 거의 필수적으로 쓰인다.
실제 문법은 이런 식으로 사용된다. 이런 함수를 reducer라고 부른다. state를 수정하는 방법이라고 보면 된다. 수정뿐만 아니라 꺼내 쓰는 경우에도 reducer를 활용한다. 또한 컴포넌트에서 state 수정을 요청할 때는 dispatch를 쓴다. 여기에 어떤 요청(증가, 감소...)을 할지 요청명을 잘 적어준다.
출처: 코딩애플, React 입문자들이 알아야할 Redux 쉽게설명 (8분컷)
