Sub4Sub network gives free YouTube subscribers
Get Free YouTube Subscribers, Views and Likes

Build a Modern JS Project - #4 Pre-commit with Husky u0026 lint-staged

Follow
Code Realm

As a followup to the last video about ESLint and Prettier, we'd want to ensure that our code is linted before it gets merged to master. Of course, we should have good faith in our team mates and remind them to run ESLint against their branch before they assign us to their merge request. But aside from bad intentions, people can sometimes simply forget to lint their work manually, especially if they are in a hurry.

You, as a code reviewer, can easily miss an improper use of quotes or semicolons. Oftentimes, we'd rather let that slide and focus on features and bug fixes that bring a business value. After all, an extra tab is not worth arguing over and ruining relationships. That's why things like these should be automated in the first place, so they never come up again! Luckily, there are tools at our disposal that can assist us with that.

For one, we can use husky https://github.com/typicode/husky which is a small utility for setting up precommit and prepush hooks. Right before a commit or push is made, you can run a task, such as lint any staged files or run the test suite (which we'll get back to later). Husky plays particularly well with lintstaged https://github.com/okonet/lintstaged so we'll get both of them set up.

As a side note, you might have also come across precommit https://github.com/precommit/precommit It's very similar to husky, and either one can be used to configure precommit hooks.

An excellent post on cleaning up your code with tools like ESLint and Prettier https://medium.freecodecamp.org/these...

Follow up the repo on GitHub https://github.com/alex996/reactcss...

posted by CydayCitambumyy