DEV Community

Cover image for FrontEnd VSCode extensions

FrontEnd VSCode extensions

chaitanyavsh profile image Chaitu Maverick ・2 min read

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)

Editor guide