<p>Visual studio code is my go-to editor for programming. Due to its wide range of extensions and support from Microsoft this editor is widely adopted. Visual studio code is built on top of open source Monaco editor by Microsoft. This project receives around 170k stars in Github.</p>
<p><img src="../../../../uploads/1744908875100-vscode-header.webp" alt="" width="800" height="300"></p>
<div>Visual studio code offers a wide range of extension. Here is how to install the extension. Press SHIFT+COMMAND (or Windows)+X or just click on the extension icon of visual studio code. Search for the extension and press install.</div>
<div><img class="aligncenter wp-image-129 size-full" src="../../../../uploads/1744908322539-top-5-visual-studio-code-extension.png" alt="" width="640" height="412"></div>
<div>Here are my top 5 picks of must-have visual studio code extensions.</div>
<div>
<h2>1: GitLens</h2>
We use Git almost every day of our life. Gitlens is the visual studio code plugin to supercharge git capabilities. With Gitlens, it&rsquo;s so easy to view code authorship, check commit number, view changes between the last commit and existing changes and so on. <img class="aligncenter wp-image-127 size-full" src="../../../../uploads/1744908344470-top-5-visual-studio-code-extensions-gitlens.png" alt="" width="610" height="216"> Gitlens will save you tons of time by avoiding unnecessary code merges. I highly recommend Gitlens to you and I am not alone, around 3000 developers stars this project on Github. To install Gitlens in visual studio code, open the extension tab and search for Gitlens. Install it by using the Install button.
<h2>2: ESLint</h2>
ESLint is the linting utility for JavaScript. It checks your code for common errors and lets you know in the editor itself. It&rsquo;s like a virtual peer who is validating your code while you are writing it.</div>
<p>&nbsp; <img class="aligncenter wp-image-128 size-full" src="../../../../uploads/1744908375836-top-5-visual-studio-code-extension-eslint.gif" alt="" width="640" height="377"> To save tons of time in debugging and to produce quality code, this extension is a must-have for the Visual code studio users. Before installing ESLint in visual studio, install it as a global package first.</p>
<pre class="codecolorer-container text twitlight">npm install -g eslint</pre>
<div>To install ESLint in visual studio code, open the extension tab and search for ESLint. Install it by using the Install button.
<h2>3: Debugger from chrome</h2>
This extension is exclusively designed for front end developers using chrome. One of the key reasons why Chrome is a go-to browser for developers is because of its debugger.<span id="ezoic-pub-ad-placeholder-109" class="ezoic-adpicker-ad"></span><span id="div-gpt-ad-codeforgeek_com-box-4-0" class="ezoic-ad ezfound" data-google-query-id="CO3siLuQkeECFY1LKwodY50IDA"></span> Chrome shipped the powerful debugger with its browser for testing. You can set breakpoint, view data at each step and figure out the error in no time.</div>
<div><img src="../../../../uploads/1744908719465-debugging-in-web-application-using-vscode.jpg" alt="" width="624" height="331"></div>
<div><span style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;">This extension allows you to add the capabilities of Chrome debugger in visual studio code. You don&rsquo;t need to switch windows back and forth between editor and browser. Write and test your code inside the editor itself. To install Debugger from chrome extension in visual studio code, open the extension tab and search for Debugger from chrome. Install it by using the Install button.</span></div>
<div>
<h2>4: Project Manager</h2>
Do you work on multiple projects and switch back and forth? I know I do and the project manager has been a savior to manage multiple projects in visual studio code. <img class="aligncenter wp-image-130 size-full" src="../../../../uploads/1744908416753-top-5-must-have-visual-studio-code-extension-project-manager.gif" alt="" width="426" height="443"> I recommend this because of its clutter-free organization and easy to manage projects features. Install the plugin, create projects and switch between projects in a simple keystroke. No hassle to find folders and files. To install the Project manager in visual studio code, open the extension tab and search for a Project manager. Install it by using the Install button.
<h2>5: Path intellisense</h2>
Importing code from other files is what everyone does on a daily basis. This extension makes the development time faster by autocompleting file names. You type the name of the file in statements and it will search and give you suggestion. <img class="aligncenter wp-image-131 size-full" src="../../../../uploads/1744908461814-top-5-must-have-visual-studio-code-extension-file-manager.gif" alt="" width="480" height="270"> Pretty awesome, isn&rsquo;t it! To install Path IntelliSense extension in visual studio code, open the extension tab and search for Path intellisense. Install it by using the Install button.
<h2>Conclusion</h2>
Visual studio code is a really amazing editor. Heads up to Microsoft for building such an awesome piece of software for developers. Let me know in comments which extension you use that is helping you to up your game.</div>

Visual studio code is my go-to editor for programming. Due to its wide range of extensions and support from Microsoft this editor is widely adopt...

Top 5 Must Have Visual Studio Code Extensions