[Redux] Smart 컴포넌트와 Dumb 컴포넌트

 

Redux용 React 바인딩은 smart and dumb components를 분리하는 아이디어를 채택하였다.

앱의 최상위 컴포넌트(라우트 핸들러같은)만이 Redux와 연관되는 것이 좋다. 그 아래의 컴포넌트들은 우직해야하고 모든 데이터를 props를 통해 전달받아야 한다.

 

	Smart Component	Dumb Component
위치	최상위, 라우트 핸들러	중간과 말단 컴포넌트
Redux와 연관됨	예	아니오
데이터를 읽기 위해	Redux 상태를 구독	props에서 데이터를 읽음
데이터를 바꾸기 위해	Redux 액션을 보냄	props에서 콜백을 부름