React Redux

Core concepts

App 상태가 일반 object라고 생각해보자

이 오브젝트는 단지 setter가 없을 뿐 "model" 과 유사하다. 이는 다른 코드가 상태를 임의로 바꿀 수 없고 재현할 수 없는 버그를 발생할 수 있음. 상태의 내부 어떤 것을 변경하려면 action을 발생시켜야(dispatch)함. Action은 일반 javascript object이고 무슨일이 발생할지 묘사되어 있다. 아래는 샘플이다.

모든 변화를 엑션에 서술해두는 것은 앱에서 앞으로 무슨일이 발생할지 깔끔하게 이해하게 해준다. 만약 어떤 값이 변경되면 우리는 이게 왜 변경됐는지 알 수 있다. 액션은 약간 뭔일이 있었는지의 breadcrumbs(빵부스러기) 같은 존재임. 결론적으로 상태(state)와 action을 함께 묶어두기 위해서 reducer라는 함수를 작성해야 함. 다시 말하면, 어떤 마법같은 것도 아님. 그냥 상태(state)랑 action을 인자로 받아서 앱의 다음 상태(next state)를 반환하는 함수일 뿐임.

큰 앱에서는 이렇게 작성하기 어려우니까 상태의 부분을 관리하는 작은 함수를 작성

그리고 또다른 reducer를 작성

해서 우리 앱 전체 상태를 관리하기 위해 다른 reducer를 작성함.

이게 대충 redux의 전체적인 거, 우리는 redux라는 어떤 api도 아직 이용한거 아님. 몇가지 유틸들 -> 이 패턴을 위한 시설같은.. 그런거에서 오는거임..