Top 5 Visual Studio Code Extensions That Every Front End Developer Needs 2022

Hi 👋, my purpose is to guide you to become a professional developer. For now, we will look at the best VSCode extensions.

3 min readOct 22, 2021

If you like this type of posts follow me :) I’ll appreciate it too much ❤.

What is Visual Studio Code?

Visual Studio Code is a lightweight but powerful source code editor which runs on your desktop and is available for Windows, macOS and Linux. It comes with built-in support for JavaScript, TypeScript and Node.js and has a rich ecosystem of extensions for other languages (such as C++, C#, Java, Python, PHP, Go) and runtimes (such as .NET and Unity). https://code.visualstudio.com/docs

Let’s Start! 🚀

1. Auto Rename Tag

Auto Rename Tag is a VS Code extension for Front End Developers focusing on HTML writing. Auto Rename Tag renames the second tag as the first one in real-time:

2. Better Comments

Tired of boring and gray comments on your editor? Better Comments is designed to help you write human-friendly comments in your code. This extension also adds color by type of comment to find them faster.

3. Prettier — Code Formatter

Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary. Stop formatting your code with multiple tabs, Prettier does it for you.

4. Bracket Pair Colorizer

Bracket Pair Colorizer allows matching brackets to be identified with colours. The user can define which tokens to match, and which colours to use. Never get lost again between so many brackets.