Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Vangelis Dimitriadis - Modern frontend workflows - WordCamp Athens 2016

A717e9d055b2284e573b2412e32f5397?s=47 WordPress Greek Community
November 19, 2016
Programming
0
150

Vangelis Dimitriadis - Modern frontend workflows - WordCamp Athens 2016

A717e9d055b2284e573b2412e32f5397?s=128

WordPress Greek Community

November 19, 2016
Tweet

More Decks by WordPress Greek Community

See All by WordPress Greek Community
A717e9d055b2284e573b2412e32f5397?s=48 wpgr
0
4
A717e9d055b2284e573b2412e32f5397?s=48 wpgr
0
4
A717e9d055b2284e573b2412e32f5397?s=48 wpgr
0
5
A717e9d055b2284e573b2412e32f5397?s=48 wpgr
0
4
A717e9d055b2284e573b2412e32f5397?s=48 wpgr
0
6
A717e9d055b2284e573b2412e32f5397?s=48 wpgr
0
4
A717e9d055b2284e573b2412e32f5397?s=48 wpgr
0
2
A717e9d055b2284e573b2412e32f5397?s=48 wpgr
0
4
A717e9d055b2284e573b2412e32f5397?s=48 wpgr
0
1

Other Decks in Programming

See All in Programming
15934fa2aa7b2ce21f091e9b7cffa856?s=48 manfredsteyer
PRO
2
110
45fec3b965f9269bc8d6d2cf5bd93a13?s=48 haru067
2
570
72a2082c6a4dd79ad68befb3db911616?s=48 mraible
PRO
2
990
36c29634c5d55eae66224c24ba2b933c?s=48 rivuchk
1
150
E0e036f89c14b3e59640318eedf9670b?s=48 bkuhlmann
0
140
3cfad86677c5966ecfe9b81955fa3489?s=48 inoue2002
0
220
Ae7a5166a7b7776ffdd5676c2d6ab42f?s=48 aseiide
1
270
0f8842fabcd31a6c9007ddcd648247db?s=48 kkagurazaka
1
200
5f5d4605866c2db411d5e8d3c4859ab4?s=48 haruguchi
0
240
D63b0683b8fdd02c71c802691f97c04c?s=48 jogannaoki
0
1.3k
3f62dc4b2c8447c38d74267b871e7d37?s=48 solt9029
10
2.8k
D76231a2114896dfcc7b79ac69558b79?s=48 yosuke_furukawa
PRO
45
19k

Featured

See All Featured
79acae287842acf29084005533a7fb3b?s=48 hursman
111
9.5k
C7393b7ba7ec9c8890dd77d209fbb3c9?s=48 maltzj
504
37k
766b9746b59e6f09e280cd33cf4ed419?s=48 skipperchong
13
1k
5b9fe87ec1faa67a4599782930f45ec9?s=48 sstephenson
149
12k
Be9caeb9d4ef9944d151af909063ed6e?s=48 samlambert
238
10k
C9b18d9dff88a9dd2393364c2b3b21bd?s=48 colly
70
3.2k
719435d98d452de7ac367c828266cf01?s=48 erikaheidi
29
5.1k
F68cb25ae3e5c2106997454b13b7737d?s=48 brad_frost
162
6.9k
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
498
130k
E190023b66e2b8aa73a842b106920c93?s=48 zenorocha
302
40k
F29327647a9cff5c69618bae420792ea?s=48 tenderlove
58
3.8k
39488f9d172ab92fd352f2cd7b73258d?s=48 mza
82
4.4k

Transcript

  1. LETS TALK ABOUT WORKFLOWS Μοντέρνα ροή εργασίας & εργαλεία

  2. Vangelis Dimitriadis @vangelis183 LETS TALK ABOUT WORKFLOWS

  3. PROGRAMMERS ARE F***ING LAZY Swizec Teller LETS TALK ABOUT WORKFLOWS

  4. Μια ροή εργασίας αποτελείται από μια σειρά συνδεδεμένων βημάτων, προκειμένου

    να ολοκληρωθεί μια εργασία. Wikipedia LETS TALK ABOUT WORKFLOWS

  5. Ποιά εργαλεία χρησιμοποιούμε σήμερα; LETS TALK ABOUT WORKFLOWS

  6. None

  7. Τα εργαλεία μας εξελίσσονται. Εμείς; Ο τρόπος δουλειάς μας; LETS

    TALK ABOUT WORKFLOWS

  8. Η επένδυση σε χρόνο/χρήμα σε μια ροή εργασίας θα πρέπει

    να μας επιστραφεί πολλαπλάσια. LETS TALK ABOUT WORKFLOWS

  9. Ποιά εργαλεία υπάρχουν; LETS TALK ABOUT WORKFLOWS

  10. https://medium.com/@withinsight1/the-front-end-spectrum-c0f30998c9f0#.gt4cz03pe

  11. Λεπτή γραμμή μεταξύ χρήσης για χάρη της χρήσης και χρησιμότητας.

    LETS TALK ABOUT WORKFLOWS

  12. Αυτοματοποίηση LETS TALK ABOUT WORKFLOWS

  13. Grunt Gulp Broccoli

  14. Πού χρησιμέυουν; LETS TALK ABOUT WORKFLOWS Compile Convert Tasks automation

    Deploy

  15. Ποιό χρησιμοποιούμε; LETS TALK ABOUT WORKFLOWS Αυτό που μας εξυπηρετεί!

  16. CSS Preprocessors LETS TALK ABOUT WORKFLOWS

  17. LESS SASS

  18. Πού χρησιμέυουν; LETS TALK ABOUT WORKFLOWS variables nesting mixins operators

  19. None
  20. None

  21. Livereload / Browsersync LETS TALK ABOUT WORKFLOWS

  22. None

  23. Πού χρησιμέυει; LETS TALK ABOUT WORKFLOWS Refresh after changes made

    Server via local IP Click sync on multiple devices

  24. UglifyJS LETS TALK ABOUT WORKFLOWS

  25. None

  26. Πού χρησιμέυει; LETS TALK ABOUT WORKFLOWS minify sources performance

  27. Από 1,7 MB σε 331KB

  28. Sourcemaps LETS TALK ABOUT WORKFLOWS

  29. Πού χρησιμέυει; LETS TALK ABOUT WORKFLOWS locate Error minified sources

    „Αντιβιωτικό“ για debugging
  30. None

  31. imageoptim / imagemin LETS TALK ABOUT WORKFLOWS

  32. Και πως συνδέονται όλα αυτά; LETS TALK ABOUT WORKFLOWS

  33. https://nodejs.org/en/

  34. package.json

  35. npm install LETS TALK ABOUT WORKFLOWS

  36. Gruntfile.js

  37. Gruntfile.js

  38. Gruntfile.js

  39. None
  40. None

  41. last but not least … LETS TALK ABOUT WORKFLOWS

  42. Version control LETS TALK ABOUT WORKFLOWS

  43. None
  44. None

  45. https://bitbucket.org/vangelis/wcath2016 LETS TALK ABOUT WORKFLOWS