Update 2020

.babelrc

@@ -1,5 +1,15 @@
 {
-  "presets": [
-    "latest"
-  ]
+  "presets": ["@babel/preset-env"],
+  "env": {
+    "production": {
+      "presets": [
+        [
+          "@babel/preset-env",
+          {
+            "targets": "> 0.25%, not dead"
+          }
+        ]
+      ]
+    }
+  }
 }

.travis.yml

@@ -1,3 +1,3 @@
 language: node_js
 node_js:
-  - "6"
+  - "12"

README.md

@@ -4,7 +4,7 @@ This is a generic JavaScript development environment that I build from scratch i
 
 ## Get Started
 
-1. **Install [Node 6 or newer](https://nodejs.org)**. Need to run multiple versions of Node? Use [nvm](https://github.com/creationix/nvm) or [nvm-windows](https://github.com/coreybutler/nvm-windows)
+1. **Install [Node 12 or newer](https://nodejs.org)**. Need to run multiple versions of Node? Use [nvm](https://github.com/creationix/nvm) or [nvm-windows](https://github.com/coreybutler/nvm-windows)
 2. **Clone this repository.** - `git clone https://github.com/coryhouse/javascript-development-environment.git` or [download the zip](https://github.com/coryhouse/javascript-development-environment/archive/master.zip)
 3. **Make sure you're in the directory you just created.** - `cd javascript-development-environment`
 4. **Install Node Packages.** - `npm install`
@@ -24,37 +24,39 @@ This is a generic JavaScript development environment that I build from scratch i
 
 ### Development Dependencies
 
-| **Dependency**              | **Use**                                                                                                   |
-| --------------------------- | --------------------------------------------------------------------------------------------------------- |
-| babel-cli                   | Babel Command line interface                                                                              |
-| babel-core                  | Babel Core for transpiling the new JavaScript to old                                                      |
-| babel-loader                | Adds Babel support to Webpack                                                                             |
-| babel-preset-latest         | Babel preset for running all the latest standardized JavaScript features                                  |
-| babel-register              | Register Babel to transpile our Mocha tests                                                               |
-| chai                        | Assertion library                                                                                         |
-| chalk                       | Colored command line output                                                                               |
-| cheerio                     | Supports querying DOM with jQuery like syntax - Useful in testing and build process for HTML manipulation |
-| compression                 | gzip http output                                                                                          |
-| cross-env                   | Cross-environment friendly way to handle environment variables                                            |
-| css-loader                  | Add CSS support to Webpack                                                                                |
-| eslint                      | Lints JavaScript                                                                                          |
-| eslint-plugin-import        | Advanced linting of ES6 imports                                                                           |
-| eslint-watch                | Add watch functionality to ESLint                                                                         |
-| express                     | Serves development and production builds                                                                  |
-| extract-text-webpack-plugin | Extracts CSS into separate file for production build                                                      |
-| html-webpack-plugin         | Generate HTML file programatically via Webpack                                                            |
-| jsdom                       | In-memory DOM for testing                                                                                 |
-| json-schema-faker           | Declare a JSON schema for generating fake data                                                            |
-| json-server                 | Serve a JSON API locally                                                                                  |
-| localtunnel                 | Create a tunnel to your local machine                                                                     |
-| mocha                       | JavaScript testing library                                                                                |
-| nock                        | Mock HTTP requests via Node                                                                               |
-| npm-run-all                 | Display results of multiple commands on single command line                                               |
-| numeral                     | Library for working with numbers                                                                          |
-| open                        | Open app in default browser                                                                               |
-| rimraf                      | Delete files                                                                                              |
-| style-loader                | Add Style support to Webpack                                                                              |
-| webpack                     | Bundler with plugin system and integrated development server                                              |
-| webpack-dev-middleware      | Adds middleware support to webpack                                                                        |
-| webpack-hot-middleware      | Adds hot reloading to webpack                                                                             |
-| webpack-md5-hash            | Used to hash files generated by Webpack using MD5 so that their names change when the content changes     |
+| **Dependency**          | **Use**                                                                                                   |
+| ----------------------- | --------------------------------------------------------------------------------------------------------- |
+| @babel/cli              | Babel Command line interface                                                                              |
+| @babel/core             | Babel Core for transpiling the new JavaScript to old                                                      |
+| @babel/node             | Run Babel via Node                                                                                        |
+| @babel/preset-env       | Babel preset for compiling to specific environments                                                       |
+| @babel/register         | Register Babel to transpile our Mocha tests                                                               |
+| babel-loader            | Adds Babel support to Webpack                                                                             |
+| chai                    | Assertion library                                                                                         |
+| chalk                   | Colored command line output                                                                               |
+| cheerio                 | Supports querying DOM with jQuery like syntax - Useful in testing and build process for HTML manipulation |
+| compression             | gzip http output                                                                                          |
+| cross-env               | Cross-environment friendly way to handle environment variables                                            |
+| css-loader              | Add CSS support to Webpack                                                                                |
+| eslint                  | Lints JavaScript                                                                                          |
+| eslint-plugin-import    | Advanced linting of ES6 imports                                                                           |
+| eslint-watch            | Add watch functionality to ESLint                                                                         |
+| express                 | Serves development and production builds                                                                  |
+| faker                   | Generates realistic fake data                                                                             |
+| html-webpack-plugin     | Generate HTML file programatically via Webpack                                                            |
+| jsdom                   | In-memory DOM for testing                                                                                 |
+| json-schema-faker       | Declare a JSON schema for generating fake data                                                            |
+| json-server             | Serve a JSON API locally                                                                                  |
+| mini-css-extract-plugin | Extract CSS to a separate file and minimize                                                               |
+| mocha                   | JavaScript testing library                                                                                |
+| nock                    | Mock HTTP requests via Node                                                                               |
+| npm-run-all             | Display results of multiple commands on single command line                                               |
+| numeral                 | Library for working with numbers                                                                          |
+| open                    | Open app in default browser                                                                               |
+| rimraf                  | Delete files                                                                                              |
+| style-loader            | Add Style support to Webpack                                                                              |
+| surge                   | Host a static site via a CLI command                                                                      |
+| webpack                 | Bundler with plugin system and integrated development server                                              |
+| webpack-dev-middleware  | Adds middleware support to webpack                                                                        |
+| webpack-hot-middleware  | Adds hot reloading to webpack                                                                             |
+| whatwg-fetch            | Polyfill for the Browser's native fetch for older browsers                                                |

appveyor.yml

@@ -1,8 +1,8 @@
 # Test against this version of Node.js
 environment:
   matrix:
-  # node.js
-  - nodejs_version: "6"
+    # node.js
+    - nodejs_version: "12"
 
 # Install scripts. (runs after repo cloning)
 install:

buildScripts/generateMockData.js

@@ -11,7 +11,9 @@ import {schema} from './mockDataSchema';
 import fs from 'fs';
 import chalk from 'chalk';
 
-const json = JSON.stringify(jsf(schema));
+// Extend JSF with the fake libs you want to use.
+jsf.extend('faker', () => require('faker'));
+const json = JSON.stringify(jsf.generate(schema));
 
 fs.writeFile("./src/api/db.json", json, function (err) {
   if (err) {

buildScripts/mockDataSchema.js

@@ -31,4 +31,4 @@ export const schema = {
     }
   },
   "required": ["users"]
-};
+};

buildScripts/testSetup.js

@@ -1,7 +1,7 @@
-// This file isn't transpiled, so must use CommonJS and ES5
+// This file isn't transpiled, so must use CommonJS
 
 // Register babel to transpile before our tests run.
-require('babel-register')();
+require('@babel/register')();
 
 // Disable webpack features that Mocha doesn't understand.
 require.extensions['.css'] = function() {};