Template designed by Javascript Task Automation Antonio Turibbio Liccardi @turibbio http://codingbad.net
Aug 16, 2015
Template designed by
Javascript Task Automation
Antonio Turibbio Liccardi@turibbiohttp://codingbad.net
Full-stack developer @ blexin
Co-founder di DotNetCampania
Contributor su GetLatestVersion.it
chi sono
Dev
• Project setup• Css Manipulation
(Sass/Less)• JS Lint• Live Reload• Watch for changed files• Code Analysis
Release
• Compile• Unit Testing• Integration Testing• Concatenation,
Minification, Vendoring• Image minification• Deployment
Cosa automatizzare?
Grunt vs Gulp
Grunt
• Configuration over code (json)
• File based• >4000 plugins
Gulp
• Code over configuration
• Stream based• >2000 plugins
gulp.task()
Consente di definire un task tramite l’uso di una funzione. Si possono dichiarare anche delle dipendenze, che vengono eseguite prima dell’esecuzione del task in parallelo
gulp.src()
Consente di specificare i file di input per l’intera stream pipeline
Gulp API
gulp.dest()
Consente di specificare l’output dello stream
gulp.watch()
Consente di osservare dei file e di lanciare un task alla loro modifica
Gulp API
JSHINT
identifica errori e potenziali problemi
JSCS
Javascript code style checker
Entrambi richiedono un set di regole in JSON (.jshintrc, jscsrc, sono riconosciuti dagli editor)
Code Analysis
Con Gulp possiamo automatizzare la compilazione di css usando Less o Sass, possiamo minificare, offuscare, concatenare
CSS manipulation
Tramite l’uso di nodemon
possiamo, a seguito di una
modifica a determinati files,
fare il restart del server node
Auto-Update Dev Server
Con l’uso di Gulp possiamo automatizzare il processo di
preparazione del pacchetto per la nostra build.
Per questo scopo facciamo
uso di useref
Build
Con Gulp è possibile
automatizzare il testing del
nostro codice javascript
Faremo uso di karma
Testing