Skip to content

Commit d1ff8f7

Browse files
styflestyfle
committed
Minor changes to routes
1 parent 41918c4 commit d1ff8f7

File tree

3 files changed

+21
-23
lines changed

3 files changed

+21
-23
lines changed

‎src/browser.tsx‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,12 @@
11
import * as React from 'react';
22
import * as ReactDOM from 'react-dom';
3-
import AppComponent from './components/app';
4-
import * as routes from './routes';
3+
import App from './components/app';
4+
import { propsUrl, containerId } from './routes';
55

6-
fetch(routes.props)
6+
fetch(propsUrl)
77
.then(o => o.json())
8-
.then((data: any) => {
9-
const props = data as AppProps;
10-
const NewApp = React.createFactory(AppComponent);
11-
const app = NewApp(props);
12-
const el = document.getElementById(routes.containerId);
8+
.then((props: AppProps) => {
9+
const app = (<App {...props} />);
10+
const el = document.getElementById(containerId);
1311
ReactDOM.render(app, el);
1412
});

‎src/routes.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
export const react = '/react.js';
2-
export const reactdom = '/react-dom.js';
3-
export const styles = '/style.css';
4-
export const bundle = '/bundle.js';
5-
export const props = '/app-props.json';
1+
export const reactUrl = '/react.js';
2+
export const reactDomUrl = '/react-dom.js';
3+
export const stylesUrl = '/style.css';
4+
export const bundleUrl = '/bundle.js';
5+
export const propsUrl = '/app-props.json';
66
export const containerId = 'content';

‎src/server.tsx‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import * as React from 'react';
44
import * as ReactDOMServer from 'react-dom/server';
55
import * as fs from 'fs';
66
import AppComponent from './components/app';
7-
import {getItems} from './db';
7+
import { getItems } from './db';
88
import * as routes from './routes';
99

1010
const NewApp = React.createFactory(AppComponent);
@@ -26,43 +26,43 @@ http.createServer((req, res) => {
2626
<meta name="viewport" content="width=device-width, initial-scale=1.0">
2727
<link href="data:image/x-icon;base64,AAABAAEAEBAAAAAAAABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB3qoEAd6r/AHeqgQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB3qoEAd6r/AHeqgQAAAAAAAAAAAAAAAAAAAAAAeaz/AMz//wCj1v8Aeaz/AHmsQAAAAAAAAAAAAHmsQAB5rP8Ao9b/AMz//wB5rP8AAAAAAAAAAAAAAAAAAAAAAHyv/wi66/8Lz///CLrr/wB8r/8AfK+/AHyvvwB8r/8Iuuv/C8///wi66/8AfK//AAAAAAAAAAAAAAAAAAAAAAB/soEOqdn/G9L//xvS//8b0v//FL3s/xS97P8b0v//G9L//xvS//8Oqdn/AH+ygQAAAAAAAAAAAAAAAAAAAAAAgrVAAIK1/y3W//8t1v//Ldb//y3W//8t1v//Ldb//y3W//8t1v//AIK1/wCCtUAAAAAAAAAAAAAAAAAAAAAAAAAAAACGuf8xxu3/Qdv//0Hb//9B2///Qdv//0Hb//9B2///Mcbt/wCGuf8AAAAAAAAAAAAAAAAAAAAAAAAAAACKvUAAir3/Qsru/1jg//9Y4P//WOD//1jg//9Y4P//WOD//0LK7v8Air3/AIq9QAAAAAAAAAAAAAAAAACOwUAAjsH/U8/v/2/l//9v5f//b+X//2/l//9v5f//b+X//2/l//9v5f//U8/v/wCOwf8AjsFAAAAAAACTxoEAk8b/ZNXx/4Xr//+F6///hev//4Xr//+F6///hev//4Xr//+F6///hev//4Xr//9k1fH/AJPG/wCTxoEAl8r/3f///734//+c8P//nPD//5zw//+c8P//nPD//5zw//+c8P//nPD//5zw//+c8P//vfj//93///8Al8r/AJvOgQCbzv8Am87/AJvO/wCbzv9YyOf/sPX//7D1//+w9f//sPX//1jI5/8Am87/AJvO/wCbzv8Am87/AJvOgQAAAAAAAAAAAAAAAAAAAAAAAAAAAJ/S/8L5///C+f//wvn//8L5//8An9L/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACi1YFpz+r/0vz//9L8//9pz+r/AKLVgQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAKXY/93////d////AKXY/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACo24Fv1O3/b9Tt/wCo24EAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAKrd/wCq3f8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAx+MAAMPDAADAAwAAwAMAAOAHAADgBwAA4AcAAMADAAAAAAAAAAAAAAAAAAD4HwAA+B8AAPw/AAD8PwAA/n8AAA==" rel="icon" type="image/x-icon" />
2828
<title>React Example</title>
29-
<link rel="stylesheet" href="${routes.styles}" />
29+
<link rel="stylesheet" href="${routes.stylesUrl}" />
3030
</head>
3131
<body>
3232
<div id="${routes.containerId}">${reactHtml}</div>
33-
<script src="${routes.react}"></script>
34-
<script src="${routes.reactdom}"></script>
35-
<script src="${routes.bundle}"></script>
33+
<script src="${routes.reactUrl}"></script>
34+
<script src="${routes.reactDomUrl}"></script>
35+
<script src="${routes.bundleUrl}"></script>
3636
</body>
3737
</html>`;
3838
res.setHeader('Content-Type', 'text/html');
3939
res.end(pageHtml)
40-
} else if (req.url === routes.props) {
40+
} else if (req.url === routes.propsUrl) {
4141
const items = getItems();
4242
const props = {items: items};
4343
res.setHeader('Content-Type', 'application/json');
4444
res.end(JSON.stringify(props));
45-
} else if (req.url === routes.react) {
45+
} else if (req.url === routes.reactUrl) {
4646
res.setHeader('Content-Type', 'text/javascript');
4747
res.setHeader('Cache-Control', 'public, max-age=86400');
4848
fs.readFile(`./node_modules/react/dist/react${isProd ? '.min.js' : '.js'}`, (err, data) => {
4949
if (err) { console.error(err); }
5050
res.end(data);
5151
});
52-
} else if (req.url === routes.reactdom) {
52+
} else if (req.url === routes.reactDomUrl) {
5353
res.setHeader('Content-Type', 'text/javascript');
5454
res.setHeader('Cache-Control', 'public, max-age=86400');
5555
fs.readFile(`./node_modules/react-dom/dist/react-dom${isProd ? '.min.js' : '.js'}`, (err, data) => {
5656
if (err) { console.error(err); }
5757
res.end(data);
5858
});
59-
} else if (req.url === routes.styles) {
59+
} else if (req.url === routes.stylesUrl) {
6060
res.setHeader('Content-Type', 'text/css');
6161
fs.readFile('./src/style.css', (err, data) => {
6262
if (err) { console.error(err); }
6363
res.end(data);
6464
});
65-
} else if (req.url === routes.bundle) {
65+
} else if (req.url === routes.bundleUrl) {
6666
res.setHeader('Content-Type', 'text/javascript');
6767
fs.readFile('./dist/browser.js', (err, data) => {
6868
if (err) { console.error(err); }

0 commit comments

Comments
 (0)