feat(client-routes): Add react-router-dom for client-side routing
This commit is contained in:
committed by
mrugesh mohapatra
parent
5cf5979563
commit
1b18594bd3
14
news/routes/EditArticle/EditArticle.js
Normal file
14
news/routes/EditArticle/EditArticle.js
Normal 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;
|
1
news/routes/EditArticle/index.js
Normal file
1
news/routes/EditArticle/index.js
Normal file
@ -0,0 +1 @@
|
||||
export { default } from './EditArticle';
|
1
news/routes/Editor/index.js
Normal file
1
news/routes/Editor/index.js
Normal file
@ -0,0 +1 @@
|
||||
// no-op
|
14
news/routes/Featured/Featured.js
Normal file
14
news/routes/Featured/Featured.js
Normal 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;
|
1
news/routes/Featured/index.js
Normal file
1
news/routes/Featured/index.js
Normal file
@ -0,0 +1 @@
|
||||
export { default } from './Featured';
|
14
news/routes/Latest/Latest.js
Normal file
14
news/routes/Latest/Latest.js
Normal 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;
|
1
news/routes/Latest/index.js
Normal file
1
news/routes/Latest/index.js
Normal file
@ -0,0 +1 @@
|
||||
export { default } from './Latest';
|
14
news/routes/Show/Show.js
Normal file
14
news/routes/Show/Show.js
Normal 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;
|
1
news/routes/Show/index.js
Normal file
1
news/routes/Show/index.js
Normal file
@ -0,0 +1 @@
|
||||
export { default } from './Show';
|
12
news/routes/index.js
Normal file
12
news/routes/index.js
Normal 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
209
package-lock.json
generated
@ -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": {
|
||||
|
@ -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",
|
||||
|
@ -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({
|
||||
|
Reference in New Issue
Block a user