0
Automatizácia vývoja
Kompilácia
class Person
constructor: (@name = 'John Doe') ->
greet: ->
console.log "Hi! My name is #{@name}"
1. CoffeeScript
2. ???
var Person;
Person = (function() {
function Person(name) {
this.name = name != null ? name : 'John Doe';
}
Person.prototyp...
module.exports = (grunt) ->
grunt.loadNpmTasks 'grunt-contrib-watch'
grunt.loadNpmTasks 'grunt-contrib-coffee'
grunt.initC...
Minifikácia kódu
var Person;
Person = (function() {
function Person(name) {
this.name = name != null ? name : 'John Doe';
}
Person.prototyp...
2. ???
var Person;Person=function(){function e(e){this.name=e!=null?e:"John
Doe"}e.prototype.greet=function(){return console.log(...
module.exports = (grunt) ->
grunt.loadNpmTasks 'grunt-contrib-uglify'
grunt.loadNpmTasks 'grunt-contrib-cssmin'
grunt.init...
Minifikácia obrázkov
1. Obrovský obrázok
2500 KB
2. ???
2500 KB => 125 KB
3. Profit!!!
module.exports = (grunt) ->
grunt.loadNpmTasks 'grunt-contrib-imagemin'
grunt.initConfig
imagemin:
files:
expand: true
cwd...
module.exports = (grunt) ->
grunt.loadNpmTasks 'grunt-svg2png'
grunt.initConfig
svg2png:
files:
src: ‘originals/*.svg'
des...
module.exports = (grunt) ->
grunt.loadNpmTasks ‘grunt-responsive-images'
grunt.initConfig
responsive_images:
options:
size...
module.exports = (grunt) ->
grunt.loadNpmTasks 'grunt-spritesmith'
grunt.initConfig
sprite:
src: 'originals/icons/*.png',
...
Buildovanie
module.exports = (grunt) ->
...
grunt.initConfig
watch:
files: 'coffee/*.coffee'
tasks: ['coffee', 'concat', 'uglify']
1. ...
2. ???
module.exports = (grunt) ->
...
grunt.initConfig
watch:
files: 'coffee/*.coffee'
tasks: ['coffee']
grunt.registerTask 'bui...
Ka dý si postavil devstack.ž
Kdo íká, e ne, staví ho dodneška.ř ž
— Martin Malý
GIT SUBMODULE
NOT EVEN ONCE
Bower
// shell
bower install bootstrap --save
1. Potrebujem Bootstrap
2. ???
// bower.json
{
"name": "my-project",
"version": "0.1.0",
"dependencies": {
"jquery": "~2.1.1",
"bootstrap": "~3.1.1"
}
}
...
3.1.4
TEAMWORK, P ČO✱
⇥ versus ··
·· versus ····
• kó d menej náchylnýk chybám
• optimalizovanýkó d
• znovupoužite nýkomponentovýkó dľ
• open-source
• automatické testy
• ...
Riki Fridrich, fczbkk.com
Riki Fridrich - Grunt, Gulp a spol. - Automatizáciou k maximalizácii lenivosti
Riki Fridrich - Grunt, Gulp a spol. - Automatizáciou k maximalizácii lenivosti
Riki Fridrich - Grunt, Gulp a spol. - Automatizáciou k maximalizácii lenivosti
Riki Fridrich - Grunt, Gulp a spol. - Automatizáciou k maximalizácii lenivosti
Riki Fridrich - Grunt, Gulp a spol. - Automatizáciou k maximalizácii lenivosti
Riki Fridrich - Grunt, Gulp a spol. - Automatizáciou k maximalizácii lenivosti
Riki Fridrich - Grunt, Gulp a spol. - Automatizáciou k maximalizácii lenivosti
Upcoming SlideShare
Loading in...5
×

Riki Fridrich - Grunt, Gulp a spol. - Automatizáciou k maximalizácii lenivosti

3,434

Published on

Published in: Engineering, Business, Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
3,434
On Slideshare
0
From Embeds
0
Number of Embeds
20
Actions
Shares
0
Downloads
6
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • rozdeliť na veci ktoré chcete pri každej zmene
    a veci ktoré chcete pred publikáciou
  • Transcript of "Riki Fridrich - Grunt, Gulp a spol. - Automatizáciou k maximalizácii lenivosti"

    1. 1. Automatizácia vývoja
    2. 2. Kompilácia
    3. 3. class Person constructor: (@name = 'John Doe') -> greet: -> console.log "Hi! My name is #{@name}" 1. CoffeeScript
    4. 4. 2. ???
    5. 5. var Person; Person = (function() { function Person(name) { this.name = name != null ? name : 'John Doe'; } Person.prototype.greet = function() { return console.log("Hi! My name is " + this.name); }; return Person; })(); 3. Profit!!!
    6. 6. module.exports = (grunt) -> grunt.loadNpmTasks 'grunt-contrib-watch' grunt.loadNpmTasks 'grunt-contrib-coffee' grunt.initConfig watch: files: 'coffee/*.coffee' tasks: ['coffee'] coffee: files: 'js/my_project.js': 'coffee/*.coffee' Gruntfile.coffee
    7. 7. Minifikácia kódu
    8. 8. var Person; Person = (function() { function Person(name) { this.name = name != null ? name : 'John Doe'; } Person.prototype.greet = function() { return console.log("Hi! My name is " + this.name); }; return Person; })(); 1. Neminifikovaný kód
    9. 9. 2. ???
    10. 10. var Person;Person=function(){function e(e){this.name=e!=null?e:"John Doe"}e.prototype.greet=function(){return console.log("Hi! My name is "+this.name)};return e}() 3. Profit!!!
    11. 11. module.exports = (grunt) -> grunt.loadNpmTasks 'grunt-contrib-uglify' grunt.loadNpmTasks 'grunt-contrib-cssmin' grunt.initConfig uglify: files: 'js/my_project.min.js': 'js/my_project.js' cssmin: files: 'js/my_project.min.css': 'js/my_project.css' Gruntfile.coffee
    12. 12. Minifikácia obrázkov
    13. 13. 1. Obrovský obrázok 2500 KB
    14. 14. 2. ???
    15. 15. 2500 KB => 125 KB 3. Profit!!!
    16. 16. module.exports = (grunt) -> grunt.loadNpmTasks 'grunt-contrib-imagemin' grunt.initConfig imagemin: files: expand: true cwd: 'originals/' src: '*.{jpg,png,gif}' dest: 'optimized/' Gruntfile.coffee
    17. 17. module.exports = (grunt) -> grunt.loadNpmTasks 'grunt-svg2png' grunt.initConfig svg2png: files: src: ‘originals/*.svg' dest: 'images/' Gruntfile.coffee
    18. 18. module.exports = (grunt) -> grunt.loadNpmTasks ‘grunt-responsive-images' grunt.initConfig responsive_images: options: sizes: [{width: 320}, {width: 640},{width: 1024}] files: expand: true cwd: 'originals/' src: '*.jpg' dest: 'images/' Gruntfile.coffee
    19. 19. module.exports = (grunt) -> grunt.loadNpmTasks 'grunt-spritesmith' grunt.initConfig sprite: src: 'originals/icons/*.png', destImg: 'build/sprites.png', destCSS: 'build/sprites.css' Gruntfile.coffee
    20. 20. Buildovanie
    21. 21. module.exports = (grunt) -> ... grunt.initConfig watch: files: 'coffee/*.coffee' tasks: ['coffee', 'concat', 'uglify'] 1. Pomalý watch
    22. 22. 2. ???
    23. 23. module.exports = (grunt) -> ... grunt.initConfig watch: files: 'coffee/*.coffee' tasks: ['coffee'] grunt.registerTask 'build', ['coffee', 'concat', 'uglify'] 3. Profit!!!
    24. 24. Ka dý si postavil devstack.ž Kdo íká, e ne, staví ho dodneška.ř ž — Martin Malý
    25. 25. GIT SUBMODULE NOT EVEN ONCE
    26. 26. Bower
    27. 27. // shell bower install bootstrap --save 1. Potrebujem Bootstrap
    28. 28. 2. ???
    29. 29. // bower.json { "name": "my-project", "version": "0.1.0", "dependencies": { "jquery": "~2.1.1", "bootstrap": "~3.1.1" } } 3. Profit!!!
    30. 30. 3.1.4
    31. 31. TEAMWORK, P ČO✱
    32. 32. ⇥ versus ·· ·· versus ····
    33. 33. • kó d menej náchylnýk chybám • optimalizovanýkó d • znovupoužite nýkomponentovýkó dľ • open-source • automatické testy • zvýšenáproduktivita… • …celého teamu Následky automatizácie
    34. 34. Riki Fridrich, fczbkk.com
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×