Make your code look pretty - Prettier

VS Code Marketplace offers more than 15k+ extensions to the developers. These extensions save tons of hours & make the VS sCode developer experience more & more impressive. All of these extensions are open-source which means you can contribute to any of your favorite extensions.

🙌🏻 Today we are going to talk about an extension that has made my life & the life of 6M+ developers so much easier.

Prettier - Auto-formatting with VS Code

Prettier is an opinionated code formatter that lets you format your code any way you like. It provides a lot of customizable options that you can use to define standards for your code. Hence, this ultimately allows you to code more & more without worrying about formatting. ⚡️

My Workflow

It would be unfair of me not to share with you folks my personal workflow with the Prettier. I like to code carefree. Formatting the code every time I write something new is a bit of a hassle for me. Also, there are some other settings that I prefer, like single quotes over double quotes, etc.

So to take care of that, I use a combination of VSCode settings that allows my code to format using Prettier. If you are interested in adapting my workflow, follow the steps below.

→ STEP 1

Open your VS Code Settings and set the Auto Save to afterDelay.

→ STEP 2

The next & final step is adding some key/value pairs in your settings.json. To open it, press ⌘ command + ⇧ shift + p & then search for settings.json.

Once you find it, hit Enter. It will open a JSON file. Add the following key/value pairs anywhere in this file.

And, voila!! Now you can code carefree just like me.

Cheerios 🙌🏻