DEV Community

Cover image for FrontEnd VSCode extensions
Chaitu Maverick
Chaitu Maverick

Posted on

FrontEnd VSCode extensions

Hi Devs,

In this post I'll be covering the most useful front-end related VSCode extensions.

1 Live Server

  • This extension gives us a dev server on which we can run any web application. It supports auto-reload.

2 Live Sass Compiler

  • Used to compile the css pre-processer sass.

3 HTML CSS Support

  • This extension helps in ID and Class attribute completion.

4 Auto Rename tag

  • It helps in editing the HTML tag names. When we make any modifications to the opening tag, it updates the closing tag as well and vice-versa.

5 Prettier

  • It's a code formatter which works seamlessly with HTML, CSS and JS. It helps in organising the lines, brackets, quotes, semi-colons, spacing, functions and etc every time we save the file.

6 JavaScript ES6 Code Snippets

  • Useful templates for destructing, arrow functions and many other JS features

7 Bracket Pair colorizer

  • Colors the brackets, arrows. Helps in visualising the code blocks.

8 Code Spell Checker

  • Very useful extension which helps in catching the spell errors in the code.

9 REST Client

  • This extension is similar to postman and helps in making a request to REST endpoints from the VSCode itself.

10 GitLens

  • Gives a lens into the git repository, displays the branches, contributors, git stats.

Discussion (0)