Configure Prettier on VS Code and IntelliJ

Bismillah.

We will configure Prettier as our formatter for javascript especially for React JS. So, let's start!

Prettier Configuration on VS Code
First, open Visual Studio Code. Then go to extension and looking for plugin named Prettier.
Once installed, go to Preferences->Settings. Search for '@lang:javascript setting'. Click on 'edit in settings.json'

add this line:-

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

Prettier Configuration on IntelliJ IDEA
execute at the command line yarn global add prettier
Open IntelliJ. Look for plugin name Prettier and install
Once installed, go to setting. Search for Prettier. Select the Prettier package. Tick on the On 'Reformat Code' action and On save. Click Apply. Now you are good to go.