The Future of CSS Isn't CSS

The future of CSS are pre- and post-processors. Let’s explore how we could benefit from a more programmatic approach to writing CSS, and go batshit crazy on Sass.

Demo code to go with this deck: https://github.com/roytomeij/futurecss

Transcript

1. The Future of CSS
   Isn't CSS
   

   View Slide

2. The Present of CSS
   Isn't CSS
   

   View Slide

3. Hi, I'm @Roy
   advancedsass.com
   slides: roy.io/futurecss
   

   View Slide

4. advancedsass.com
   slides: roy.io/futurecss
   

   View Slide

5. Pre-Processors
   vs
   Post-Processors
   

   View Slide

6. What's in a name?
   

   View Slide

7. Pre-Processors
   extend the CSS spec
   

   View Slide

8. Post-Processors
   modify the CSS spec
   

   View Slide

9. vs
   .foo {
   color: replace-color(red);
   }
   .foo {
   color: red;
   }
   

   View Slide

10. Write intention
    revealing CSS
    

    View Slide

11. Variables are
    old news...
    

    View Slide

12. Programming in
    your CSS
    

    View Slide

13. CSS is a
    machine language
    

    View Slide

14. Creativity > Repetition
    

    View Slide

15. Configuration >
    Search & replace
    

    View Slide

16. Fun > Frustration
    

    View Slide

17. Sass is great for
    non-developers too
    

    View Slide

18. To the code!
    

    View Slide

19. The following code
    was copy & pasted by
    trained monkeys.
    Don't try this at home.
    

    View Slide

20. advancedsass.com
    slides: roy.io/futurecss
    

    View Slide