Gulp is a streaming build system that uses code over configuration and small plugins. It uses streams to perform tasks like linting, testing, concatenating, and minifying files. This makes the build process faster by reducing I/O operations. Gulp defines tasks using a simple API and watches files, running tasks when changes are detected.

1. Gulp
An Introduction

2. • Detect errors, running test.
• Concatenating and minifying JS, CSS.
• Compile CoffeeScript, SASS, LESS, etc.
• ….

3. “I realized that a task-based build tool with built-
in, commonly used tasks was the approach that
would work best for me” — Ben Alman (03/2012)

5. A new player appears:

6. What is Gulp?
• Streaming build system
• Code over configuration
• Small, idiomatic plugins
• Simple API to use

7. Streams
Lint
Run test
Concatenate
Minify

8. Streams

9. Streams
• Gulp use streams:
• Like the pipe command of *NIX (|)
=> Less I/O operations => Faster building speed

10. Config vs Code

11. Gulp API

12. gulp.src(globs[, options])
Returns a readable stream.
Read files that match with provided globs.

13. gulp.dest(path)
Returns a writable stream.
Write piped file objects to the provided path.

14. gulp.task(name[, deps], fn)
Register a Gulp task.

15. gulp.watch(glob [, opts], tasks)
gulp.watch(glob [, opts, cb])
Watch files and do something when a file changes.

16. Read more…
• GulpJS Homepage
• Gulp by Eric Schoffstall
• Build Wars - Gulp vs Grunt
• Stream Handbook

17. Demo
• You can get it from Dropbox:
• http://goo.gl/iFL9JM

18. About @Vinh Bachsy
• Author: Vinh Bachsy @: bsdvinhuit@gmail.com
• You can follow me at:
• https://plus.google.com/+VinhBachsy
• https://www.facebook.com/vinh.bachsy
• And the Javascript HCM Meetup:
• http://www.meetup.com/JavaScript-Ho-Chi-Minh-City/
• https://www.facebook.com/JavaScriptHCMC
• https://plus.google.com/communities/116105314977285194967