Featured - Top 5 Extensions for VS Code

Hey Everyone, Welcome to Think & Free. Today I’m gonna do some Review of some coolest Microsoft Visual Studio Code Editor Extensions. Extensions will improve features & usability in Visual Studio Code Editor. Let’s look at some 5 of the coolest extensions in, VS Code.

Visual Studio Code Editor

It is an Open-Source, text editor/ source code editor. Visual Studio Code developed by Microsoft and it will support Microsoft Windows, Linux, Mac Systems. Visual Studio Code is one of the top code editors in 2020. Some developers say “it was the best”. here is the official web site link for the VS Code editor. get installed and try how it feels.

How to Open Up Extension Manager

In Visual Studio Code Editor Left pane(Activity bar), you can see some icon, looks like this. Go there and hover over that icon. by clicking on this icon you can open up Extension Manager window in VS Code.

Extensions view icon

Or Visual Studio Code editor will provide a keyboard shortcut for Open this Extension Manager Window. this is the way to open up Extension Manager by using Keyboard shortcut (ctrl+shift+x).

Now you can simply type extension name and install it on your Visual Studio Code Editor. Let’s see, What are the top 5 of coolest extensions/ plugins to vs code made easy to usability.

01. Python Language Support for VS Code

Python Language Support Extension - Top 5 Extensions for VS Code

Python Extension is a language support plugin for visual studio code editor. It supports, debugging, IntelliSense, linting, code navigation, code formatting, Jupyter notebook support, refactoring, variable explorer, test explorer, snippets, and more. Before installing this extension on your VS Code Editor you must setup & install the python environment on your system correctly. Make sure you have successfully installed python on your system, Let’s see how to install this extension on our VS Code Editor.

  • step 01 – open up Visual Studio Code Editor Extension Manager Window, Now type “python” in that little search box. And hit enter key.
  • step 02 – click "install" the button, now the installation process has been started. wait for done.
  • step 03 – Once, Installation process will be completed, now you can open your python projects in Visual Studio Code Editor.

02. C/C++ Language Support for VS Code

C/C++ Language Support Extension - Top 5 Extensions for VS Code

C/C++ is another language support extension for VS Code. It supports to C & C++ languages with IntelliSense and debugging. before installing this extension you must install GCC on your system. in windows, you need to install MinGW Environment. the reason is MinGW comes with GCC and other support tools for Microsoft Windows Systems.

In our previous lessons, In Express Learning Programming Series I did some lessons on How to install MinGW & How to Configure Correctly MinGW on Windows System. If you have not an idea, you can go there and get an idea about how to do it. Here is the way to install C/C++ Extension on Visual Studio Code Editor.

  • step 01 – go to the Extension Manager, and type “C/C++“, now goes to the first option it will provide.
  • step 02 – click “install”, option, it will start the installation process. once it will be completed, now you can start your C/C++ Projects in VS Code.

03. Live Server for VS Code

Live Server - development local Server for Visual Studio Code Editor - Top 5 Extensions for VS Code

Live Server is another cool, some more usual Extension. it is a local server Extension and It will Provide live reload feature for static & dynamic web pages. Installation process same as others. let’s look at how to use it.

Usage:

  • step 01 – Open a project and click to Go Live from the status bar to turn the server on/off. 
  • step 02 – Right-click on a HTML file from Explorer Window and click on Open with Live Server
  • step 03 – Open an HTML file and right-click on the editor and click on Open with Live Server
  • step 04 – Hit “(alt+L, alt+O)” to Open the Server and “(alt+L, alt+C)” to Stop the server (You can change the shortcut form keybinding). [On MAC, cmd+L, cmd+O and cmd+L, cmd+C]
  • step 05 – Open the Command Palette by pressing F1 or ctrl+shift+P and type Live Server: Open With Live Server to start a server or type Live Server: Stop Live Server to stop a server.

04. PowerShell Language Support Extension for VS Code

Live Server - development local Server for Visual Studio Code Editor - Top 5 Extensions for VS Code

PowerShell Extension is a language support extension for PowerShell Scripts. It supports syntax highlighting, Code snippets, and more features. using this extension with VS Code Editor you can use VS Code as an IDE Program for PowerShell Scripting.

Installation Procedure is the same with other extensions, you can find this Extension on Visual Studio Code Editor Extension Manager window. After installing it on Visual Studio Code Editor it will automatically, configured for your Editor.

If you had some problem with setup this extension on Visual Studio Code, here is the official documentation for PowerShell with Visual Studio Code.

05. One Dark Pro Theme for VS Code

One Dark Pro Theme - Top 5 Extensions for VS Code

Here is another extension, it’s actually not an extension. It was a theme. One Dark Pro is a Dark UI theme for VS Code, It is an Atom’s iconic One Dark theme. One Dark Pro is the most downloaded theme for Visual Studio Code. Let’s see how to install One Dark Pro on Visual Studio Code Editor.

  • step 01 – Go to Extensions and Search for “One Dark Pro“. And install it on your Visual Studio Code Editor.
  • step 02 – After successfully installed “One Dark Pro” Theme on your VS Code Editor, VS Code will prompt little dialog box it will ask for what do you want a color theme?
  • step 03 – Now select “One Dark Pro” in there.

If after the installation VS Code didn’t prompt any dialog box?. Go to File > Preferences > Color Theme. or you can use a shortcut for it. Here It is “Ctrl+K Ctrl+T“. Now you can see Atom One Dark in there select it, Now it’s automatically added to your Visual Studio Editor Color Theme.

If you had questions or tell me your ideas about this in the comments. see you back soon with another day.

Leave a Reply

Your email address will not be published. Required fields are marked *