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

Code Reviews: CSS edition

Code Reviews: CSS edition

Also known as "decrapifying CSS reviews" or how to do CSS reviews and do them well. As presented at DonutJS.

F8c11ed34857ab2344451d22107d6686?s=128

Elea Chang

August 30, 2016
Tweet

More Decks by Elea Chang

Other Decks in Technology

Transcript

  1. /* Code Reviews: CSS edition */ DonutJS elea

  2. ALTERNATE TITLE: Decrapifying CSS reviews

  3. IT’S NOT JUST YOU reviewing CSS is complicated

  4. None
  5. “But what am I even looking for?”

  6. which browsers and platforms do you need it to work

    on? ESTABLISH BASELINES
  7. STANDARDIZE THE THINGS Do you have shared conventions?

  8. CSS STYLE GUIDE? Do you have shared conventions?

  9. CSS STYLE GUIDE? FRAMEWORK? Do you have shared conventions?

  10. FUNCTIONALITY + MAINTAINABILITY

  11. FUNCTIONALITY UI + UX

  12. None
  13. MAINTAINABILITY is this bit of CSS easily understood and reusable?

  14. better CSS reviewing TIPS FOR

  15. What can you offload?

  16. What can you offload? SEMANTICS: THERE’S (PROBABLY) A PLUGIN/ EXTENSION/TOOL

    FOR THAT
  17. What can you offload? SPLIT THE RESPONSIBILITY ROUND 1: PRE-QA

    BY REVIEWEE ROUND 2: BRING IN REVIEWER(S)
  18. Best CSS reviews = collaborative

  19. Best CSS reviews = collaborative

  20. None
  21. None
  22. None
  23. Best CSS reviews = collaborative REVIEWEE: USE YOUR COMMENTS! REVIEWER:

    DON’T ASSUME CONTEXT (RULES OFTEN HAVE EXCEPTIONS)
  24. CONFUSED ABOUT A LINE OF CODE? ASK FOR CLARIFICATION! Best

    CSS reviews = collaborative
  25. (WITH PRACTICE) It’ll all get better! ✨ ✨

  26. /* Thank you DonutJS! */ elea