Are you a web developer? Are you a programmer? Are you a web designer? Or no matter who you are, if you have coded, it may not be that you haven't heard the name of the
VS code editor.
Because it is a great free code editor. Which is also used by most big developers. Then why don't you use it? And if you have used it, today we will discuss five great extensions of VS code to make your use more fun. Using them will make your job much easier. So let's start without further ado.
Many of us know how to install extensions in VS code. And those who do not know they can install in the rules shown below.
To install the extension in VS code, first open your VS code. Then you will see an option like below in the sidebar.
If you click on the last option from here, you will get the option to install the extension. You can easily install the extension you need from there. Now what are those five extensions? Let's discuss what they do.
1. Live Server
This extension will be very useful for those of us who design web. Those of us who design it, go to the browser and refresh the page to check the code of a part. Even if we add a single code, we have to refresh the page to see which is a very annoying task. And we can use the live server extension to solve this problem. To install the extension we will go to the extension option from the code editor. Then I will go there and type Live Server in the search bar. After writing this, we will see an extension like below.
From here we can install by clicking on the Install button next to the extension. If you want, you can install it by clicking on the extension. So we will click on the extension.
You can also install the extension by clicking the install button from here. You can go to the bottom to know the work of this extension. Then you can easily know its work. Once the extension is installed, close your code editor and open it again. After opening, you will see a button called Go Live at the bottom right of the bar in your editor. Now when you open the file you want to run in the browser, click on the Go Live button, then they will create a port for you and the file will run in the browser. And whenever you make a change to the code inside the file, your file in the browser will be automatically refreshed.
2. Cobalt 2
This is a theme of VS code. Which is pretty awesome to see. And while it would be nice to see a code editor theme, it would also be great to work there. So you can use this theme to make your code editor more attractive. To install it, go to the extension option again and type Cobalt 2 in the search bar. Then you will see an extension of a theme like below.
From here you can install the extension as per previous rules. Then press ctrl + k and ctrl + t from the keyboard to activate your code editor and you will see a panel like below.
Select the cobalt2 theme from here. Then the theme will be activated in your code editor.
3. Material Icon
Icons also need to be made attractive to make the code editor attractive. If you don't like the icons that are normal after installing VS Code Editor, you can use this extension. So type Material Icon Theme in the search bar. Then you will see an extension like below.
Also install it from here as per previous rules. Then you will see that the icons of the folder and file of your code editor have changed. And it looks a lot better than before.
4. Bootstrap 4 and Font Awesome 5
Boothstrap and Font Wesam are two of the most important things we can do right now to design a website. It is seen that many times when we code, we do not remember their classes. Most of the time it is seen in the case of Font Wesam. And there are extensions to solve this problem. To use it, type Bootstrap 4 and Font Awesome 5 in the search bar. Then you will see an extension like below.
From here you will also install it as per the previous rules. Then whenever you go to code it will give you suggestions and you can easily add the class by clicking from there. And just by typing the name of the icon, the class of the icon in the font wesam will show in the suggestion. Clicking there, the icon will be added.
5. Quokka js.
These were five extensions. So far so good for today.