feat(client-routes): Add react-router-dom for client-side routing

This commit is contained in:
Stuart Taylor
2018-08-01 12:40:44 +01:00
committed by mrugesh mohapatra
parent 5cf5979563
commit 1b18594bd3
13 changed files with 265 additions and 42 deletions

View File

@ -0,0 +1,14 @@
import React from 'react';
const propTypes = {};
function NewArticle() {
return (
<h2>New Article</h2>
);
}
NewArticle.displayName = 'NewArticle';
NewArticle.propTypes = propTypes;
export default NewArticle;

View File

@ -0,0 +1 @@
export { default } from './EditArticle';

View File

@ -0,0 +1 @@
// no-op

View File

@ -0,0 +1,14 @@
import React from 'react';
const propTypes = {};
function Featured() {
return (
<h2>Featured</h2>
);
}
Featured.displayName = 'Featured';
Featured.propTypes = propTypes;
export default Featured;

View File

@ -0,0 +1 @@
export { default } from './Featured';

View File

@ -0,0 +1,14 @@
import React from 'react';
const propTypes = {};
function Latest() {
return (
<h2>Latest</h2>
);
}
Latest.displayName = 'Latest';
Latest.propTypes = propTypes;
export default Latest;

View File

@ -0,0 +1 @@
export { default } from './Latest';

14
news/routes/Show/Show.js Normal file
View File

@ -0,0 +1,14 @@
import React from 'react';
const propTypes = {};
function ShowArticle() {
return (
<h2>Show Article</h2>
);
}
ShowArticle.displayName = 'ShowArticle';
ShowArticle.propTypes = propTypes;
export default ShowArticle;

View File

@ -0,0 +1 @@
export { default } from './Show';

12
news/routes/index.js Normal file
View File

@ -0,0 +1,12 @@
import React from 'react';
import { Route } from 'react-router-dom';
import EditArticle from './EditArticle';
import Featured from './Featured';
export const routes = [
<Route component={Featured} exact={true} path='/' />,
<Route component={EditArticle} path='/new' />
].map(
el => ({ ...el, key: el.props.path })
);

209
package-lock.json generated
View File

