javascript task runners - gulp & grunt
TRANSCRIPT
![Page 1: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/1.jpg)
JavaScript Task RunnersGulp & Grunt
Lohith G N
![Page 2: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/2.jpg)
About Me …
Microsoft MVP (Visual Studio & Development)Technical Evangelist
@kashyapahttp://www.kashyapas.comhttp://about.me/kashyapa
Lohith G N
![Page 3: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/3.jpg)
Agenda• Web Development Tasks• What is a Task Runner• Why Task Runner• Gulp• Grunt
![Page 4: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/4.jpg)
WEB DEVELOPMENT TASKSWhat tasks do you perform for deployment ?
![Page 5: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/5.jpg)
Deployment Tasks• Compile SASS to CSS• Compile LESS to CSS• Concatenating JavaScript• Minifying JavaScript• Testing your code (JavaScript)• Linting your code (JavaScript) • …
![Page 6: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/6.jpg)
BUILD SYSTEMS OR TASK RUNNERSWhat are they ?
![Page 7: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/7.jpg)
Build Systems• Collection of Tasks• Automate Repetitive Work• Also called Task Runners
![Page 8: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/8.jpg)
Modern Front End Workflow
PackageManagers
Preprocessors Task Runners & Build Tools
![Page 9: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/9.jpg)
Modern Front End WorkflowPackage
ManagersBower NPM
Preprocessors CSS (SASS, LESS) JavaScript HTML
Task Runners & Build Tools Gulp Grunt
![Page 10: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/10.jpg)
GULPStreaming Build System
![Page 11: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/11.jpg)
http://gulpjs.com
![Page 12: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/12.jpg)
GRUNT
![Page 13: JavaScript Task Runners - Gulp & Grunt](https://reader036.vdocuments.mx/reader036/viewer/2022062412/58f2208c1a28ab54498b45b7/html5/thumbnails/13.jpg)
Configuration over Codehttp://gruntjs.com