/
index.js
73 lines (61 loc) · 2.31 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
/* eslint-disable no-console */
import express from 'express';
import React from 'react';
import { renderToNodeStream } from 'react-dom/server';
import { StaticRouter } from 'react-router-dom';
import { MuiThemeProvider, createMuiTheme } from 'material-ui/styles';
import createPalette from 'material-ui/styles/palette';
import { getLoadableState } from 'loadable-components/server';
import { Provider } from 'react-redux';
import { Helmet } from 'react-helmet';
import App from '../shared/app';
import configureStore from './store';
import { renderHeader, renderFooter } from './render';
import sagas from '../shared/home/sagas';
const createStyleManager = () =>
MuiThemeProvider.createDefaultContext({
theme: createMuiTheme({
palette: createPalette({
type: 'light',
}),
}),
});
const app = express();
app.use('/assets', express.static('./dist'));
app.get('*', async (req, res) => {
const store = configureStore();
const context = {};
const { styleManager, theme } = createStyleManager();
const appWithRouter = (
<MuiThemeProvider styleManager={styleManager} theme={theme}>
<Provider store={store}>
<StaticRouter location={req.url} context={context}>
<App />
</StaticRouter>
</Provider>
</MuiThemeProvider>
);
if (context.url) {
res.redirect(context.url);
return;
}
let loadableState = {};
store.runSaga(sagas).done.then(() => {
const helmet = Helmet.renderStatic();
res.status(200).write(renderHeader(helmet));
const preloadedState = store.getState();
const css = styleManager.sheetsToString();
const htmlSteam = renderToNodeStream(appWithRouter);
htmlSteam.pipe(res, { end: false });
htmlSteam.on('end', () => {
res.write(renderFooter(css, loadableState, preloadedState));
return res.send();
});
});
// Trigger sagas for component to run
// https://github.com/yelouafi/redux-saga/issues/255#issuecomment-210275959
loadableState = await getLoadableState(appWithRouter);
// Dispatch a close event so sagas stop listening after they're resolved
store.close();
});
app.listen(3000, () => console.log('Demo app listening on port 3000'));