KonMariCSS

How to Tidy Your Space and Change Your Life

Transcript

1. KonMari CSS How to Tidy Your Space and Change Your Life*
2. Vincent Nalupta Senior Software Engineer @snailbites
3. HUNGRY + ANGRY = HANGRY
4. First, some context...
9. ¯\_(ツ)_/¯
10. The KonMari Cleaning Method
11. KonMari CSS How to Tidy Your Space and Change Your Life*
12. ANALYZE PLAN REFACTOR OPTIMIZE
13. ANALYZE PLAN REFACTOR OPTIMIZE
14. “Place every piece of clothing in the house on the floor.”
15. File size Selector count Maintainability Load times
16. cssstats.com
18. 360 KB (76KB minified gzipped)
19. "Before you start, visualize the destination"
20. ANALYZE PLAN REFACTOR OPTIMIZE
21. Identify your goals
22. 1 month 3 months 1 year
23. What problems are you trying to solve?
24. Settle on a naming convention
25. .parent <section class=”parent”> </section> -child <div class=”parent-child”> </div> -gchild <p class=”parent-child-gchild”> ... </p>
26. .box--delivery .box--pickup
28. UI Testing
29. https://github.com/webdriverio/webdrivercss
30. "The moment you start, you reset your life."
31. ANALYZE PLAN REFACTOR OPTIMIZE
32. Refactor a single file “Code as Craft”
35. Break
36. File size Selector count Maintainability Load times
37. ANALYZE PLAN REFACTOR OPTIMIZE
38. Style guide driven development
40. Demo
42. Find the outliers
43. http://bit.ly/2evMYuw
44. End Game
46. Build some bridges!
48. @snailbites http://snailbites.com/blog/
49. (504) 229-6828 #KonMariCSS