Linting

at the Next Level

Will Klein

Quick Survey

What is linting?

Compilers

Lexical Analysis

Syntactic Analysis

Linters

  • Syntax checking

Linters

  • Syntax
  • Code style
  • Anti-patterns or best practices

Linting HTML

Quick Story

Why lint HTML?

Browsers

Two ways

  • Lint the output
  • Lint the source

Linting HTML Output

Linting HTML Source

Linting Stylesheets

The Tools

  • CSS Lint
  • Stylelint

Linting JavaScript

JavaScript

Complexity

Conventions

The Tools

  • JSLint
  • JSHint
  • ESLint

ESLint

 

Adoption

Benefits

  • Catch errors
  • Improve code quality
  • Speed up developers
  • Share best practices

Process

  • Convince everyone (optional)
  • npm install
  • Import a community config

or

  • Create a config based on what you already do

Evolve

  • What bites you
  • Code reviews
  • Defects
  • Write your own rules

Thank you!

http://willkle.in

will.klein@gmail.com

@WillsLab

 

Linting at the Next Level

By Will Klein

Linting at the Next Level

  • 1,673