Simplified version

.gitignore

@@ -3,3 +3,4 @@ node_modules
 .DS_Store
 .idea
 Iconr
+build

.travis.yml

@@ -0,0 +1,19 @@
+language: node_js
+dist: trusty
+sudo: required
+node_js:
+  - 'node'
+
+install:
+  - npm install
+
+script:
+  - npm run build
+
+deploy:
+  provider: pages
+  skip_cleanup: true
+  local_dir: build/prod/
+  github_token: $GITHUB_TOKEN
+  on:
+    branch: master

README.md

@@ -1,23 +1,34 @@
 # Three.js Webpack ES6 Boilerplate
-https://github.com/paulmg/ThreeJS-Webpack-ES6-Boilerplate/
 
-A basic boilerplate for a Three.js project including the use of Webpack and ES6 syntax via Babel.
+This is a simplified fork of [Three.js Webpack ES6 Boilerplate](https://github.com/paulmg/ThreeJS-Webpack-ES6-Boilerplate/), a basic boilerplate for a Three.js project including the use of Webpack and ES6 syntax via Babel.
+
+All auto-built files are removed from Git and generated at build time to clean and simplify the folder structures.
+
+A Travis YML configuration is also provided to auto-deploy the static built production site via Github Pages and requires the additional configuration:
+
+ - Create a Personal Access Token with just ```repo``` access in [Github developer settings](https://github.com/settings/tokens)
+ - Create an Environmental Variable called ```GITHUB_TOKEN``` on your repo page on the [Travis website](https://travis-ci.com/)
+ - Create a new branch ```gh-pages``` and point GitHub Pages there on your repo's settings on Github.
+ - If you are using a custom domain, add a file named ```CNAME``` (no extension) to the root of the build folder containing just the URL
+
+Travis will then auto-deploy the latest static production build via Github Pages on each new commit.
 
 ## Project Structure
 ```
-build - Directory for built and compressed files from the npm build script
-src - Directory for all dev files
-├── css - Contains all SCSS files, that are compiled to `src/public/css`
-├── js - All the Three.js app files, with `app.js` as entry point. Compiled to `src/public/js` with webpack
-│   ├── app
-│   │   ├── components - Three.js components that get initialized in `main.js`
-│   │   ├── helpers - Classes that provide ideas on how to set up and work with defaults
-│   │   ├── managers - Manage complex tasks such as GUI or input
-│   │   └── model - Classes that set up the model object
-│   ├── data - Any data to be imported into app
-│   └── utils - Various helpers and vendor classes
-└── public - Used by webpack-dev-server to serve content. Webpack builds local dev files here. 
-    └── assets - Is copied over to build folder with build command. Place external asset files here.
+──build - Directory for all built files (excluded from Git)
+  ├── dev - Webpack builds local dev site here. Used by webpack-dev-server to serve content locally during development.  
+  ├── prod - Webpack builds static production site here. Use for serving the static site on a webserver.
+──src - Directory for all source files
+  ├── assets - Is copied over to build folder with build command. Place external asset & vendor files here.
+  ├── css - Contains all SCSS files, that are compiled to `src/public/css`
+  ├── js - All the Three.js app files, with `app.js` as entry point. Compiled to `src/public/js` with webpack
+  │   ├── app
+  │   │   ├── components - Three.js components that get initialized in `main.js`
+  │   │   ├── helpers - Classes that provide ideas on how to set up and work with defaults
+  │   │   ├── managers - Manage complex tasks such as GUI or input
+  │   │   └── model - Classes that set up the model object
+  │   ├── data - Any data to be imported into app
+  │   └── utils - Various helpers and vendor classes
 ```
 
 ## Getting started
@@ -40,7 +51,7 @@ Spins up a webpack dev server at localhost:8080 and keeps track of all js and sa
 npm run build
 ```
 
-Cleans existing build folder while linting js folder and copies over the public assets folder from src. Then sets environment to production and compiles js and css into build.
+Cleans existing build/prod folder while linting js folder and copies over the public assets folder from src. Then sets environment to production and compiles js and css into build.
 
 ## Other NPM Scripts
 You can run any of these individually if you'd like with the `npm run` command:
@@ -49,8 +60,9 @@ You can run any of these individually if you'd like with the `npm run` command:
 * `lint` - Runs lint on the `src/js` folder and uses the `.eslintrc` file in root for linting rules
 * `webpack-server` - Start up a  webpack-dev-server with hot-module-replacement
 * `webpack-watch` - Run webpack in dev environment with watch
+* `dev:dir` - Copy files and folders from `src/assets` to `build/dev`
 * `dev:js` - Run webpack in dev environment without watch
-* `build:dir` - Copy files and folders from `src/public` to `build`
+* `build:dir` - Copy files and folders from `src/assets` to `build/prod`
 * `build:js` - Run webpack in production environment
 
 ## Input Controls

package.json

@@ -5,15 +5,16 @@
   "author": "Paul Graffam",
   "main": "app.js",
   "scripts": {
-    "dev": "run-s dev:js webpack-server",
+    "dev": "run-s dev:dir dev:js webpack-server",
     "build": "run-s prebuild build:dir build:js",
     "prebuild": "run-s clean lint",
-    "clean": "rimraf build",
+    "clean": "rimraf build/prod",
     "lint": "eslint src/js/",
     "webpack-server": "webpack-dev-server --env.NODE_ENV=dev --progress --color --open --hot",
     "webpack-watch": "webpack --env.NODE_ENV=dev --progress --color --watch --hot",
+    "dev:dir": "copyfiles -a -u 2 src/assets/**/*.* build/dev/assets",
     "dev:js": "webpack --env.NODE_ENV=dev",
-    "build:dir": "copyfiles -a -u 2 src/public/assets/**/*.* build/",
+    "build:dir": "copyfiles -a -u 2 src/assets/**/*.* build/prod/assets",
     "build:js": "webpack --env.NODE_ENV=prod --progress --color"
   },
   "dependencies": {

src/html/index.html

@@ -11,9 +11,9 @@
     </section>
 
     <% if (htmlWebpackPlugin.options.env === 'dev') { %>
-    <script src="js/rStats.js"></script>
-    <script src="js/rStats.extras.js"></script>
-    <script src="js/dat.gui.min.js"></script>
+    <script src="assets/vendor/rstats/rStats.js"></script>
+    <script src="assets/vendor/rstats/rStats.extras.js"></script>
+    <script src="assets/vendor/datgui/dat.gui.min.js"></script>
     <% } %>
   </body>
 </html>

src/js/app/helpers/stats.js

@@ -12,7 +12,7 @@ export default class Stats {
     tS = new threeStats(this.renderer.threeRenderer);
 
     rS = new rStats({
-      CSSPath: './css/',
+      CSSPath: './assets/vendor/rstats/',
       userTimingAPI: true,
       values: {
         frame: { caption: 'Total frame time (ms)', over: 16, average: true, avgMs: 100 },