Front End Design Conference – Drew Barontini – Thinking Modular CSS

https://twitter.com/drewbarontini

Slides:  http://talks.drewb.io/tmcss-score/

    • “Front-end development is a thing”
    •  tl;dr
      • Smaller parts
      • Independently created
      • Used in different systems
    • Breaking your CSS down into smaller chunks will ultimately make it more maintainable
    • Single responsibility principle
      • Each class/module should have a single responsibility
        • Use a comment block to explain the responsibility
    • Stick to using classes.  Avoid using IDs.
    • Establish naming conventions
    • “This is how it is now, until we change it” – Nick Walsh
    • MVCSS – http://mvcss.github.io/
    • BEM methodology – http://bem.info/method/ & http://bem.info/
    • Inspiration
      • OOCSS
      • BEM
      • Suit
      • SMACSS
      • intuit.css
    • Avoid magic numbers (or leave a comment if you need to use one)
    • Helps to come up with standards to reuse throughout projects.
    • Do a front-end audit – https://github.com/drewbarontini/front-end-audit
    • Don’t be afraid to write something specifically and then abstract it
    • Check out
    • http://go.drewb.io/tmcss-examples
    • He then reviewed Dribble and Digg to identify patterns and explained each section.
    • “Always be evaluating”