Front-End Boilerplate

Boilerplate project for front-end development built using gulp.

Tools

• Sass + Autoprefixer: CSS
• Browserify + JSHint + JSCS: JavaScript
• Watchify: Faster Browserify builds
• BrowserSync: Live reload static web server

Setup

1. Install Node

Make sure you have the latest version. Type this in a command prompt (or WebStorm terminal):

node -v

2. Install gulp

npm install -g gulp

3. Install Node modules

Navigate to the project folder before entering this command. Modules are defined in package.json.

npm install

Development

Gulp is used for automating build tasks. Tasks are defined in gulpfile.js.

To get started, type this command:

gulp

Install new development-related modules (e.g., gulp plugins) via npm install --save-dev module-name. Install front-end modules (e.g., jquery) via npm install --save module-name.

Maintenance

Use npm-check-updates for updating dependencies in package.json. Make sure to run npm update any time package.json is updated.

Getting Started Resources

• npm registry
• npm docs
• package.json docs
• package.json cheatsheet