Slide 1

Slide 1 text

/* Code Reviews: CSS edition */ DonutJS elea

Slide 2

Slide 2 text

ALTERNATE TITLE: Decrapifying CSS reviews

Slide 3

Slide 3 text

IT’S NOT JUST YOU reviewing CSS is complicated

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

“But what am I even looking for?”

Slide 6

Slide 6 text

which browsers and platforms do you need it to work on? ESTABLISH BASELINES

Slide 7

Slide 7 text

STANDARDIZE THE THINGS Do you have shared conventions?

Slide 8

Slide 8 text

CSS STYLE GUIDE? Do you have shared conventions?

Slide 9

Slide 9 text

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

Slide 10

Slide 10 text

FUNCTIONALITY + MAINTAINABILITY

Slide 11

Slide 11 text

FUNCTIONALITY UI + UX

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

MAINTAINABILITY is this bit of CSS easily understood and reusable?

Slide 14

Slide 14 text

better CSS reviewing TIPS FOR

Slide 15

Slide 15 text

What can you offload?

Slide 16

Slide 16 text

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

Slide 17

Slide 17 text

What can you offload? SPLIT THE RESPONSIBILITY ROUND 1: PRE-QA BY REVIEWEE ROUND 2: BRING IN REVIEWER(S)

Slide 18

Slide 18 text

Best CSS reviews = collaborative

Slide 19

Slide 19 text

Best CSS reviews = collaborative

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

No content

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

Best CSS reviews = collaborative REVIEWEE: USE YOUR COMMENTS! REVIEWER: DON’T ASSUME CONTEXT (RULES OFTEN HAVE EXCEPTIONS)

Slide 24

Slide 24 text

CONFUSED ABOUT A LINE OF CODE? ASK FOR CLARIFICATION! Best CSS reviews = collaborative

Slide 25

Slide 25 text

(WITH PRACTICE) It’ll all get better! ✨ ✨

Slide 26

Slide 26 text

/* Thank you DonutJS! */ elea