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 once and 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 and should not manage and automatically restart your server process. You will have to and should run your server process separately.

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