DEV Community

Abdullah Al Mamun Fahim
Abdullah Al Mamun Fahim

Posted on

1

Adding Static Analysis tools

For this weeks lab, we are supposed to add Static Analysis tooling. So we are supposed to add source code formatter, linter, IDE integration, Pre-Commit hook and CONTRIBUTING.md.

For my source code formatter, I choose Pretter. It is very popular and I have seen it other projects but I never had to set it up from scratch so I wanted to do that. First thing I did was go to thier docs and followed their install instructions. I also updated the .prettierignore so that I could exclude the files and directories I don't want to be formatted. Then I ran

prettier --write .
Enter fullscreen mode Exit fullscreen mode

from the install docs. It worked so I added a npm script "prettier": "prettier --write ." so that I can run it easily in the command line. I reverted all the changes since a lot of the changes are not something I wanted in my project. So I went to options section to define my own format. Then I ran and committed the changes. Most of the changes were from enforcing single quotes and changing EOL from CRLF to LF.

For my linter I chose ESLint. Similar to Prettier I have never set it up. The docs for ESLint was kinda hard to follow. But similar to prettier I went to the docs then to the get started. Followed and ran the scripts to install it by running npm init @eslint/config@latest. After I ran

npx eslint .
Enter fullscreen mode Exit fullscreen mode

and it worked. There was no errors thankfully. I also added ignores object so that it doesn't run on node_modules and examples directory. And finally I added npm script so that I can run it easily in the command line.

For my pre-commit hook I choose husky. It was fairly simple. Since I had pre-defined scripts on my package.json it was just adding a single line npm run clean. I noticed it was running the lint and prettier on the entire code base on the entire codebase which didnt look okay. So I did some research and found lint-staged followed their instructions on installing it and then followed https://github.com/lint-staged/lint-staged?tab=readme-ov-file#packagejson-example to add my custom defined npm script and it was that simple.

My IDE of choice was VS Code. It uses extensions which I already had so I used the workspace docs to define my own.

I believe this is something that should be set up at the very beginning of the repo's life so that all the code-base is the same from the beginning and reduces chance of braking something with future implementation.

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

Billboard image

Create up to 10 Postgres Databases on Neon's free plan.

If you're starting a new project, Neon has got your databases covered. No credit cards. No trials. No getting in your way.

Try Neon for Free →