A quick intro to why you might use Gulp and how to get started. Produced for the May KnoxvilleJS Meetup. See a sample gulpfile from a recent project at https://gist.github.com/raddevon/35ce4c50855d8334ff2f

1. Gulp.js
Your build process will thank you.
Devon Campbell
Presentation available online at bit.ly/knoxjsgulp

2. Gulp lets you establish a consistent build
process up-front and run it every time
you’re ready to deploy.

5. Example: CSS prefixing with
gulp-autoprefixer
!
var prefix = require('gulp-autoprefixer');
!
!
gulp.task('css', function() {
return gulp.src('style.css')
.pipe(prefix("last 2 versions", "> 5%"))
.pipe(gulp.dest('style.css'))
});
https://www.npmjs.org/package/gulp-autoprefixer

6. Now you know why you would use a task
runner, but why would you choose Gulp?

7. Advantages of Gulp over Grunt
• Asynchronous by default
• Uses streams to avoid intermediary files

8. How to get started
• Install node & npm (http://nodejs.org/)
• Install Gulp globally (npm install -g gulp)
• Set up a blank package.json in your project
• Install Gulp for the project (npm install --save-dev gulp)
• Add gulpfile.js in your project and start adding plugins
{
"devDependencies": {}
}
var gulp = require(‘gulp');
!
gulp.task('default', function(){
// Default task code
});
!

9. Resources
• Code Fellows- Quick intro to Gulp.js
http://www.codefellows.org/blogs/quick-intro-to-gulp-js
• The Front-end Tooling Book- Gulp chapter
http://tooling.github.io/book-of-modern-frontend-tooling/build-systems/
gulp/introduction.html
• Nodejitsu- 9 gulp.js plugins for a great build system
https://blog.nodejitsu.com/npmawesome-9-gulp-plugins/
• Gulp Plugins Directory
http://gulpjs.com/plugins/

10. Thank you!
Presentation available online at bit.ly/knoxjsgulp
Devon Campbell | devon@radworks.io
Check out RadWorks at radworks.io.