How the Good Kind of Lint Solves Code Problems | Adept Blog
Of course, we would like to keep our code free of blunders. But how can a team manage an unwieldy programming language in addition to writing good, maintainable code?
Linting provides flexible guardrails that can keep you coding quickly and accurately. Here, I’ll explain the basics of linting, and reasons why it can help your projects.
What is Linting?
Linting tools provide static analysis of your code. These tools don’t run your code to see what happens – they inspect your code, looking for typos or anti-patterns.
A Brief History of Linting
Where Linting is Today
How can Linting Help my Project?
1. Bug Detection
There is a large class of bugs that are the result of typos. Linting tools have saved me hours of time by simply alerting me to mistyped variable names, either where they are declared or where they are (mis)used. Static analysis can easily detect when you attempt to reference a variable that is not in scope; this is usually the result of a typo.
Reading code written in an unfamiliar style is like reading poor handwriting. The information is all there, but it requires inordinate concentration simply to extract to it. Conversely, reading code that adheres to a familiar style allows you to focus on what is important. Whether it’s someone else’s code or your own that you are returning to, having a common style greatly reduces maintainability costs.
Experiencing flow while developing software is priceless. When you are in the zone and ideas flow freely, you create better, more creative code. In the various studies that examine conditions for flow, one common factor is structure; there should be clear goals and ongoing feedback built into the activity. In my experience, real time linting feedback greatly contributes to flow. In addition to feedback, adhering to one code style reduces cognitive load as many small, insignificant decisions are made in advance: indentation, curly brace placement, operator separation, etc.
How to Start the Linting Process
npm install --save-dev eslint
Your editor of choice likely has built in support for ESLint. If not, you should figure out how to get it working—or choose a new editor!
The most important thing you need to get started with ESLint is an .eslintrc file that describes the rules you want to enforce. Below, you will find the configuration that Adept uses for non-transpiled / ES5 projects (as of the time of writing, of course). Most of the style related rules simply emulate JSLint’s original style requirements. Drop an .eslintrc file like this into your project’s root directory and your editor should start using the rules.
Note the use of `“extends”: “eslint:recommended”`. This imports a baseline set of rules that are indispensable.
When working on projects with a transpiled build we are more than happy to make use of new ES2015 syntax. Our .eslintrc for those projects is largely the same as the ES5 version with the following additions:
There is an additional parserOptions block that enables ES2015 rules:
Ben is the Director of Technology at Adept Marketing. With a background in front-end and back-end development, full stack development and network and systems administration, he capably leads the evolution of technology within an aggressively-growing digital agency. He prides himself on being a generalist and a problem solver.