본문 바로가기

React/메모 프로젝트

#3. Reducer

React-Router란?



  •  mapStateToProps : 컴포넌트의 props에 매핑시켜준다. ( isLoggedIn에 값을 넣어 줌 )

  • Apache와 같은 웹서버에서는 url에 맞는 파일을 제공하여 여러 페이지를 구현하는 것과 달리, 어떤 경로로 들어오든 간에 똑같은 html파일과 자바스크립트 파일을 제공한다. 

 여기서 제공되는 js파일 안에는 모든 컴포넌트들이 담겨있고  url에 따라 지정된 컴포넌트들을 랜더링 해준다. 즉, 페이지를 한번 로드한 



Smart Component(똑똑한)와 Dumb Component(멍청한)


 

 Smart Component

 Dumb Component 

 위치

 최상위, 라우트 핸들러

 중간과 말단 컴포넌트 

 Redux와 연관됨

 Yes

 No 

 데이터를 읽기 위해

 Redux 상태를 구독(?)

 props에서 데이터를 받음 

 데이터를 바꾸기 위해

 Redux 액션을 보냄(?) 

 props에서 콜백을 부름 


  • Smart Component : 똑똑한 컴포넌트는 action과 관계가 있음, css나 DOM을 가지고 있지 않음

  • Dumb Component : 멍청한 컴포넌트는 상태만을 가지고 있음



'React > 메모 프로젝트' 카테고리의 다른 글

#3. Reducer  (0) 2017.06.05
#2. React-Router  (0) 2017.06.05
#1. 서버 구성 - 라우팅  (0) 2017.06.03