Grunt.js for PHP Developers

Introduction to Grunt.js for PHP Developers. Slides from my 15 minute talk at the ViennaPHP meetup on April 9, 2014.

Transcript

1. Grunt.js for PHP Developers
2. Florian Eckerstorfer Developer in Vienna ViennaPHP, 9 April 2014
3. 1 2 3 Grunt.js For PHP Developers Demo
4. Grunt.js 1
5. Task Runner (Phing, Make, Ant, …) Automate repetitive tasks Written in JavaScript Node.js
6. Getting Started Install Node.js nodejs.org Node Packet Manager (NPM)
7. grunt-cli npm install install globally -g
8. grunt npm install --save-dev save to package.json
9. Let’s create some tasks
10. Make Makefile Phing build.xml Ant build.xml Grunt Gruntfile.js
11. Gruntfile.js module.exports = function(grunt) { // Project configuration. grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), ! // Tasks }); ! grunt.loadNpmTasks('PLUGIN_NAME'); ! // Default task(s). grunt.registerTask('default', ['TASK_NAME']); }; ['TASK_NAME_1','TASK_NAME_2']
12. grunt-contrib-cssmin npm install --save-dev
13. Gruntfile.js module.exports = function(grunt) { // Project configuration. grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), cssmin: { dist: { files: { 'css/main.min.css': ['css/main.css'] } } } }); ! grunt.loadNpmTasks('grunt-contrib-cssmin'); ! // Default task(s). grunt.registerTask('default', ['cssmin:dist']); }; Task name Target name Options
14. For PHP Developers 2
15. Backend & Frontend Asynchronous Plugins
16. grunt-phpunit npm install --save-dev
17. Gruntfile.js module.exports = function(grunt) { grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), phpunit: { test: { dir: '', options: { bin: 'bin/phpunit', configuration: 'app/phpunit.xml' } }, }, }); ! grunt.loadNpmTasks('grunt-phpunit'); ! grunt.registerTask('test', ['phpunit:test']); };
18. What else?
19. grunt-phpcs grunt-phplint grunt-php-cs-fixer grunt-phpmd grunt-phpspec …
20. grunt-symfony2 npm install --save-dev
21. Gruntfile.js module.exports = function(grunt) { grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), 'sf2-cache-clear': { options: {}, dev: {}, prod: {} } }); ! grunt.loadNpmTasks('grunt-symfony2’); };
22. Demo 3
23. What’s next?
24. gruntjs.com
25. gruntjs.com/plugins
26. grunt-contrib-watch grunt-concurrent grunt-load-config
27. Questions?
28. Florian Eckerstorfer florian@eckerstorfer.co http://florian.ec @Florian_