How to Prevent Accidental Code Errors with ESLint, Prettier, and Husky

Any software engineer, regardless of their level of advancement and years of experience, may have a worse day and accidentally introduce changes that will result in bugs or simply won’t fit into good code development practices.

Fortunately, there are several ways for you to protect your JavaScript project against such cases.

I assume the first thing that comes to your mind is using various types of tests. Of course, they are the most effective method, but we’ll be dealing with something else in this article.

Instead of testing the functionality of the application to keep your software project safe from accidental developer mistakes, we’ll focus on the code itself. To do this, we’ll use:

• ESLint for analyzing JavaScript code to find potential bugs and bad practices,
• Prettier to format the code in accordance with the adopted standard,
• Husky to allow us for integration with Git hooks that will in turn allow us to automate the two previous tools.

All of these tools work well with any Node.js project. Since I’d like to give you specific examples of configs, I’ll be discussing these using a sample “pure” React.js project created with the Create React App (CRA).