idiot proofing your code

69
Jarrod Overson - @jsoverson Achieving Maintainability

Upload: jarrod-overson

Post on 15-Jan-2015

370 views

Category:

Technology


1 download

DESCRIPTION

Talk given at South Bay JS in Jun-2014 about automation, complexity, and creating maintainable projects.

TRANSCRIPT

Page 1: Idiot proofing your code

Jarrod Overson - @jsoverson

AchievingMaintainability

Page 2: Idiot proofing your code

a . k . a .

Page 3: Idiot proofing your code

Idiot proofing your code

Page 4: Idiot proofing your code
Page 5: Idiot proofing your code
Page 6: Idiot proofing your code

( psst, we’re all idiots )

Page 7: Idiot proofing your code

We do stuff like…

❯ pi 3.141592653589793

❯ pi(2) 6.283185307179586

Page 8: Idiot proofing your code

Or…

❯ 4..Days() 345600000

❯ 60..Seconds() 60000

Page 9: Idiot proofing your code

And even…

<script src="#"></script>

Page 10: Idiot proofing your code

What was clever six months agoclever

Page 11: Idiot proofing your code

Is idiotic todayidiotic

Page 12: Idiot proofing your code

We’re not awful people

Page 13: Idiot proofing your code

We’re just smart

Page 14: Idiot proofing your code

We’re just lazysmart

Page 15: Idiot proofing your code

We’re justlazysmart

bored

Page 16: Idiot proofing your code

We’re just

lazysmart

boredevil

Page 17: Idiot proofing your code

We’re just doing our job

Page 18: Idiot proofing your code

And our job is hard

Page 19: Idiot proofing your code

How do we get better at it?

Page 20: Idiot proofing your code

EXAMINE1

2

3

Page 21: Idiot proofing your code
Page 22: Idiot proofing your code

How much analysis do you run on your code?

Page 23: Idiot proofing your code

It’s not enough.

Page 24: Idiot proofing your code

KNOW YOUR LINTERS

JSHINT

ESLINT

JSCS

Community-driven JSLint fork. High configurability.

JSHint alternative. High configurability.

Code style checker. Separate and complementary.

WHAT ABOUT JSLINT AND CLOSURE LINTER?

Page 25: Idiot proofing your code

KNOW YOUR LINTER’S OPTIONS

Page 26: Idiot proofing your code

"maxparams" : 4 "maxdepth" : 4 "maxstatements" : 20 "maxlen" : 100 "maxcomplexity" : 7

SET NUMERIC LIMITS

Page 27: Idiot proofing your code

WHAT IS CYCLOMATIC COMPLEXITY?

Page 28: Idiot proofing your code

CYCLOMATIC COMPLEXITY IS THE NUMBER OF PATHS

THROUGH YOUR CODE

TECHNICALLY

Page 29: Idiot proofing your code

CYCLOMATIC COMPLEXITY IS HOW HARD

YOUR CODE IS TO TEST

PRACTICALLY

Page 30: Idiot proofing your code

!function main(a) { !}

COMPLEXITY : 1

Page 31: Idiot proofing your code

function main(a) { if (a > 5) { } }

COMPLEXITY : 2

Page 32: Idiot proofing your code

function main(a) { if (a > 5) { ! } else { ! } }

COMPLEXITY : ?

Page 33: Idiot proofing your code

function main(a) { if (a > 10) { ! } else if(a > 5) { ! } }

COMPLEXITY : 3

Page 34: Idiot proofing your code

function main(a) { if (a > 5) { if (a > 10) { ! } } }

COMPLEXITY : 3

Page 35: Idiot proofing your code

function main(a) { if (a) { } else if (a) { } ! if (other) { } ! for (var i = 0; i < a; i++) { if (i % 2) { } else if (i % 3) { } } }

COMPLEXITY : 7

Page 36: Idiot proofing your code

GENERATE VISUAL REPORTS

Page 37: Idiot proofing your code
Page 38: Idiot proofing your code

code coverageistanbul

jscoverblanket

Page 39: Idiot proofing your code
Page 40: Idiot proofing your code

platocomplexity

maintainabilitylint errors

Page 41: Idiot proofing your code

MAINTAINABILITY?fn(averageEffort, averageComplexity, averageLines);

fn(difficulty, volume)fn(length, vocabulary)

fn(uniqueOperators, totalOperands, uniqueOperands)

fn(uniqueOperators, uniqueOperands)

fn(totalOperators, totalOperands)

Page 42: Idiot proofing your code

doc coveragethis

existdoesn’t

Page 43: Idiot proofing your code

AUTOMATE2

3

1

Page 44: Idiot proofing your code
Page 45: Idiot proofing your code

IF IT’S NOT EASYIt won’t be done

IF IT’S NOT AUTOMATEDIt will only get done once.

IF IT’S NOT VISUALIZEDIt might as well not be done at all

Page 46: Idiot proofing your code

Build firstBefore you write code, set up your build

Page 47: Idiot proofing your code

But that’s annoying!

Page 48: Idiot proofing your code

Look into yeomanManages file copies, conflicts, prompts, defaults

Page 49: Idiot proofing your code

But I don’t want to learn Yeoman!

Page 50: Idiot proofing your code

$ npm install yo generator-generator !$ mkdir generator-myWorkflow !$ cd generator-myWorkflow !$ yo generator

Page 51: Idiot proofing your code
Page 52: Idiot proofing your code

But I don’t need all that!

Page 53: Idiot proofing your code
Page 54: Idiot proofing your code

Delete, add, and modify It’s surprisingly easy.

Page 55: Idiot proofing your code

Grunt VS Gulpit doesn’t matter, just choose one.

Page 56: Idiot proofing your code

What about…• MAKE • RAKE • JAKE • ANT • BROCCOLI • blahhhh…

Page 57: Idiot proofing your code

it doesn’t matterjust choose one.

( but be ready to support it )

Page 58: Idiot proofing your code

Want code coverage?grunt-contrib-jasminegrunt-mocha-istanbulgrunt-jscoverageand 30 more

Page 59: Idiot proofing your code

Want linting?grunt-contrib-jshintgrunt-eslintgrunt-jscs-checkerand 50 more

Page 60: Idiot proofing your code

Want docs?grunt-contrib-yuidocgrunt-jsdocgrunt-doccoand 90+ more

Page 61: Idiot proofing your code

There’s no excusefor manual process

Page 62: Idiot proofing your code

PROTECT3

1

2

Page 63: Idiot proofing your code
Page 64: Idiot proofing your code

‣ Code style ‣ Metrics ‣ Build tools ‣ Data formats ‣ Naming conventions ‣ Curly Braces ‣ Directory structure ‣ Everything

ENFORCE‣ Automate Everything

‣ VCS hooks ‣ CI ‣ Code reviews ‣ Reports ‣ Everything

‣ Warnings === errors ‣ Make it hard to be

wrong

DOCUMENT‣ Treat docs as code ‣ Make it

‣ easy to find ‣ easy to read ‣ easy to update ‣ easy to discuss

‣ Use github!

AGREE

GET EVERYONE TOGETHER

Page 65: Idiot proofing your code

Your automation choice needs to accommodate enforcement

Page 66: Idiot proofing your code
Page 67: Idiot proofing your code
Page 68: Idiot proofing your code

Recap

your analysis

your enforcement

your everything

Automate

Automate

Automate

Page 69: Idiot proofing your code

Jarrod Overson - @jsoverson

AchievingMaintainability