+
+ Home
+
-
);
}
-export default Home;
+export default HomeRoute;
diff --git a/shared/components/DemoApp/AsyncHomeRoute/__tests__/HomeRoute.test.js b/shared/components/DemoApp/AsyncHomeRoute/__tests__/HomeRoute.test.js
new file mode 100644
index 00000000..8e9ba931
--- /dev/null
+++ b/shared/components/DemoApp/AsyncHomeRoute/__tests__/HomeRoute.test.js
@@ -0,0 +1,21 @@
+/* eslint-disable import/no-extraneous-dependencies */
+
+import React from 'react';
+import { shallow } from 'enzyme';
+
+import HomeRoute from '../HomeRoute';
+
+describe('{safeConfigGet(['welcomeMessage'])}
+{config('welcomeMessage')}
This starter kit contains all the build tooling and configuration you @@ -15,8 +18,8 @@ function Home() { minimal project set up allowing you to make your own architecture decisions (Redux/Mobx etc).
- +Hello world!
This starter kit contains all the build tooling and configuration you need to kick off your next universal React project, whilst containing a minimal project set up allowing you to make your own architecture decisions (Redux/Mobx etc).
- +LOADING...
; + } + const { title, body, userId } = singlePost; + return ( +
+
+ );
+ }
+}
+export const SINGLE_POST_QUERY = gql`
+ query singlePost($id: Int!) {
+ singlePost(id: $id) {
+ id
+ title
+ userId
+ body
+ }
+ }
+`;
+export default graphql(SINGLE_POST_QUERY, {
+ options: props => ({
+ variables: {
+ id: props.match.params.id,
+ },
+ }),
+})(Post);
+
+Post.propTypes = {
+ data: shape({
+ loading: bool.isRequired,
+ singlePost: shape({
+ title: string,
+ body: string,
+ userId: number,
+ }),
+ }).isRequired,
+};
diff --git a/shared/components/DemoApp/AsyncPostsRoute/Post/__tests__/Post.test.js b/shared/components/DemoApp/AsyncPostsRoute/Post/__tests__/Post.test.js
new file mode 100644
index 00000000..e43d180a
--- /dev/null
+++ b/shared/components/DemoApp/AsyncPostsRoute/Post/__tests__/Post.test.js
@@ -0,0 +1,27 @@
+/* eslint-disable import/no-extraneous-dependencies */
+
+import React from 'react';
+import { shallow } from 'enzyme';
+
+import { Post } from '../Post';
+
+const data = {
+ loading: false,
+ singlePost: {
+ id: 1,
+ title: 'hi',
+ body: 'boo',
+ userId: '3',
+ },
+};
+
+describe('
+
+ + By User {userId} + +
+ + {title} +
++ {body} +
++ + By User {userId} + +
+
+`;
diff --git a/shared/components/DemoApp/AsyncPostsRoute/Post/index.js b/shared/components/DemoApp/AsyncPostsRoute/Post/index.js
new file mode 100644
index 00000000..195b93ec
--- /dev/null
+++ b/shared/components/DemoApp/AsyncPostsRoute/Post/index.js
@@ -0,0 +1,7 @@
+import { asyncComponent } from 'react-async-component';
+
+export default asyncComponent({
+ resolve: () => System.import('./Post'),
+ ssrMode: 'boundary',
+ name: 'Post',
+});
diff --git a/shared/components/DemoApp/AsyncPostsRoute/Post/singlePost.graphql b/shared/components/DemoApp/AsyncPostsRoute/Post/singlePost.graphql
new file mode 100644
index 00000000..f70dc3b3
--- /dev/null
+++ b/shared/components/DemoApp/AsyncPostsRoute/Post/singlePost.graphql
@@ -0,0 +1,8 @@
+query singlePost($id: Int!) {
+ singlePost(id: $id) {
+ id
+ title
+ userId
+ body
+ }
+}
diff --git a/shared/components/DemoApp/AsyncPostsRoute/Posts.js b/shared/components/DemoApp/AsyncPostsRoute/Posts.js
new file mode 100644
index 00000000..c368e54f
--- /dev/null
+++ b/shared/components/DemoApp/AsyncPostsRoute/Posts.js
@@ -0,0 +1,60 @@
+/* eslint-disable react/prefer-stateless-function */
+import React, { Component } from 'react';
+import { shape, bool, object } from 'prop-types';
+import { gql, graphql } from 'react-apollo';
+import Link from 'react-router-dom/Link';
+import Helmet from 'react-helmet';
+
+// import POSTS_LIST_QUERY from './postList.graphql';
+
+class Posts extends Component {
+ render() {
+ const { data: { loading, postList } } = this.props;
+ if (loading) {
+ return Loading...;
+ }
+ return (
+
+
+ + By User + 3 + +
++ hi +
++ boo +
++ + By User + 3 + +
+
+ );
+ }
+}
+
+Posts.propTypes = {
+ data: shape({
+ loading: bool,
+ postList: object,
+ }).isRequired,
+};
+export const POSTS_LIST_QUERY = gql`
+ query {
+ postList {
+ posts {
+ id
+ title
+ body
+ userId
+ }
+ }
+ }
+`;
+export default graphql(POSTS_LIST_QUERY)(Posts);
diff --git a/shared/components/DemoApp/AsyncPostsRoute/index.js b/shared/components/DemoApp/AsyncPostsRoute/index.js
new file mode 100644
index 00000000..6d18b43d
--- /dev/null
+++ b/shared/components/DemoApp/AsyncPostsRoute/index.js
@@ -0,0 +1,15 @@
+import React from 'react';
+import Route from 'react-router-dom/Route';
+import Switch from 'react-router-dom/Switch';
+import Post from './Post';
+import Posts from './Posts';
+
+const AsyncPostsRoute = () =>
+
+
+ -
+ {postList.posts.map(post =>
+
-
+ ++
+ {post.title} +
++ {post.body} +
+
+ Read more... + ,
+ )}
+
+
+
+
;
+
+export default AsyncPostsRoute;
diff --git a/shared/components/DemoApp/AsyncPostsRoute/postList.graphql b/shared/components/DemoApp/AsyncPostsRoute/postList.graphql
new file mode 100644
index 00000000..2d3d003e
--- /dev/null
+++ b/shared/components/DemoApp/AsyncPostsRoute/postList.graphql
@@ -0,0 +1,10 @@
+query {
+ postList {
+ posts {
+ id
+ title
+ body
+ userId
+ }
+ }
+}
diff --git a/src/shared/components/DemoApp/Error404/Error404.test.js b/shared/components/DemoApp/Error404/__tests__/Error404.test.js
similarity index 55%
rename from src/shared/components/DemoApp/Error404/Error404.test.js
rename to shared/components/DemoApp/Error404/__tests__/Error404.test.js
index a00fe517..31bb8eb5 100644
--- a/src/shared/components/DemoApp/Error404/Error404.test.js
+++ b/shared/components/DemoApp/Error404/__tests__/Error404.test.js
@@ -2,11 +2,14 @@
import React from 'react';
import { shallow } from 'enzyme';
-import Error404 from './Error404';
+
+import Error404 from '../index';
describe('
Sorry, that page was not found.
diff --git a/shared/components/DemoApp/Error404/index.js b/shared/components/DemoApp/Error404/index.js
new file mode 100644
index 00000000..290cf714
--- /dev/null
+++ b/shared/components/DemoApp/Error404/index.js
@@ -0,0 +1,26 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+
+class Error404 extends Component {
+ componentWillMount() {
+ const { staticContext } = this.props;
+ if (staticContext) {
+ staticContext.missed = true;
+ }
+ }
+
+ render() {
+ return 
- );
+ return ;
}
export default Logo;
diff --git a/src/shared/components/DemoApp/Header/Logo/logo.png b/shared/components/DemoApp/Header/Logo/logo.png
similarity index 100%
rename from src/shared/components/DemoApp/Header/Logo/logo.png
rename to shared/components/DemoApp/Header/Logo/logo.png
diff --git a/src/shared/components/DemoApp/Header/Menu/Menu.test.js b/shared/components/DemoApp/Header/Menu/__tests__/Menu.test.js
similarity index 89%
rename from src/shared/components/DemoApp/Header/Menu/Menu.test.js
rename to shared/components/DemoApp/Header/Menu/__tests__/Menu.test.js
index f344832e..a578cc2e 100644
--- a/src/shared/components/DemoApp/Header/Menu/Menu.test.js
+++ b/shared/components/DemoApp/Header/Menu/__tests__/Menu.test.js
@@ -2,7 +2,8 @@
import React from 'react';
import { shallow } from 'enzyme';
-import Menu from './Menu';
+
+import Menu from '../index';
describe('
diff --git a/src/shared/components/DemoApp/globals.css b/shared/components/DemoApp/globals.css
similarity index 100%
rename from src/shared/components/DemoApp/globals.css
rename to shared/components/DemoApp/globals.css
diff --git a/shared/components/DemoApp/index.js b/shared/components/DemoApp/index.js
new file mode 100644
index 00000000..add21857
--- /dev/null
+++ b/shared/components/DemoApp/index.js
@@ -0,0 +1,127 @@
+import 'normalize.css/normalize.css';
+
+import React from 'react';
+import Switch from 'react-router-dom/Switch';
+import Route from 'react-router-dom/Route';
+import Helmet from 'react-helmet';
+
+import config from '../../../config';
+
+import './globals.css';
+
+import Error404 from './Error404';
+import Header from './Header';
+
+import AsyncHomeRoute from './AsyncHomeRoute';
+import AsyncPostsRoute from './AsyncPostsRoute';
+import AsyncAboutRoute from './AsyncAboutRoute';
+
+function DemoApp() {
+ return (
+ Sorry, that page was not found.
;
+ }
+}
+
+Error404.propTypes = {
+ // eslint-disable-next-line react/forbid-prop-types
+ staticContext: PropTypes.object,
+};
+
+Error404.defaultProps = {
+ staticContext: {},
+};
+
+export default Error404;
diff --git a/src/shared/components/DemoApp/Header/Logo/Logo.js b/shared/components/DemoApp/Header/Logo/index.js
similarity index 56%
rename from src/shared/components/DemoApp/Header/Logo/Logo.js
rename to shared/components/DemoApp/Header/Logo/index.js
index 0c91a2b2..11907d21 100644
--- a/src/shared/components/DemoApp/Header/Logo/Logo.js
+++ b/shared/components/DemoApp/Header/Logo/index.js
@@ -2,9 +2,7 @@ import React from 'react';
import logo from './logo.png';
function Logo() {
- return (
- -
+
- + + Home + + +
- + + Posts + + +
- + + About + + +
-
+
- Home +
- Posts
- About
React, Universally
- A starter kit giving you the minimum requirements for a modern universal react application. + A starter kit for universal react applications.
+
+
+ {config('htmlPage.defaultTitle')}
+
+
+
+
+
+
+
+
+ {/*
+ A great reference for favicons:
+ https://github.com/audreyr/favicon-cheat-sheet
+ It's a pain to manage/generate them. I run both these in order,
+ and combine their results:
+ http://realfavicongenerator.net/
+ http://www.favicomatic.com/
+ */}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/*
+ NOTE: This is simply for quick and easy styling on the demo. Remove
+ this and the related items from the Content Security Policy in the
+ global config if you have no intention of using milligram.
+ */}
+
+
+
+
+ );
+}
+
+export default DemoApp;
diff --git a/shared/components/HTML/index.js b/shared/components/HTML/index.js
new file mode 100644
index 00000000..711643c6
--- /dev/null
+++ b/shared/components/HTML/index.js
@@ -0,0 +1,43 @@
+/* eslint-disable react/no-danger */
+/* eslint-disable jsx-a11y/html-has-lang */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+
+/**
+ * The is the HTML shell for our React Application.
+ */
+function HTML(props) {
+ const { htmlAttributes, headerElements, bodyElements, appBodyString } = props;
+
+ return (
+
+
+ {headerElements}
+
+
+
+ {bodyElements}
+
+
+ );
+}
+
+HTML.propTypes = {
+ // eslint-disable-next-line react/forbid-prop-types
+ htmlAttributes: PropTypes.object,
+ headerElements: PropTypes.node,
+ bodyElements: PropTypes.node,
+ appBodyString: PropTypes.string,
+};
+
+HTML.defaultProps = {
+ htmlAttributes: null,
+ headerElements: null,
+ bodyElements: null,
+ appBodyString: '',
+};
+
+// EXPORT
+
+export default HTML;
diff --git a/shared/reducers/index.js b/shared/reducers/index.js
new file mode 100644
index 00000000..3e86ef8d
--- /dev/null
+++ b/shared/reducers/index.js
@@ -0,0 +1,10 @@
+import { combineReducers } from 'redux';
+
+// -----------------------------------------------------------------------------
+// REDUCER EXPORT
+
+export default function getReducers(apolloClient) {
+ return combineReducers({
+ apollo: apolloClient.reducer(),
+ });
+}
diff --git a/shared/redux/configureStore.js b/shared/redux/configureStore.js
new file mode 100644
index 00000000..b95711a1
--- /dev/null
+++ b/shared/redux/configureStore.js
@@ -0,0 +1,67 @@
+import { createStore, applyMiddleware, compose } from 'redux';
+import thunk from 'redux-thunk';
+import axios from 'axios';
+import getReducers from '../reducers';
+
+function configureStore(apolloClient, initialState) {
+ const enhancers = compose(
+ // Middleware store enhancer.
+ applyMiddleware(
+ // Initialising redux-thunk with extra arguments will pass the below
+ // arguments to all the redux-thunk actions. Below we are passing a
+ // preconfigured axios instance which can be used to fetch data with.
+ // @see https://github.com/gaearon/redux-thunk
+ thunk.withExtraArgument({ axios }),
+ apolloClient.middleware(),
+ ),
+ // Redux Dev Tools store enhancer.
+ // @see https://github.com/zalmoxisus/redux-devtools-extension
+ // We only want this enhancer enabled for development and when in a browser
+ // with the extension installed.
+ process.env.NODE_ENV === 'development' &&
+ typeof window !== 'undefined' &&
+ typeof window.devToolsExtension !== 'undefined'
+ ? // Call the brower extension function to create the enhancer.
+ window.devToolsExtension()
+ : // Else we return a no-op function.
+ f => f,
+ );
+
+ const store = initialState
+ ? createStore(getReducers(apolloClient), initialState, enhancers)
+ : createStore(getReducers(apolloClient), enhancers);
+
+ if (process.env.NODE_ENV === 'development' && module.hot) {
+ // Enable Webpack hot module replacement for reducers. This is so that we
+ // don't lose all of our current application state during hot reloading.
+ module.hot.accept('../reducers', () => {
+ const nextRootReducer = require('../reducers').default; // eslint-disable-line global-require
+
+ store.replaceReducer(nextRootReducer);
+ });
+ }
+
+ return store;
+}
+
+// NOTE: If we create an '/api' endpoint in our application then we will neeed to
+// configure the axios instances so that they will resolve to the proper URL
+// endpoints on the server. We have to provide absolute URLs for any of our
+// server bundles. To do so we can set the default 'baseURL' for axios. Any
+// relative path requests will then be appended to the 'baseURL' in order to
+// form an absolute URL.
+// We don't need to worry about this for client side executions, relative paths
+// will work fine there.
+// Example:
+//
+// const axiosConfig = process.env.IS_NODE === true
+// ? { baseURL: process.env.NOW_URL || notEmpty(process.env.SERVER_URL) }
+// : {};
+//
+// Then we will then have to initialise our redux-thunk middlware like so:
+//
+// thunk.withExtraArgument({
+// axios: axios.create(axiosConfig),
+// })
+
+export default configureStore;
diff --git a/shared/utils/arrays/index.js b/shared/utils/arrays/index.js
new file mode 100644
index 00000000..dc5ea89f
--- /dev/null
+++ b/shared/utils/arrays/index.js
@@ -0,0 +1,5 @@
+/* eslint-disable import/prefer-default-export */
+
+import removeNil from './removeNil';
+
+export { removeNil };
diff --git a/shared/utils/arrays/removeNil.js b/shared/utils/arrays/removeNil.js
new file mode 100644
index 00000000..d2b4c81f
--- /dev/null
+++ b/shared/utils/arrays/removeNil.js
@@ -0,0 +1,10 @@
+/**
+ * Filters out all null/undefined items from the given array.
+ *
+ * @param {Array} as - the target array
+ *
+ * @return {Array} The filtered array.
+ */
+export default function removeNil(as) {
+ return as.filter(a => a != null);
+}
diff --git a/shared/utils/logic/ifElse.js b/shared/utils/logic/ifElse.js
new file mode 100644
index 00000000..0a2b811d
--- /dev/null
+++ b/shared/utils/logic/ifElse.js
@@ -0,0 +1,21 @@
+const execIfFunc = x => (typeof x === 'function' ? x() : x);
+
+/**
+ * This is a higher order function that accepts a boolean condition and will
+ * return a function allowing you to provide if/else values that should be
+ * resolved based on the boolean condition.
+ *
+ * @param {Boolean|() => Boolean} condition:
+ * The condition to test against. This can be a function for lazy resolution.
+ *
+ * @return {(X|() => X, Y|() => Y) => X|Y}
+ * A function where the first paramater is the "if" and the second paramater
+ * is the "else". Each of these allows lazy resolving by providing a function.
+ *
+ * @example
+ * const ifDev = ifElse(process.env.NODE_ENV === 'development');
+ * ifDev('foo', () => 'lazy resolved'); // => 'foo'
+ */
+export default function ifElse(condition) {
+ return (then, or) => (execIfFunc(condition) ? execIfFunc(then) : execIfFunc(or));
+}
diff --git a/shared/utils/logic/index.js b/shared/utils/logic/index.js
new file mode 100644
index 00000000..21078931
--- /dev/null
+++ b/shared/utils/logic/index.js
@@ -0,0 +1,5 @@
+/* eslint-disable import/prefer-default-export */
+
+import ifElse from './ifElse';
+
+export { ifElse };
diff --git a/shared/utils/objects/filterWithRules.js b/shared/utils/objects/filterWithRules.js
new file mode 100644
index 00000000..613ff0a1
--- /dev/null
+++ b/shared/utils/objects/filterWithRules.js
@@ -0,0 +1,56 @@
+function filterWithRulesLoop(rules, obj, basePropPath = '') {
+ return Object.keys(rules).reduce(
+ (acc, key) => {
+ const propPath = basePropPath !== '' ? `${basePropPath}.${key}` : key;
+
+ if (typeof rules[key] === 'object') {
+ if (typeof obj[key] !== 'object') {
+ throw new Error(`Expected prop at path "${propPath}" to be an object`);
+ }
+ acc[key] = filterWithRulesLoop(rules[key], obj[key], propPath); // eslint-disable-line no-param-reassign,max-len
+ } else if (rules[key]) {
+ if (typeof obj[key] === 'undefined') {
+ throw new Error(
+ `Filter set an "allow" on path "${propPath}", however, this path was not found on the source object.`,
+ );
+ }
+ acc[key] = obj[key]; // eslint-disable-line no-param-reassign
+ }
+ return acc;
+ },
+ {},
+ );
+}
+
+/**
+ * Applies a rules object to filter a given object's structure.
+ *
+ * The rules object should match the shape of the source object and should
+ * have a truthy/falsey value indicating if a property should be included/
+ * excluded. If the filters do not contain a property that exists on the
+ * source object then the respective property will be excluded.
+ *
+ * @param {Object} rules : The filter rules.
+ * @param {Object} obj : The object to filter.
+ *
+ * @return {Object}
+ * The filtered object.
+ *
+ * @example
+ * filter(
+ * // rules
+ * {
+ * foo: { bar: true },
+ * poop: true
+ * },
+ * // source
+ * {
+ * foo: { bar: 'bar', qux: 'qux' },
+ * bob: 'bob',
+ * poop: { plop: 'splash' }
+ * },
+ * )
+ */
+export default function filterWithRules(rules, obj) {
+ return filterWithRulesLoop(rules, obj);
+}
diff --git a/shared/utils/objects/index.js b/shared/utils/objects/index.js
new file mode 100644
index 00000000..a36b38a6
--- /dev/null
+++ b/shared/utils/objects/index.js
@@ -0,0 +1,4 @@
+import filterWithRules from './filterWithRules';
+import mergeDeep from './mergeDeep';
+
+export { filterWithRules, mergeDeep };
diff --git a/shared/utils/objects/mergeDeep.js b/shared/utils/objects/mergeDeep.js
new file mode 100644
index 00000000..6d30c935
--- /dev/null
+++ b/shared/utils/objects/mergeDeep.js
@@ -0,0 +1,35 @@
+import removeNil from '../arrays/removeNil';
+
+/**
+ * Deeply merges a given set of objects together.
+ *
+ * Objects to the right take priority.
+ *
+ * @param {...Object} args - The objects to merge.
+ *
+ * @return {Object} - The merged object.
+ */
+export default function mergeDeep(...args) {
+ const filtered = removeNil(args);
+ if (filtered.length < 1) {
+ return {};
+ }
+ if (filtered.length === 1) {
+ return args[0];
+ }
+ return filtered.reduce(
+ (acc, cur) => {
+ Object.keys(cur).forEach((key) => {
+ if (typeof acc[key] === 'object' && typeof cur[key] === 'object') {
+ // eslint-disable-next-line no-param-reassign
+ acc[key] = mergeDeep(acc[key], cur[key]);
+ } else {
+ // eslint-disable-next-line no-param-reassign
+ acc[key] = cur[key];
+ }
+ });
+ return acc;
+ },
+ {},
+ );
+}
diff --git a/src/client/index.js b/src/client/index.js
deleted file mode 100644
index 8f2789d2..00000000
--- a/src/client/index.js
+++ /dev/null
@@ -1,54 +0,0 @@
-/* eslint-disable global-require */
-
-import React from 'react';
-import { render } from 'react-dom';
-import { BrowserRouter } from 'react-router';
-import { CodeSplitProvider, rehydrateState } from 'code-split-component';
-import ReactHotLoader from './components/ReactHotLoader';
-import DemoApp from '../shared/components/DemoApp';
-
-// Get the DOM Element that will host our React application.
-const container = document.querySelector('#app');
-
-function renderApp(TheApp) {
- // We use the code-split-component library to provide us with code splitting
- // within our application. This library supports server rendered applications,
- // but for server rendered applications it requires that we rehydrate any
- // code split modules that may have been rendered for a request. We use
- // the provided helper and then pass the result to the CodeSplitProvider
- // instance which takes care of the rest for us. This is really important
- // to do as it will ensure that our React checksum for the client will match
- // the content returned by the server.
- // @see https://github.com/ctrlplusb/code-split-component
- rehydrateState().then(codeSplitState =>
- render(
-
+
+
+
+ ${reactAppString || ''}
- ${
- // Binds the client configuration object to the window object so
- // that we can safely expose some configuration values to the
- // client bundle that gets executed in the browser.
- inlineScript(`window.__CLIENT_CONFIG__=${serialize(clientConfig)}`)
- }
- ${
- // Bind the initial application state based on the server render
- // so the client can register the correct initial state for the view.
- initialState
- ? inlineScript(`window.__APP_STATE__=${serialize(initialState)};`)
- : ''
- }
- ${
- // Bind our code split state so that the client knows which server
- // rendered modules need to be rehydrated.
- codeSplitState
- ? inlineScript(`window.${STATE_IDENTIFIER}=${serialize(codeSplitState)};`)
- : ''
- }
- ${
- // Enable the polyfill io script?
- // This can't be configured within a react-helmet component as we
- // may need the polyfill's before our client bundle gets parsed.
- config.polyfillIO.enabled
- ? scriptTag(config.polyfillIO.url)
- : ''
- }
- ${
- // When we are in development mode our development server will generate a
- // vendor DLL in order to dramatically reduce our compilation times. Therefore
- // we need to inject the path to the vendor dll bundle below.
- // @see /tools/development/ensureVendorDLLExists.js
- process.env.NODE_ENV === 'development'
- && config.bundles.client.devVendorDLL.enabled
- ? scriptTag(`${config.bundles.client.webPath}${config.bundles.client.devVendorDLL.name}.js?t=${Date.now()}`)
- : ''
- }
- ${scriptTags(assetsForRender.js)}
- ${helmet ? helmet.script.toString() : ''}
-
- `;
-}
diff --git a/src/server/middleware/reactApplication/getAssetsForClientChunks.js b/src/server/middleware/reactApplication/getAssetsForClientChunks.js
deleted file mode 100644
index 285f015b..00000000
--- a/src/server/middleware/reactApplication/getAssetsForClientChunks.js
+++ /dev/null
@@ -1,59 +0,0 @@
-// This file resolves the assets available from our client bundle.
-
-import fs from 'fs';
-import { resolve as pathResolve } from 'path';
-import appRootDir from 'app-root-dir';
-import config from '../../../../config';
-
-const assetsFilePath = pathResolve(
- appRootDir.get(),
- config.bundles.client.outputPath,
- `./${config.bundleAssetsFileName}`,
-);
-
-if (!fs.existsSync(assetsFilePath)) {
- throw new Error(
- `We could not find the "${assetsFilePath}" file, which contains a list of the assets of the client bundle. Please ensure that the client bundle has been built.`,
- );
-}
-
-const readAssetsJSONFile = () => JSON.parse(fs.readFileSync(assetsFilePath, 'utf8'));
-const assetsJSON = readAssetsJSONFile();
-const assetsJSONResolver = () => (
- process.env.NODE_ENV === 'development'
- // In development mode we always read the assets json file from disk to avoid
- // any cases where an older version gets cached.
- ? readAssetsJSONFile()
- // Otherwise we return the initially parsed JSON file.
- : assetsJSON
-);
-
-/**
- * Retrieves the js/css for the named chunks that belong to our client bundle.
- *
- * Note: the order of the chunk names is important. The same ordering will be
- * used when rendering the scripts.
- *
- * This is useful to us for a couple of reasons:
- * - It allows us to target the assets for a specific chunk, thereby only
- * loading the assets we know we will need for a specific request.
- * - The assets are hashed, and therefore they can't be "manually" added
- * to the render logic. Having this method allows us to easily fetch
- * the respective assets simply by using a chunk name. :)
- */
-function getAssetsForClientChunks(chunks) {
- return chunks.reduce((acc, chunkName) => {
- const chunkAssets = assetsJSONResolver()[chunkName];
- if (chunkAssets) {
- if (chunkAssets.js) {
- acc.js.push(chunkAssets.js);
- }
- if (chunkAssets.css) {
- acc.css.push(chunkAssets.css);
- }
- }
- return acc;
- }, { js: [], css: [] });
-}
-
-export default getAssetsForClientChunks;
diff --git a/src/server/middleware/reactApplication/index.js b/src/server/middleware/reactApplication/index.js
deleted file mode 100644
index ba244bc9..00000000
--- a/src/server/middleware/reactApplication/index.js
+++ /dev/null
@@ -1,96 +0,0 @@
-
-import React from 'react';
-import { renderToString } from 'react-dom/server';
-import { ServerRouter, createServerRenderContext } from 'react-router';
-import { CodeSplitProvider, createRenderContext } from 'code-split-component';
-import Helmet from 'react-helmet';
-import generateHTML from './generateHTML';
-import DemoApp from '../../../shared/components/DemoApp';
-import config from '../../../../config';
-
-/**
- * An express middleware that is capabable of service our React application,
- * supporting server side rendering of the application.
- */
-function reactApplicationMiddleware(request, response) {
- // We should have had a nonce provided to us. See the server/index.js for
- // more information on what this is.
- if (typeof response.locals.nonce !== 'string') {
- throw new Error('A "nonce" value has not been attached to the response');
- }
- const nonce = response.locals.nonce;
-
- // It's possible to disable SSR, which can be useful in development mode.
- // In this case traditional client side only rendering will occur.
- if (config.disableSSR) {
- if (process.env.NODE_ENV === 'development') {
- // eslint-disable-next-line no-console
- console.log('==> Handling react route without SSR');
- }
- // SSR is disabled so we will just return an empty html page and will
- // rely on the client to initialize and render the react application.
- const html = generateHTML({
- // Nonce which allows us to safely declare inline scripts.
- nonce,
- });
- response.status(200).send(html);
- return;
- }
-
- // First create a context for
-
- );
-}
-
-export default About;
diff --git a/src/shared/components/DemoApp/About/About.test.js b/src/shared/components/DemoApp/About/About.test.js
deleted file mode 100644
index 5462f38a..00000000
--- a/src/shared/components/DemoApp/About/About.test.js
+++ /dev/null
@@ -1,12 +0,0 @@
-/* eslint-disable import/no-extraneous-dependencies */
-
-import React from 'react';
-import { shallow } from 'enzyme';
-import About from './About';
-
-describe('Produced with โค๏ธ by...
- --
- {
- contributors.map(({ name, twitter }) =>
-
-
-
- ,
- )
- }
-
-
-`;
diff --git a/src/shared/components/DemoApp/About/index.js b/src/shared/components/DemoApp/About/index.js
deleted file mode 100644
index 1ef71b80..00000000
--- a/src/shared/components/DemoApp/About/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './About';
diff --git a/src/shared/components/DemoApp/DemoApp.js b/src/shared/components/DemoApp/DemoApp.js
deleted file mode 100644
index 3f2a5134..00000000
--- a/src/shared/components/DemoApp/DemoApp.js
+++ /dev/null
@@ -1,53 +0,0 @@
-import React from 'react';
-import { Match, Miss } from 'react-router';
-import Helmet from 'react-helmet';
-import { CodeSplit } from 'code-split-component';
-import 'normalize.css/normalize.css';
-import './globals.css';
-import Error404 from './Error404';
-import Header from './Header';
-import { safeConfigGet } from '../../utils/config';
-
-function DemoApp() {
- return (
-
- {/*
- All of the following will be injected into our page header.
- @see https://github.com/nfl/react-helmet
- */}
-
-
- { ({ Home }) => Home &&
- }
- />
-
-
-
- { ({ About }) => About &&
- }
- />
-
-
- );
-}
-
-export default DemoApp;
diff --git a/src/shared/components/DemoApp/Error404/Error404.js b/src/shared/components/DemoApp/Error404/Error404.js
deleted file mode 100644
index 0349853c..00000000
--- a/src/shared/components/DemoApp/Error404/Error404.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import React from 'react';
-
-function Error404() {
- return (
- Sorry, that page was not found.
- );
-}
-
-export default Error404;
diff --git a/src/shared/components/DemoApp/Error404/index.js b/src/shared/components/DemoApp/Error404/index.js
deleted file mode 100644
index 3a727c49..00000000
--- a/src/shared/components/DemoApp/Error404/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './Error404';
diff --git a/src/shared/components/DemoApp/Header/Logo/index.js b/src/shared/components/DemoApp/Header/Logo/index.js
deleted file mode 100644
index a5be7785..00000000
--- a/src/shared/components/DemoApp/Header/Logo/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './Logo';
diff --git a/src/shared/components/DemoApp/Header/Menu/__snapshots__/Menu.test.js.snap b/src/shared/components/DemoApp/Header/Menu/__snapshots__/Menu.test.js.snap
deleted file mode 100644
index 435ec97e..00000000
--- a/src/shared/components/DemoApp/Header/Menu/__snapshots__/Menu.test.js.snap
+++ /dev/null
@@ -1,35 +0,0 @@
-exports[`-
-
- - - Home - - -
- - - About - - -