[React Router] Server Rendering

React Router

Server Rendering

---

기존에 React Router를 사용할 때 browserHistory를 사용했다. 

Router의 Route Component들로 인하여 초기 메인화면에 접속하면 모든 Component들이 만들어지고, 

route되는 경로에 맞는 Component들이 바뀌는 방식이었다. 

이때, 화면을 새로고침 시 해당 URL로 http request가 전송되게 된다. 

처음에 매우 당황스러웠다. 

이를 해결하기 위해, server파일에 다음을 추가해준다.

app.get('*', function (req, res) {
      res.sendfile(path.join(__dirname, '..', '..','home.html'))
    })

서버로 요청되는 모든 요청에 대해서, 기본적으로 'home.html'을 rendering해준다.

Client Refresh -> rendering -> routing(by React Router)

위 과정을 통해 server rendering을 할 수 있다.