상태를 직접 변경하면 안된다
상태를 직접 바꾸는것은 컴포넌트로 하여금 리렌더링 되는것을 막거나 Redux-dex-tool의 시간여행 기능을 작동하지 못하게 할 수 있다.
- 복사 한 값을 변경하는것은 괜찮다.
- Immer 라이브러리를 사용하고 있다면 실제 값은 변경되지 않기에 직접 변경하는 로직을 작성해도 괜찮다.( 안전하게 변화를 추적하고 내부에서 불변 업데이트된 값들을 만들어낸다. )
리듀서들은 부수효과를 가지면 안된다.
리듀서의 함수들은 state와 action인자들에만 의존해야 하며, 그 인자들을 기반으로 계산한 새로운 상태만을 반환해야 한다.
절대로 비동기 로직, 랜덤값 생성(Date.now, Math.random), 리듀서 밖의 값 변경, 또는 리듀서 함수의 외부 스코프에 있는 것들을 변경할 수 있는 코드를 실행해도 안된다.
직렬화가 불가능한 값들을 상태나 액션에 넣지 마라
Promise, Symbol, Map/Set, Function, Class 와 같은 직렬화가 불가능한 것들을 리덕스 스토어의 상태나 디스패치되는 액션에 넣는것은 피해야 한다.
하나의 어플리케이션은 오직 하나의 스토어를 가져야 한다
표준 리덕스 어플리케이션은 오직 하나의 리덕스 스토어 인스턴스를 가져야 하며, 이는 어플리케이션 전체에서 사용된다.
리듀서에 가능한 많은 로직을 넣자
가능하면 새로운 상태를 계산하는 로직을, 액션을 준비하고 디스패치하는 코드가 아니라 해당 로직에 적합한 리듀서를 많이 넣도록 하자.
리듀서는 순수함수이기 때문에 항상 테스트하기가 쉽다. const result = redeucer(testState, action)만 호출하면 되고, 결과를 원하는 값으로 단언하면 된다. 따라서 리듀서 안에 로직을 많이 넣을 수록 테스트하기 쉬운 로직이 된다.
리덕스의 상태는 항상 불변 업데이트 규칙을 따라야 한다. 리듀서 안에서는 해당 규칙을 따라야 한다는것은 다들 알겠지만, 새로운 상태가 리듀서 밖에서 계산될 경우 이 규칙을 따라야 하는지에 대해서는 잘 모른다. 이는 우발적인 상태 변경이나, 심지어 리덕스 스토어에서 값을 읽어서 액션 안에 바로 전달하는 것과 같은 실수로 이어지 쉽다. 실수를 방지하기 위해 리듀서 안에서 모든 상태변경 로직을 수행하자.
Immer를 사용한다면 리듀서에서 불변 업데이트 로직을 작성하기 쉽고, Immer 가 상태를 얼릴 뿐 아니라 우발적인 상태 변경을 잡아낼 것이다.
ReduxDevTool로 시간여행을 통해서 실행취소, 다시 실행을 할 수 있다. 또한 리듀서들의 핫 리로딩은 기존의 액션들로 새로운 리듀서를 재실행 할 수 있다.
올바른 액션을 가졌지만 리듀서에 버그가 있다면, 리듀서의 버그를 고치고 핫 리로드를 해서 제대로 된 상태값을 얻어 낼 수 있다.
액션 자체가 잘못되었다면, 액션이 디스패치되는 단계를 다시 실행해야 하기에 리듀서에 더 많은 로직이 있는것이 디버깅하기 쉽다.
리듀서 안에 로직을 넣으면 전체 코드에 로직이 흩어지는 대신 업데이트 로직이 어디있는지 바로 알 수 있다.
