-
Notifications
You must be signed in to change notification settings - Fork 0
/
server.js
76 lines (64 loc) · 2.71 KB
/
server.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
74
75
76
import express from 'express';
import path from 'path';
import webpack from 'webpack';
import webpackDevMiddleware from 'webpack-dev-middleware';
import webpackHotMiddleware from 'webpack-hot-middleware';
var config = require('./webpack.config');
import React from 'react';
import ReactDom from 'react-dom/server';
import { RoutingContext, match } from 'react-router';
import createLocation from 'history/lib/createLocation';
import routes from './src/shared/routes';
import {createStore, combineReducers} from 'redux';
import {Provider} from 'react-redux';
import * as reducers from './src/shared/reducers'
let app = express();
const port = process.env.PORT || 3000;
var compiler = webpack(config)
app.use(webpackDevMiddleware(compiler, { noInfo: true, publicPath: config.output.publicPath }))
app.use(webpackHotMiddleware(compiler))
app.use(express.static(path.join(__dirname, 'dist')));
app.use((request, response) => {
const location = createLocation(request.url);
const reducer = combineReducers(reducers);
const store = createStore(reducer);
match({routes, location}, (err, redirectLocation, renderProps) => {
if(err) return response.status(500).end('Internal server error.');
if(!renderProps) return response.status(404).end('Not found.');
const InitialComponent = (
<Provider store={store}>
<RoutingContext {...renderProps} />
</Provider>
);
const componentHTML = ReactDom.renderToString(InitialComponent);
const initialState = store.getState();
const markup = `
<!doctype html>
<html>
<head>
<title>Black Jack</title>
<meta name="description" content="Classic game of black jack." />
<meta name="author" content="Walker Randolph Smith" />
<link rel="icon" type="image/png" href="profile.png" />
<link rel="apple-touch-icon" sizes="57x57" href="apple-icon-57x57.png" />
<link rel="apple-touch-icon" sizes="72x72" href="apple-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="114x114" href="apple-icon-114x114.png" />
<link rel="apple-touch-icon" sizes="144x144" href="apple-icon-144x144.png" />
<link rel="stylesheet" type="text/css" href="assets/deck.css">
</head>
<body>
<div id="app">${componentHTML}</div>
<script>
window.__INITIAL_STATE__ = ${JSON.stringify(initialState)}
</script>
<script src="/bundle.js"></script>
</body>
</html>
`;
response.end(markup);
})
});
app.listen(port, (error) => {
if (error) console.error(error);
else console.info(`==> 🌎 Listening on port ${port}. Open up http://localhost:${port}/ in your browser.`);
})