07. Using Gulp

Make sure you have gulp installed globally on your machine.

npm install -g gulp

If you are not familiar with Gulp, it is a powerful tool and learning it will serve as a gateway to using many other Javascript technologies. This "Learning Gulp" Youtube series by leveluptuts.com is a great place to start learning.

gulpfile.js establishes a number of tasks to be run in both development and production environments. Examples of what these tasks do:

• On save to a file in browser/js, concatenate all of your front-end Javascript files, save that file into public, reload browser.
• On save to a file in browser/scss, compile browser/scss/main.scss, save file into public, reload browser.

There are many tasks that run, including automated front- and back-end testing, minification (when in production), etc.

Using Gulp in development

Each task can be run independently, but during development, you'll likely want to simply execute this command:

gulp

This begins a process that will watch your files and run necessary front-end tasks. Make sure this process continues to run as you work. To run these tasks without watchers, run:

gulp build

Spending time learning Gulp and reading the gulpfile.js will give you more insight.

Things to note

• The Gulp process is mostly for front-end tasks. The only thing is does with server code is linting (code sniffing) and testing. Gulp does not manage/automatically your server process. You will have to run your server process separately.

• Automatic browser refreshing is triggered by many of the Gulp tasks, but needs the LiveReload extension to work.