Fight the Rot - Refactor stinky JavaScript

Fight the RotRefactor stinky JavaScript

@damienklinnertDonnerstag, 18. Juli 13

a typical day?

• Mr. Wheatley, owner of Copy+Paste Inc., asks for a (simple) change in his web store

• backstage passes should rise by 3 points in quality, if there are less than 6 days to event

Donnerstag, 18. Juli 13

Donnerstag, 18. Juli 13

WAAAAAT???Donnerstag, 18. Juli 13

Donnerstag, 18. Juli 13

the hacky way ™

Donnerstag, 18. Juli 13

Donnerstag, 18. Juli 13

Donnerstag, 18. Juli 13

done!(?)git add * && git commit && git push

Donnerstag, 18. Juli 13

6 minutes passed now

Donnerstag, 18. Juli 13

Refactoring

Donnerstag, 18. Juli 13

Donnerstag, 18. Juli 13

Donnerstag, 18. Juli 13

Donnerstag, 18. Juli 13

Donnerstag, 18. Juli 13

Donnerstag, 18. Juli 13

Donnerstag, 18. Juli 13

Donnerstag, 18. Juli 13

step by step tut

Donnerstag, 18. Juli 13

done!(?)git add * && git commit && git push

Donnerstag, 18. Juli 13

refactoring is disciplined technique for restructuring an existing body of code, altering its internal structure without

changing its external behavior

Donnerstag, 18. Juli 13

refactoring

• break dependencies

• bring system under tests

• refactor

• add feature

• measure code quality

Donnerstag, 18. Juli 13

break dependencies

• factories, abstract factories

• dependency injection knit.js

• pass as parameter

Donnerstag, 18. Juli 13

add tests

• mocha, karma.js

• instrument with istanbul, js-coverage

• test current behavior, not expected

Donnerstag, 18. Juli 13

refactor

• few good tools around for js

• pair programming

tools sublime plugin, no really tools

Donnerstag, 18. Juli 13

add feature

• design patterns

Donnerstag, 18. Juli 13

measure code quality

• plato.js

• jscomplexity

• node-madge

Donnerstag, 18. Juli 13

clean code

• everything is pretty much what you expect

• documented

• as if by one and the same author

• following your style guide

Donnerstag, 18. Juli 13

bad code

• detect with jsmeter

• or jshint complexity settings

• not linted

• not tested

• complex

Donnerstag, 18. Juli 13

thank you!

follow me on twitter @damienklinnert

Donnerstag, 18. Juli 13