SSR with Create React App v2

Core concepts

Structure

require('babel-register')({ ignore: /\/(build|node_modules)\//, presets: ['react-app'] })
require('ignore-styles')

Setting up Routing

ReactDOM.render(
<Provider store={store}>
<BrowserRouter>
<App />
</BrowserRouter>
</Provider>
, document.getElementById('root')
)
const context = {}
const store = configureStore()
const markup = renderToString(
<Provider store={store}>
<StaticRouter
location={req.url}
context={context}
>
<App/>
</StaticRouter>
</Provider>
)
if (context.url) {
// Somewhere a `<Redirect>` was rendered
redirect(301, context.url)
} else {
// we're good, send the response
const RenderedApp = htmlData.replace('{{SSR}}', markup)
res.send(RenderedApp)
}

Testing

Conclusion

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store