[React] Redux #2 | 리덕스의 3가지 규칙

1️⃣ 하나의 애플리케이션 안에는 하나의 스토어

• 키워드 포스팅에서 작성했듯 하나의 애플리케이션 안에는 하나의 스토어가 있어야한다.
• 여러개가 가능하지만, 권장 X
  • 특정 업데이트가 너무 빈번, 애플리케이션의 특정 부분을 완전히 분리시킬 때 여러개!
  • 개발도구를 사용하지 못하게 됨..

 

2️⃣ 상태는 읽기 전용 (불변성 유지)

• 기존의 상태는 건들이지 않고 새로운 상태를 생성하여 업데이트 해주는 방식!
• 개발자 도구를 통해서 뒤로 돌리고 혹은 다시 앞으로 돌릴 수 있다.
• shallow equality 검사 : 내부적으로 데이터가 변경되는 것을 감지하는 검사 방식
• 곧, immutable.js 혹은 immer.js를 사용하여 불변성을 유지하며 상태를 관리하는 방법에 대해 배우게 될 것!

 

3️⃣ 변화를 일으키는 함수, 리듀서는 순수한 함수여야 한다

• 리듀서 함수는 이전 상태와 액션 객체를 파라미터로 받는다.
• 이전 상태는 절대 건드리지 않고, 변화를 일으킨 새로운 상태 객체를 만들어서 반환한다.
• 똑같은 파라미터로 호출된 리듀서 함수는 언제나 똑같은 결과 값을 반환해야한다.

 

💡리덕스를 사용할 때, 이 3가지 사항을 꼭 주의해주기!

• 동일한 인풋 -> 동일한 아웃풋!
• 순수하지 않은 작업 -> 리듀서 함수를 바깥에서 처리! (리덕스 미들웨어를 사용하여,,)
  1. newDate()
  2. 랜덤 숫자 생성
  3. 네트워크 요청 등등..

 

---

Reference

벨로퍼트의 모던 리액트