Grunt for people who think things like grunt are weird and hard
This presentation is the property of its rightful owner.
Sponsored Links
1 / 7

Grunt for People Who Think Things Like Grunt are Weird and Hard PowerPoint PPT Presentation


  • 210 Views
  • Uploaded on
  • Presentation posted in: General

gulp. gulp. Grunt for People Who Think Things Like Grunt are Weird and Hard. (gulp for people who think things like gulp are weird and hard). By: Elijah Vazquez. What is gulp?. Put simply, its a personal servant! No, it won’t bake you cookies Yes! It does run on windows

Download Presentation

Grunt for People Who Think Things Like Grunt are Weird and Hard

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


gulp

gulp

Grunt for People Who Think Things Like Grunt are Weird and Hard

(gulp for people who think things like gulp are weird and hard)

By: Elijah Vazquez


What is gulp?

  • Put simply, its a personal servant!

    • No, it won’t bake you cookies

  • Yes! It does run on windows

  • and yes...you will have to use Command Line


Why do I need Gulp?

  • You don’t, if you like doing repetitive and time consuming tasks over and over again.

  • It makes you better.

    • not morally, there’s no hope there.


What’s the big idea?

Original Files:

Deliverable Files:

JS

CSS

CSS

JS

body{min-width:960px}.container_12{margin-right:auto;}

Lines = 1

body{

min-width:960px

}

.container_12{

margin-right:auto

margin-left:auto;

width:960px

}

Lines = 8

function loadJSON(){

var data=‘server.php';

var request = new XMLHttpRequest();

try{

//and so on;

Lines = 25

size = 688 bytes

functionloadJSON(){vardata=‘server.php';varrequest=newXMLHttpRequest();try{//and soon;

lines = 1

size = 369 bytes

img

img

Img Size 3 kb

Img Size 5 kb


Plug it in, plug it in!

gulp-htmlbuild 0.2.0 || gulp-dot 1.5.0 || gulp-markdown 0.1.2 || gulp-cssmin 0.1.3 || gulp-grunt 0.4.1 || gulp-hogan-compile 0.2.1 || generator-gulp-plugin-boilerplate 0.1.3 || gulp-commonjs-wrap 0.0.4 || gulp-notify-growl 1.0.1 || gulp-jsmin 0.1.3 || gulp-streamify 0.0.4 || gulp-newer 0.3.0 || gulp-sprite 0.0.4 || gulp-csslint 0.1.3 || gulp-protractor 0.0.7 || gulp-include 0.2.2 || gulp-prompt 0.1.0 || gulp-vartree 0.0.6 || gulp-inline-css 0.2.0 || gulp-ng-html2js 0.1.6 || gulp-docco 0.0.3 || gulp-resolve-dependencies 0.1.0 || gulp-vulcanize 0.1.1 || generator-gulp-plugin 0.4.3 || gulp-gzip 0.0.5 || gulp-jade-react 0.2.0 || gulp-iconfont 0.0.5 || gulp-laravel-validator 0.1.1 || gulp-dust 0.2.0 || gulp-file-include 0.2.0 || gulp-sloc-simply 1.1.1 || gulp-roro 0.4.1 || gulp-strip-debug 0.3.0 || gulp-apidoc 0.0.1 || gulp-twitter 0.0.3 || gulp-smoosher 0.0.2 || gulp-nunjucks 0.2.2 || gulp-manifest 0.0.3 || gulp-ignore 1.0.0 || gulp-mustache 0.2.0 || gulp-es6-transpiler 0.1.1 || gulp-strip-json-comments 0.1.1 || gulp-es6-module-transpiler 0.1.0 || gulp-google-cdn 0.3.0 || gulp-markdown-pdf 0.2.0 || gulp-processhtml 0.0.3 || gulp-mdvars 0.0.1 || gulp-front-matter 1.0.0 || gulp-consolidate 0.1.2 || gulp-regenerator 0.2.0 || gulp-html-prettify 0.0.1 || gulp-recess 0.2.0 || gulp-swig 0.4.0 || gulp-wrap-umd 0.2.0 || gulp-s3 0.1.1 || gulp-uncss-task 0.2.2 || gulp-ftp 0.1.1 || gulp-pandoc 0.2.0 || gulp-tar 0.1.1 || gulp-spawn 0.3.0 || gulp-myth 0.1.1 || gulp-marked 0.2.0 || gulp-jshint-cached 1.4.2 || gulp-template-compile 0.2.0 || gulp-wrap-amd 0.3.0 || gulp-license 0.2.0 || gulp-image-resize 0.4.2 || gulp-soften 0.0.1 || gulp-angular-extender 0.1.0 || gulp-mversion 0.1.0 || gulp-multinject 0.1.0 || gulp-clone 0.1.0 || gulp-extend 0.1.0 || gulp-myth-css 0.1.0duplicate of gulp-myth || gulp-defeatureify 0.1.1 || gulp-redust 0.0.1 || gulp-themer 0.0.1 || gulp-bower-src 0.0.1 || gulp-ssh 0.0.2 || gulp-intercept 0.1.0 || gulp-commonjs 0.1.0 || gulp-sterno-manifest 0.0.1 || gulp-jekyll 0.0.0 || gulp-build 0.0.1 || gulp-tinypng 1.0.2 || gulp-jscoverage 0.1.0 || gulp-local-screenshots 0.0.1 || gulp-batch-replace 0.0.0 || retro-gulp-jade 0.4.2 || gulp-usemin2 0.2.4 || gulp-swig-jst 0.1.0 || vinyl-buffer 0.0.0 || gulp-path-modifier 0.0.1 || gulp-play-usemin 0.0.1 || gulp-pancakes 0.0.1 || gulp-csscss 0.0.1 || gulp-filelog 0.2.0 || gulp-html2js 0.0.1 || gulp-includer 0.0.1 || gulp-markdox 0.1.0 || gulp-sass-graph 1.0.0 || gulp-remove-lines 0.1.0 || gulp-pogo 1.0.0 || gulp-supersede 0.0.1 || gulp-jst-concat 0.0.1 || gulp-jst 0.1.1 || gulp-espower 0.3.0 || gulp-autopolyfiller 1.0.1 || gulp-usemin-query 0.0.1 || gulp.spritesmith 0.1.1 || gulp-tmpl 0.0.3 || gulp-dart2js 0.0.2

AND More


References

  • gulp:

    • http://gulpjs.com

  • Learned cmd line here

    • http://teamtreehouse.com

  • Great article on the whole concept and why its good.

    • http://24ways.org/2013/grunt-is-not-weird-and-hard/

  • Great gulp Tutorial to start you off:

    • http://www.sitepoint.com/introduction-gulp-js/

  • Great Slide show from gulp

    • http://slid.es/contra/gulp


Testing: 1...2...3...

1: What is one way gulp could help improve your everyday workflow?

2: Do you need to be part of a huge team or working on a huge project for gulp to be helpful? Explain.

3: Do you think gulp should have a GUI? What are some advantages of a GUI? Disadvantages?

4: gulp plugins are designed to do one task and one task only, why would they choose to do this? Isn’t more better?


  • Login