Setting up an IDE for on the fly code review

Setting up an IDE for on-the-fly code review

Code review frameworks used

• Prettier for normalizing code styles
• ESLint for identifying problematic code patterns and catching errors

Command Line

Lint code: npm run lint or yarn lint.

Format code: npm run format or yarn format.

⚠️ To ensure there are no merge conflicts due to code styling, run both of the above functions before you stage your files or commit.

VS Code

Install the Prettier extension.

Then, apply the below modifications to your VSCode settings.json:

{
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  }
}

Install the ESLint extension.

Now, your editor should be integrated with the code review tools.

Webstorm (JetBrains)

The two plugins should be bundled with the vanilla Webstorm installation.

Webstorm should automatically detect and process .eslintrc and .prettierrc automatically.