Merge pull request #36 from combine/release/5.0.0

Release/5.0.0

Author: calvinl

.babelrc

@@ -5,9 +5,10 @@
   ],
   "plugins": [
     "react-hot-loader/babel",
+    "transform-es2015-modules-commonjs",
     "transform-class-properties",
     "transform-decorators",
-    "transform-object-rest-spread",
-    ["resolver", { "resolveDirs": ["common"] }]
+    "transform-export-extensions",
+    "transform-object-rest-spread"
   ]
 }

.gitignore

@@ -1,8 +1,12 @@
+npm-error.log
 .env
 node_modules
 npm-debug.log*
 .DS_Store
 
 # ignore built static files
-dist/
-webpack-assets.json
+/dist
+/webpack-assets.json
+
+# webpack-built server files
+server/renderer/*.built.js

README.md

@@ -11,31 +11,30 @@ promise that future updates will not break your existing application.**
 
 ## Get started
 
-Install [yarn](https://github.com/yarnpkg/yarn) if you don't have it already:
-```
-npm install -g yarn
-```
-
-Then copy environment variables and edit them if necessary:
+Copy environment variables and edit them if necessary:
 ```
 cp .env.example .env
 ```
 
 Then:
 ```
-yarn install
-yarn start
+npm install
+npm start
 ```
 
 Direct your browser to `http://localhost:3000`.
 
 For production builds:
 
 ```
-yarn run prod:start
+npm run prod:build
+npm run serve
 ```
 
-Note: pm2 must be installed to run production builds.
+For Heroku, simply add a `Procfile`:
+```
+web: npm run serve
+```
 
 ## Directory Structure
 ```
@@ -93,13 +92,13 @@ Make sure you have it installed:
 npm install -g mocha
 ```
 
-Tests should reside alongside the component/module/selector/etc that it is
-testing. For example:
+Tests should reside in `test/spec` in their appropriate folders:
 
 ```
-├── reducers
-│   ├── todos.js
-│   ├── todos.test.js
+├── test
+│   ├── spec
+│   │   ├── api
+│   │   │   ├── todos.test.js
 ```
 
 Tests can be written with ES2015, since it passes through `babel-register`.

client/index.js

@@ -10,12 +10,6 @@ import App from 'containers/App';
 
 const history = createHistory();
 
-/* Images
- * This space is reserved for images that are required by server rendering,
- * e.g. the favicon and any other images that need to be in the base HTML file.
- */
-import '../common/images/favicon.png';
-
 // The root element of your app
 const rootElement = document.getElementById('app');
 
@@ -25,7 +19,7 @@ const initialState = window.__INITIAL_STATE__;
 const store = configureStore(initialState, history);
 
 const render = (Component) => {
-  ReactDOM.render(
+  ReactDOM.hydrate(
     <Provider store={store}>
       <AppContainer>
         <ConnectedRouter history={history}>

common/css/_functions.scss

@@ -0,0 +1,2 @@
+// Import fonts here, from google, or whereever.
+@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600');

common/css/_variables.scss

@@ -0,0 +1,19 @@
+html, body {
+  height: 100%;
+  font-family: 'Open Sans', sans-serif;
+
+  p {
+    font-size: 16px;
+    line-height: 24px;
+  }
+}
+
+body {
+  background-color: $white;
+}
+
+#app {
+  height: 100%;
+  width: 100%;
+  margin: 0 auto;
+}

common/css/base/_fonts.scss

@@ -0,0 +1,9 @@
+// Import bootstrap-sass as needed
+$bootstrap-sass-asset-helper: true;
+@import "~bootstrap-sass/assets/stylesheets/bootstrap/variables";
+
+$screen-lg-min: $app-max-width !global;
+$container-lg: $app-max-width !global;
+
+@import "~bootstrap-sass/assets/stylesheets/bootstrap/mixins";
+@import "~bootstrap-sass/assets/stylesheets/bootstrap/grid";