My Project

This project was scaffolded with generator-wbp.

Features

• gulp for running tasks
• browserify for loading node modules on the front-end, with the following plugins:
  • babelify for transforming JavaScript with Babel
  • browserify-shim for shimming scripts which don't follow a module pattern
  • easily include more browserify plugins
• BrowserSync for running the local server (it's loaded with features)
• templating logic for views featuring:
  • YAML front matter available under page.var
  • data files available under site.data.filename.var, similar to Jekyll (currently supports only YAML)
  • Lo-Dash templating
• Fetch API polyfill wrapped as a convenience helper
• FontFaceObserver for reducing FOIT when using webfonts
• ESLint for JS & JSX linting
• Sass for CSS pre-processing (using libsass)
• PostCSS for CSS post-processing, with the following plugins:
  • postcss-flexbugs-fixes for fixing some of the flexbugs
  • autoprefixer for adding vendor prefixes
  • easily include more PostCSS plugins
• sourcemaps JS & CSS
• Normalize.css for normalizing styles across browsers
• imagemin for image optimization
• SVG for icons (<symbol> + <use>) + polyfill for IE
• Mocha as the test framework
• WebdriverIO as Node.js bindings for Selenium
• PhantomJS as the browser for testing with WebdriverIO, so make sure you have it installed

.babelrc is where you can set your Babel options globally, it will be picked up by both babel-core and babelify.

Usage

There are some shortcut scripts in the package.json that you can run [using npm][scripts].

Start the local server at http://localhost:9000 and watch files for changes:

❯ npm start

Run tests:

❯ npm test

Make a compressed production-ready build:

❯ npm run build

Preview the build, make sure nothing is broken:

❯ npm run preview

Deploy to S3 using AWS CLI:

❯ npm run deploy

This script needs to be adjusted according to your S3 data, or replace it with another script if you're deploying to somewhere else.