@ -7605,8 +7605,7 @@
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
"integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
"dev": true,
"optional": true
"dev": true
},
"json-schema": {
"version": "0.2.3",
@ -11563,7 +11562,8 @@
"lodash.debounce": {
"version": "4.0.8",
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
"integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168="
"integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168=",
"dev": true
},
"lodash.defaults": {
"version": "4.2.0",
@ -15893,9 +15893,9 @@
}
},
"react-bootstrap": {
"version": "0.31.5",
"resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-0.31.5.tgz",
"integrity": "sha512-xgDihgX4QvYHmHzL87faDBMDnGfYyqcrqV0TEbWY+JizePOG1vfb8M3xJN+6MJ3kUYqDtQSZ7v/Q6Y5YDrkMdA==",
"version": "0.32.1",
"resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-0.32.1.tgz",
"integrity": "sha512-RbfzKUbsukWsToWqGHfCCyMFq9QQI0TznutdyxyJw6dih2NvIne25Mrssg8LZsprqtPpyQi8bN0L0Fx3fUsL8Q==",
"requires": {
"babel-runtime": "6.26.0",
"classnames": "2.2.5",
@ -15904,25 +15904,34 @@
"keycode": "2.2.0",
"prop-types": "15.6.0",
"prop-types-extra": "1.1.0",
"react-overlays": "0.7.4",
"react-overlays": "0.8.3",
"react-prop-types": "0.4.0",
"react-transition-group": "2.4.0",
"uncontrollable": "4.1.0",
"warning": "3.0.0"
}
},
"react-codemirror": {
"version": "0.3.0",
"resolved": "https://registry.npmjs.org/react-codemirror/-/react-codemirror-0.3.0.tgz",
"integrity": "sha1-zWvW70WOweA1z9iz/nswyMeIPGw=",
"requires": {
"classnames": "2.2.5",
"codemirror": "5.31.0",
"lodash.debounce": "4.0.8"
},
"dependencies": {
"codemirror": {
"version": "5.31.0",
"resolved": "https://registry.npmjs.org/codemirror/-/codemirror-5.31.0.tgz",
"integrity": "sha512-LKbMZKoAz7pMmWuSEl253G6yyloSulj1kXfvYv+3n3I8wMiI7QwnCHwKM3Zw5S9ItNV28Layq0/ihQXWmn9T9w=="
"react-transition-group": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.4.0.tgz",
"integrity": "sha512-Xv5d55NkJUxUzLCImGSanK8Cl/30sgpOEMGc5m86t8+kZwrPxPCPcFqyx83kkr+5Lz5gs6djuvE5By+gce+VjA==",
"requires": {
"dom-helpers": "3.3.1",
"loose-envify": "1.3.1",
"prop-types": "15.6.2",
"react-lifecycles-compat": "3.0.4"
},
"dependencies": {
"prop-types": {
"version": "15.6.2",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz",
"integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==",
"requires": {
"loose-envify": "1.3.1",
"object-assign": "4.1.1"
}
}
}
}
}
},
@ -16047,6 +16056,11 @@
"deep-equal": "1.0.1"
}
},
"react-lifecycles-compat": {
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
},
"react-media": {
"version": "1.8.0",
"resolved": "https://registry.npmjs.org/react-media/-/react-media-1.8.0.tgz",
@ -16084,28 +16098,167 @@
}
},
"react-overlays": {
"version": "0.7.4",
"resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-0.7.4.tgz",
"integrity": "sha512-7vsooMx3siLAuEfTs8FYeP/lAORWWFXTO8PON3KgX0Htq1Oa+po6ioSjGyO0/GO5CVSMNhpWt6V2opeexHgBuQ==",
"version": "0.8.3",
"resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-0.8.3.tgz",
"integrity": "sha512-h6GT3jgy90PgctleP39Yu3eK1v9vaJAW73GOA/UbN9dJ7aAN4BTZD6793eI1D5U+ukMk17qiqN/wl3diK1Z5LA==",
"requires": {
"classnames": "2.2.5",
"dom-helpers": "3.3.1",
"prop-types": "15.6.0",
"prop-types-extra": "1.1.0",
"react-transition-group": "2.4.0",
"warning": "3.0.0"
},
"dependencies": {
"react-transition-group": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.4.0.tgz",
"integrity": "sha512-Xv5d55NkJUxUzLCImGSanK8Cl/30sgpOEMGc5m86t8+kZwrPxPCPcFqyx83kkr+5Lz5gs6djuvE5By+gce+VjA==",
"requires": {
"dom-helpers": "3.3.1",
"loose-envify": "1.3.1",
"prop-types": "15.6.2",
"react-lifecycles-compat": "3.0.4"
},
"dependencies": {
"prop-types": {
"version": "15.6.2",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz",
"integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==",
"requires": {
"loose-envify": "1.3.1",
"object-assign": "4.1.1"
}
}
}
}
}
},
"react-prop-types": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/react-prop-types/-/react-prop-types-0.4.0.tgz",
"integrity": "sha1-+ZsL+0AGkpya8gUefBQUpcdbk9A=",
"requires": {
"warning": "3.0.0"
}
},
"react-redux": {
"version": "4.4.8",
"resolved": "https://registry.npmjs.org/react-redux/-/react-redux-4.4.8.tgz",
"integrity": "sha1-57wd0QDotk6WrIIS2xEyObni4I8=",
"version": "4.4.9",
"resolved": "https://registry.npmjs.org/react-redux/-/react-redux-4.4.9.tgz",
"integrity": "sha512-3XS7mjTOcvaP2H5OE/LxEgDHRuEyTZxBRlwvXHzNqYkZdYd7Ra98AimWoDSHP9OcLoydjA1ocgiZxxcqeXj0Sw==",
"requires": {
"create-react-class": "15.6.3",
"hoist-non-react-statics": "1.2.0",
"hoist-non-react-statics": "2.5.5",
"invariant": "2.2.2",
"lodash": "4.17.5",
"loose-envify": "1.3.1",
"prop-types": "15.6.0"
},
"dependencies": {
"hoist-non-react-statics": {
"version": "2.5.5",
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
"integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
}
}
},
"react-router": {
"version": "4.3.1",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-4.3.1.tgz",
"integrity": "sha512-yrvL8AogDh2X42Dt9iknk4wF4V8bWREPirFfS9gLU1huk6qK41sg7Z/1S81jjTrGHxa3B8R3J6xIkDAA6CVarg==",
"requires": {
"history": "4.7.2",
"hoist-non-react-statics": "2.5.5",
"invariant": "2.2.4",
"loose-envify": "1.3.1",
"path-to-regexp": "1.7.0",
"prop-types": "15.6.2",
"warning": "4.0.1"
},
"dependencies": {
"hoist-non-react-statics": {
"version": "2.5.5",
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
"integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
},
"invariant": {
"version": "2.2.4",
"resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
"integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
"requires": {
"loose-envify": "1.3.1"
}
},
"isarray": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
"integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
},
"path-to-regexp": {
"version": "1.7.0",
"resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
"integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30=",
"requires": {
"isarray": "0.0.1"
}
},
"prop-types": {
"version": "15.6.2",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz",
"integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==",
"requires": {
"loose-envify": "1.3.1",
"object-assign": "4.1.1"
}
},
"warning": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/warning/-/warning-4.0.1.tgz",
"integrity": "sha512-rAVtTNZw+cQPjvGp1ox0XC5Q2IBFyqoqh+QII4J/oguyu83Bax1apbo2eqB8bHRS+fqYUBagys6lqUoVwKSmXQ==",
"requires": {
"loose-envify": "1.3.1"
}
}
}
},
"react-router-dom": {
"version": "4.3.1",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-4.3.1.tgz",
"integrity": "sha512-c/MlywfxDdCp7EnB7YfPMOfMD3tOtIjrQlj/CKfNMBxdmpJP8xcz5P/UAFn3JbnQCNUxsHyVVqllF9LhgVyFCA==",
"requires": {
"history": "4.7.2",
"invariant": "2.2.4",
"loose-envify": "1.3.1",
"prop-types": "15.6.2",
"react-router": "4.3.1",
"warning": "4.0.1"
},
"dependencies": {
"invariant": {
"version": "2.2.4",
"resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
"integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
"requires": {
"loose-envify": "1.3.1"
}
},
"prop-types": {
"version": "15.6.2",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz",
"integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==",
"requires": {
"loose-envify": "1.3.1",
"object-assign": "4.1.1"
}
},
"warning": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/warning/-/warning-4.0.1.tgz",
"integrity": "sha512-rAVtTNZw+cQPjvGp1ox0XC5Q2IBFyqoqh+QII4J/oguyu83Bax1apbo2eqB8bHRS+fqYUBagys6lqUoVwKSmXQ==",
"requires": {
"loose-envify": "1.3.1"
}
}
}
},
"react-scrolllock": {

View File

@ -118,8 +118,7 @@
"react": "^15.6.2",
"react-addons-css-transition-group": "^15.4.2",
"react-addons-shallow-compare": "^15.4.2",
"react-bootstrap": "^0.31.5",
"react-codemirror": "^0.3.0",
"react-bootstrap": "^0.32.1",
"react-d3": "^0.4.0",
"react-dom": "^15.6.2",
"react-freecodecamp-search": "^2.0.1",
@ -129,6 +128,7 @@
"react-motion": "^0.4.8",
"react-no-ssr": "^1.0.1",
"react-redux": "^4.4.8",
"react-router-dom": "^4.3.1",
"react-test-renderer": "^15.6.2",
"react-youtube": "^7.5.0",
"redux": "^3.7.2",

View File

@ -10,7 +10,7 @@ var __DEV__ = process.env.NODE_ENV !== 'production';
module.exports = {
entry: {
client: './client/index.js',
news: './news/index.js'
news: './news/client.js'
},
devtool: __DEV__ ? 'inline-source-map' : 'source-map',
mode: __DEV__ ? 'development' : 'production',
@ -23,21 +23,18 @@ module.exports = {
},
output: {
filename: __DEV__ ? '[name]-app.js' : '[name]-app-[hash].js',
chunkFilename: __DEV__ ?
'[name]-chunk.js' :
'[name]-chunk-[chunkhash].js',
chunkFilename: __DEV__ ? '[name]-chunk.js' : '[name]-chunk-[chunkhash].js',
path: path.join(__dirname, '/public/js/'),
publicPath: '/js'
},
module: {
rules: [{
test: /\.jsx?$/,
exclude: /node_modules/,
use: [
__DEV__ && 'react-hot-loader',
'babel-loader'
].filter(Boolean)
}]
rules: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
use: [__DEV__ && 'react-hot-loader', 'babel-loader'].filter(Boolean)
}
]
},
plugins: [
new webpack.DefinePlugin({