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
- Each class/module should have a single 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
- csscss – https://github.com/zmoazeni/csscss
- csslint – http://csslint.net/
- Style Stats – http://www.stylestats.org/
- preprocessor helpers
- http://go.drewb.io/tmcss-examples
- He then reviewed Dribble and Digg to identify patterns and explained each section.
- “Always be evaluating”
One Comment