Skip to content

Instantly share code, notes, and snippets.

@somus

somus/mern-serverside-rendering.js

Created June 21, 2016 06:01
Show Gist options
  • Save somus/d24ee72a6dd6f8ae3787bd8186c63658 to your computer and use it in GitHub Desktop.
Save somus/d24ee72a6dd6f8ae3787bd8186c63658 to your computer and use it in GitHub Desktop.
Download ZIP
How server side rendering works in MERN?
Raw
mern-serverside-rendering.js
// Server Side Rendering based on routes matched by React-router.
app.use((req, res) => {
match({
routes,
location: req.url
}, (err, redirectLocation, renderProps) => {
if (err) {
return res.status(500).end('Internal server error');
}
if (!renderProps) {
return res.status(404).end('Not found!');
}
const initialState = {
posts: [],
post: {}
};
const store = configureStore(initialState);
fetchComponentData(store.dispatch, renderProps.components, renderProps.params).then(() => {
const initialView = renderToString(
<Provider store = {store} >
<RouterContext {...renderProps}/>
</Provider>
);
const finalState = store.getState();
res.status(200).end(renderFullPage(initialView, finalState));
}).catch(() => {
res.end(renderFullPage('Error', {}));
});
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment