- Live server - it makes the development of HTML - so much more easier becuase you do not have to reload the page every time you make a change in your css or html file - the plugin does it for you.
- [Live Sass Compiler](Live Sass Compiler) - if you have done enough fron end development then you know that there is a better way doing css - it is sass. The problem with sass is that browsers only understand css so you have to compile it first and this plugin does it for you. Other option is to do it from command line by using sass or node-sass.
- HTML CSS Support - This is built into IDE-s but text editors like VS code aren’t so advanced. But don’t worry! VS code has answer for that. By using this support you get the same functionality as you would get by using an IDE.
- Auto Rename Tag - This a simple plugin for writing HTML faster. For example if you would like to change a tag it will automatically change both of the tags instead of just changing one. Simple but effective!
- Prettier a simple code formatter that makes your life so much more easier. It indents your code and makes your code look so much more better overall.
- JS code snippets - come with prebuilt shortcuts for coding Javascript much faster. For example by typing in nfn you will get creates a named function
const add: (params) => {}
. - Turbo Console Log- This simple plugin allows you to debug the code so much more efficiently by allowing you to console.log the values of arrays or objects and after you are done debugging you can simply delete all the console.log statements with one click.
- Rainbow Brackets - Makes your code more readable by making your braces different color.
- Code Spell Checker - Picture is sometimes worth more than thousand words so the gif below represents what this plugin can do.
Code Spell Checker 10. Rest client - When you are doing front end work it usually means that you are working with some sort of back end data. This usually means that we use an app like postman. Rest client allows you to test Rest api-s straight from your VSCode.
11.GitLens - This is great for working in teams. Basically you can see who did what inside the code. Also you will have feedback if you have uncommited change''
- Auto-Open Markdown Preview - Super useful for writing documentation for your code. This kind of functionality comes built in with IDE-s, but you can mimick the same thing inside VS code by using this plugin.
NB! There is also a page called vs code can do that? Check this page to get more out of the VS code.