JavaScript Task Automation Frameworks - BDotNet Jan UG Meet
-
Upload
svswaminathan -
Category
Technology
-
view
532 -
download
0
Transcript of JavaScript Task Automation Frameworks - BDotNet Jan UG Meet
![Page 1: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/1.jpg)
JavaScript Task Automation Frameworks
@svswaminathan Jan 23, 2016
![Page 2: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/2.jpg)
2
About me• Swaminathan Vetri• Developer @ Target• Experienced on windows/web development using Microsoft technologies,
Hybrid mobile app development using Cordova, AngularJS, Ionic• Passionate on exploring, learning and sharing about technologies• Gadget freak, Amateur photographer, novice tech/travel blogger
![Page 3: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/3.jpg)
3
What do we learn today ??
• What is task automation ?• Why do we need automation ?• What are the popular tools ?• Automation demos
![Page 4: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/4.jpg)
4
Common tasks
Unit tests Static code analysis Minification
Concatenation Live reloadManaging
dependencies
and many more …
![Page 5: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/5.jpg)
5
Popular tools for automation…
![Page 6: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/6.jpg)
6
• Bower (bower.io) – package manager for the web• Eases the process of managing all the client side dependencies like
other JS frameworks, libraries, utilities, assets.• Getting Bower -> npm install –g bower• Installing other packages -> bower install <package name>
![Page 7: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/7.jpg)
7
Demo
![Page 8: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/8.jpg)
8
• Grunt (http://gruntjs.com/) - The JavaScript Task Runner• Purely an automation tool - that works based on Configuration• Rich set of plugins for most commonly used tasks • Grunt-CLI and Grunt plugins do the magic• Getting started -> “npm install –g grunt-cli”• Gruntfile.js is at the crux of Grunt
![Page 9: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/9.jpg)
9
What can you do with a Gruntfile ?
• Define tasks configuration• Load tasks – tasks can be custom written or from pre-existing grunt
plugins available via npm• Register tasks• Execute grunt tasks -> “grunt <taskname>”
![Page 11: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/11.jpg)
11
• Yeoman (Yeoman.io) – Scaffolding tool for the modern web apps• Exposes generators for various types of web application which
scaffolds the template• Uses bower and grunt internally to manage dependencies and
automate the workflow• Getting started -> npm install –g yo• Npm install –g generator-* (* - can be aspnet, angular, backbone,
ionic etc.,)
![Page 12: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/12.jpg)
12
Demo
![Page 13: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/13.jpg)
13
• Cordova hooks – Helps in tapping into Cordova Events to customize them. E.g., after_build, after_platform_add etc.,• Provides more flexibility to streamline the build process of Cordova
based applications• Hooks can be defined either by • adding Scripts inside predefined “hooks” directory (getting deprecated)• Defining scripts in “config.xml” (recommended way)• Plugin developers can define plugin hook events in “plugin.xml”
![Page 14: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/14.jpg)
DemoCode available at : http://bit.ly/bdotnet-hooks-demo
![Page 15: JavaScript Task Automation Frameworks - BDotNet Jan UG Meet](https://reader036.fdocuments.net/reader036/viewer/2022080419/58ab93bc1a28abe3188b54fb/html5/thumbnails/15.jpg)
Thank youQuestions/Feedbacks -> @svswaminathan