Task Automation (Grunt vs. Gulp)

158df2ad2d800432b505bb1b0e6308c8?s=47 Ghis
August 31, 2015

Task Automation (Grunt vs. Gulp)

In this presentation, I will be sharing about Task automation, from the bottom up on how can you structure, configure, install some of the most essential plugins for better yet smoother front end development, for any web project.

The workshop will cover up the following:
- Installing Grunt & Gulp
- Walkthrough their configurations
- Connect local server on your machine
- Essential Front end development modules
- Deployment

Github (Demo files):
- https://github.com/fatasuir9/wwc-grunt
- https://github.com/fatasuir9/wwc-gulp

158df2ad2d800432b505bb1b0e6308c8?s=128

Ghis

August 31, 2015
Tweet

Transcript

  1. 3.
  2. 4.
  3. 8.

    It’s all about the less work you have to perform

    when doing repetitive tasks such as minification, compilation, unit testing, linting etc..
  4. 10.
  5. 12.
  6. 14.
  7. 18.
  8. 20.
  9. 21.
  10. 22.

    COOL STUFF • Inject references on the go • gulp-inject,

    grunt-injector • Separate tasks into multiple files • require-dir • Create production build • gulp-useref, grunt-useref
  11. 23.

    COOL STUFF • Bundling • gulp-concat, grunt-contrib-concat • Prevent pipe

    breaking caused by errors • gulp-plumber • Transpile ES6 • gulp-babel, grunt-babel
  12. 24.

    SUMMARY • Higher productivity • Overcome repetitive tasks • Speed

    up your workflow • Focus on bigger problems • Ain’t nobody got time for that!!!
  13. 27.

    USEFUL RESOURCES • Grunt • http://gruntjs.com • https://www.youtube.com/watch?v=lGMmkQEJZxU • Gulp

    • http://gulpjs.com • https://www.youtube.com/playlist?list=PLLnpHn493BHE2RsdyUNpbiVn-cfuV7Fos
  14. 28.
  15. 29.
  16. 30.