😎 Make VS Code your home 🏠 using these awesome extensions 💻
Tags: productivity, javascript, vscode, beginners
Published: 2022-04-09 11:06:36

_Wait... VS Code my home? What do you mean huh?_
Making it your home means never wanting to leave that beautiful editor.

![home](https://c.tenor.com/cZ-ykWAldV0AAAAM/chi-chis-sweet-home.gif)

Here I show you some of the most useful extensions for VS Code that makes the editor so nice that you will code this way:

![fast..fast..faster](https://c.tenor.com/z4_HKSF6Nx8AAAAM/typing-jim-carrey.gif)

### Let's start!

### 1. [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare)

This extension is pretty pretty useful for collaborative coding. I have myself used it quite a few times.
You just need to start a live session with that button in the image below and a link will be copied to your clipboard. Other team members just need to use that link.

![live-1](https://aka.ms/vsls/quickstart/share)
![live-2](https://aka.ms/vsls/quickstart/guest-join)

---
### 2. [Indent Rainbow](https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow)

This extension makes coding so beautiful. The rainbow indents (as can be seen in the gif below) look so pretty that I don't want to go to any other place to code!

![indent-rainbow](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/onxtgchwc5rom8w56opz.gif)

---
### 3. [Live SASS Compiler](https://marketplace.visualstudio.com/items?itemName=ritwickdey.live-sass)

If you are a frontend dev and have worked with SASS on VS Code, you must have used this extension. But if you are that _Somewhere-in-my-own-world-yeah_ human then I tell you to use it. 
Just a click of the <u>Watch SASS</u> button and your SASS will be continuously watched and will get converted to CSS in no time!

![live-sass](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pcgx87ppcxwoczv2tzh6.gif)

---
### 4. [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker)

If english is not your first language or you make a lot of typos or you just love those squiggly lines under text, then this extension is for you! 
Underlines the text that is not in its dictionary and suggest the closest possible words.

![code-spell](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4y7f743qyp9392g77tpk.gif)

---
### 5. [GitLens](https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens)

If you use Git, then you must be using this. BUT if you are again that _I-am-still-in-my-world_ human, this extension gives superpower to Git. 
Wondering how, watch the gif below!

![git-lens](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o2cp1ipycbo00x1ahghp.gif)

---
### 6. [Code Runner](https://marketplace.visualstudio.com/items?itemName=formulahendry.code-runner)

_You know, I know that this whole file will give a lotta errors in the console but the lines 5 to 10 seems perfect. I just wanna run those but... how?_
Code Runner got you covered. This runs the lines you select (yes exactly those lines)

![code-runner](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oy31ogixoabkg2kcev3t.gif)

---
### 7. [Polacode](https://marketplace.visualstudio.com/items?itemName=pnp.polacode)

If you write blogs or you are _I-love-code-images_ human, this extension is very useful.
See the gif below to see how it works.

![polacode](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yt7o2zszh6osx0flrjka.gif)

Output:

![polacode-output](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/45voaunvf6wfjyhccfzm.png)

---
### 8. [Chronicler](https://marketplace.visualstudio.com/items?itemName=arcsine.chronicler)

Well, if you have watched those gifs attentively then you must have noticed I am recording those with something called Chronicler. 
This extension is pretty useful to record gifs like those.
Visit the extension link on more information of how to use it.

![chronicler](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qrzrbsxz1or16im4a6es.png)

---
### 9. [JavaScript (ES6) Code Snippets](https://marketplace.visualstudio.com/items?itemName=xabikos.JavaScriptSnippets)

This one - I can't live without. This makes writing JavaScript way fast and interesting. See the gif below and visit the extension link to know more about the code letters you can use. 

![JS-code-snippets](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1geqy3uft08t88f2dd86.gif)


---

Plus, of-course this **[Emmet Cheat Sheet](https://docs.emmet.io/cheat-sheet/)**.

It is already available in VS Code and makes writing code (again) faster!

Hope this helps you! See you around!

![bye](https://res.cloudinary.com/practicaldev/image/fetch/s--m0l6e1PL--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://c.tenor.com/dndGxR4-vE4AAAAM/see-ralph.gif)