Static analysis tools

Hi !

Static Analysis tools

This week I've been setting up code formatters for my project.

To format the code I used prettier.

To remove lints from the code I used Eslint.

Setting up these tools for your project is not complicated at all. I will briefly cover steps to do that.

Prettier:

1) Run npm install --save-dev --save-exact prettier to install prettier

2) Create empty config file for your rules with the following command:

echo {}> .prettierrc.json

3) Create .prettierignore file and write files and folders you want prettier not to format

ESLint:

Setting up is very similar to prettier.

1) Run npm init @eslint/config

2) Open created .eslintrc.{js,yml,json} file

3) Write rules for ESLint

Overview

These tools are very powerful and make our life easier. You just code and don't worry about formatting. To be honest, previously when I didn't know about code formatters, I used to manually fix the indentation in files. Uh, that was a work :D

I added "prettier": "npx prettier --write ." to the scripts of package.json file in order to run prettier from command line with npm run prettier.

Also, added "eslint": "npx eslint ." to the scripts of package.json file, so I can run npm run eslint.

After I run these tools, code becomes more readable and structured.

How to integrate tools with IDE?

To integrate these tools with IDE we need to add .vscode folder to the root of project and add settings.json file, specifying which prettier we would like to use.

Code formatters are great!

I truly enjoy that tools like prettier exists, they simplify the process of coding. You just save and all formatting is done automatically!