chore: update readme. add custom babel preset

Author: Steven Truesdell

.babelrc

@@ -1,50 +1,25 @@
 {
   "env": {
-    "server": {
-      "presets": ["latest", "react"],
-      "plugins": ["transform-decorators-legacy",
-        "transform-class-properties",
-        "transform-object-rest-spread",
-        "transform-regenerator", ["transform-runtime", {
-          "helpers": false,
-          "polyfill": false,
-          "regenerator": true
-        }],
+    "development": {
+      "presets": ["boldr"],
+      "plugins": [
         ["module-resolver", {
           "root": ["./src"]
         }]
       ]
     },
-    "client": {
-      "presets": ["latest", "react"],
+    "production": {
+      "presets": ["boldr"],
       "plugins": [
-        "transform-decorators-legacy",
-        "transform-class-properties",
-        "transform-object-rest-spread",
-        "transform-react-constant-elements",
-        "transform-react-inline-elements",
         "lodash",
-        ["transform-runtime", {
-          "helpers": false,
-          "polyfill": false,
-          "regenerator": true
-        }],
         ["module-resolver", {
           "root": ["./src"]
         }]
       ]
     },
     "test": {
-      "presets": ["latest", "react"],
-      "plugins": ["istanbul", "transform-decorators-legacy",
-        "transform-class-properties",
-        "transform-object-rest-spread",
-        "transform-regenerator", ["transform-runtime", {
-          "helpers": false,
-          "polyfill": false,
-          "regenerator": true
-        }],
-        ["module-resolver", {
+      "presets": ["boldr"],
+      "plugins": ["istanbul", ["module-resolver", {
           "root": ["./src"]
         }]
       ]

README.md

@@ -36,7 +36,24 @@ Running the two commands below will compile your application and serve the produ
 #### Using DLLs
 Taking advantage of Webpack's DLLs is pretty easy in this project. The command is `npm run build:dlls`. It creates a `vendor.json` tfile in the webpack directory and places the DLL bundle in `static/assets/dlls`. When you add new dependencies to your project, all you need to do is add the name to the on-going list within `webpack/dll.config.js`. As a side note, rather than using DLLs in production (which you shouldnt, by the way), you'll want to add the package into the list of vendor dependencies inside `webpack/webpack.config.client.js`.
 
-If you don't feel like using DLLs, set WEBPACK_DLLS to 0 in the `package.json`
+If you don't feel like using DLLs, set WEBPACK_DLLS to 0 in the `package.json`  
+
+#### Where are the Babel transforms?
+Inspired by Create React App, a custom Babel preset was created containing some common Babel plugins and presets. **Why?** Typically I find myself using the exact same Babel plugins, and rather than installing 5+ different packages, a single command takes care of it.
+
+**babel-preset-boldr contains:**
+- `babel-plugin-transform-class-properties`
+- `babel-plugin-transform-decorators-legacy`
+- `babel-plugin-transform-function-bind`
+- `babel-plugin-transform-object-rest-spread`
+- `babel-plugin-transform-react-constant-elements`
+- `babel-plugin-transform-react-jsx-self`
+- `babel-plugin-transform-react-jsx-source`
+- `babel-plugin-transform-regenerator`
+- `babel-plugin-transform-runtime`
+- `babel-preset-latest`
+- `babel-preset-react`
+- `babel-runtime`
 
 ## Resources
 - [`React Redux Links`](https://github.com/markerikson/react-redux-links)

package.json

@@ -8,15 +8,15 @@
       "env": {
         "DEBUG": "boldr:*",
         "NODE_ENV": "production",
-        "BABEL_ENV": "client",
+        "BABEL_ENV": "production",
         "SSR_PORT": 3000
       }
     },
     "build:server": {
       "command": "./node_modules/.bin/webpack --config tools/webpack/webpack.config.node.js",
       "env": {
         "NODE_ENV": "production",
-        "BABEL_ENV": "server",
+        "BABEL_ENV": "production",
         "SSR_PORT": 3000
       }
     },
@@ -25,7 +25,7 @@
       "env": {
         "DEBUG": "boldr:*",
         "NODE_ENV": "development",
-        "BABEL_ENV": "client",
+        "BABEL_ENV": "development",
         "SSR_PORT": 3000,
         "HMR_PORT": 3001,
         "WEBPACK_DLLS": 1
@@ -36,7 +36,7 @@
       "env": {
         "DEBUG": "boldr:*",
         "NODE_ENV": "development",
-        "BABEL_ENV": "client",
+        "BABEL_ENV": "development",
         "SSR_PORT": 3000,
         "HMR_PORT": 3001,
         "WEBPACK_DLLS": 1
@@ -59,7 +59,7 @@
     }
   },
   "scripts": {
-    "build": "npm-run-all -s build:server build:client",
+    "build": "npm-run-all -s clean build:server build:client",
     "build:client": "better-npm-run build:client",
     "build:server": "better-npm-run build:server",
     "build:dlls": "webpack --verbose --colors --display-error-details --config ./tools/webpack/dll.config.js",
@@ -126,21 +126,15 @@
     "instrument": false
   },
   "devDependencies": {
+    "assets-webpack-plugin": "^3.4.0",
     "autoprefixer": "^6.4.1",
     "babel-core": "^6.14.0",
     "babel-loader": "^6.2.5",
     "babel-plugin-istanbul": "^2.0.1",
     "babel-plugin-lodash": "^3.2.9",
     "babel-plugin-module-resolver": "^2.2.0",
-    "babel-plugin-transform-class-properties": "^6.11.5",
-    "babel-plugin-transform-decorators-legacy": "^1.3.4",
-    "babel-plugin-transform-object-rest-spread": "^6.8.0",
-    "babel-plugin-transform-react-constant-elements": "^6.9.1",
-    "babel-plugin-transform-react-inline-elements": "^6.8.0",
-    "babel-plugin-transform-runtime": "^6.15.0",
     "babel-polyfill": "^6.13.0",
-    "babel-preset-latest": "^6.14.0",
-    "babel-preset-react": "^6.11.1",
+    "babel-preset-boldr": "^1.0.1",
     "babel-register": "^6.14.0",
     "chai": "^3.5.0",
     "chai-enzyme": "^0.5.1",
@@ -174,7 +168,7 @@
     "sinon-chai": "^2.8.0",
     "style-loader": "^0.13.1",
     "url-loader": "^0.5.7",
-    "webpack": "^2.1.0-beta.24",
+    "webpack": "^2.1.0-beta.25",
     "webpack-dev-middleware": "^1.8.2",
     "webpack-hot-middleware": "^2.12.2",
     "webpack-node-externals": "^1.4.3"
@@ -185,7 +179,7 @@
     "compression": "^1.6.2",
     "debug": "^2.2.0",
     "express": "^4.14.0",
-    "lodash": "^4.16.1",
+    "lodash": "^4.16.2",
     "npm-run-all": "^3.1.0",
     "react": "^15.3.2",
     "react-dom": "^15.3.2",

src/scenes/Home/actions.js

@@ -1,5 +1,4 @@
 import request from 'superagent';
-import { processResponse } from 'core/api/helpers';
 
 export const FETCH_POSTS_REQUEST = 'FETCH_POSTS_REQUEST';
 export const FETCH_POSTS_SUCCESS = 'FETCH_POSTS_SUCCESS';

tools/webpack/dev.server.js

@@ -2,6 +2,7 @@ const Express = require('express');
 const webpack = require('webpack');
 const webpackDevMiddleware = require('webpack-dev-middleware');
 const webpackHotMiddleware = require('webpack-hot-middleware');
+
 const debug = require('debug')('boldr:webpack-ds');
 const config = require('../defaults');
 const wpConfig = require('./index.js');
@@ -26,6 +27,7 @@ const app = new Express();
 app.use(webpackDevMiddleware(compiler, serverOptions));
 app.use(webpackHotMiddleware(compiler));
 
+
 /* eslint-disable */
 app.listen(config.HMR_PORT, function onAppListening(err) {
   if (err) {

tools/webpack/util/isomorphic.config.js

@@ -2,7 +2,7 @@ const path = require('path');
 const WebpackIsomorphicToolsPlugin = require('webpack-isomorphic-tools/plugin');
 
 module.exports = {
-  debug: true,
+  debug: false,
   patch_require: true,
   webpack_assets_file_path: path.join(__dirname, '..', '..', '..', 'static', 'webpack-assets.json'),
   webpack_stats_file_path: path.join(__dirname, '..', '..', '..', 'static', 'webpack-stats.json'),

tools/webpack/webpack.config.client.js

@@ -4,6 +4,7 @@ const webpack = require('webpack');
 const WebpackIsomorphicToolsPlugin = require('webpack-isomorphic-tools/plugin');
 const HappyPack = require('happypack');
 const autoprefixer = require('autoprefixer');
+const AssetsPlugin = require('assets-webpack-plugin');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const LodashModuleReplacementPlugin = require('lodash-webpack-plugin');
 
@@ -203,7 +204,14 @@ module.exports = function webpackConfig() {
       // A plugin for a more aggressive chunk merging strategy. Even similar chunks
       // are merged if the total size is reduced enough.
       // http://webpack.github.io/docs/list-of-plugins.html#aggressivemergingplugin
-      ifProd(new webpack.optimize.AggressiveMergingPlugin())
+      ifProd(new webpack.optimize.AggressiveMergingPlugin()),
+
+      new AssetsPlugin({
+        path: path.resolve(config.ASSETS_DIR),
+        filename: 'assets.js',
+        processOutput: x => `module.exports = ${JSON.stringify(x)};`
+      }),
+      // ifDev(new DashboardPlugin({ port: 3001 }))
     ]),
     /*
      * Include polyfills and/or mocks for node