Top 10 VS Code Extensions for Software Developers

Soham Biswas
Level Up Coding
Published in
7 min readNov 23, 2019

--

Visual Studio Code is a text editor developed by Microsoft for Windows, Linux, and macOS. It includes support for debugging, embedded Git control and GitHub, syntax highlighting, intelligent code completion, snippets, and code refactoring.

The features that Visual Studio Code includes out-of-the-box are just the start. VS Code extensions let you add languages, debuggers, and tools to your installation to support your development workflow. VS Code’s rich extensibility model lets extension authors plug directly into the VS Code UI and contribute functionality through the same APIs used by VS Code.

Here are my top 10 VS Code extensions that every software developer must have:

1. GitLens — Git supercharged

GitLens

GitLens is an open-source extension created by Eric Amodio.

GitLens simply helps you better understand code. It allows you to quickly glimpse into whom, why, and when a line or code block was changed. Get a clear overview of how the code evolved. Effortlessly explore the history and evolution of a codebase with the help of this extension.

GitLens Demo

It is very useful for those who contribute to open source. This extension also provides information about the contributor and the date of contribution. This is the ultimate Git extension one can ever have. To install GitLens or to know more about it, visit here.

2. Visual Studio IntelliCode

Visual Studio Intellicode

The Visual Studio IntelliCode extension provides AI-assisted development features for Python, TypeScript/JavaScript, and Java developers in Visual Studio Code, with insights based on understanding your code context combined with machine learning.

This extension provides AI-assisted IntelliSense by showing recommended completion items for your code context at the top of the completions list. The example below shows this in action for Python code.

Visual Studio Intellicode Python Demo

This is basically Visual Studio Intellisense port for VS Code. Language-specific intellisense is also available, but this extension combines and interacts with such language-specific extensions to make autocomplete more efficient. To learn more visit here.

3. vscode-database

vscode-database

This extension provides support for various database service clients such as SQL, PostgresQL, SSL, socked-SQL and more.

There have been times when we swap between our editor and the database client for debugging purposes. This extension saves the pain for you. With the help of this extension, you can open an editor tab to execute SQL queries and view the results in that tab itself. It automatically detects installed databases available on your system path. You can also directly edit the values from the editor itself and it will be saved in the database.

Connection Demo

In the above demo, you can see that setting up a new database connection is very intuitive and easy.

Query demo

This demonstrates the process of connecting and interacting with a database. This extension can also be used to connect remote databases as well. To install or to know more about it this link.

4. tl;dr pages

This extension provides tldr hover information for common commands in bash/dockerfiles/powershell files. tldr pages are a collection of simplified and community-driven manual pages. TL;DR stands for “Too Long; Didn’t Read”. It originates as internet slang where it is used to indicate that a long text (or parts of it) has been skipped as too lengthy.

Here are a few examples of its usage:

Shell Scripts:

Dockerfile:

Batch Files:

To install and know more about this extension, visit here.

5. Rainbow Brackets

Provide rainbow colors for round brackets, square brackets, and squiggly brackets. This is particularly useful for Lisp or Clojure programmers, and of course, JavaScript and other programmers.

The isolated right bracket will be highlighted in red. There are times when our code compiles with an error or a bug due to missing pairs of brackets or a missing closing bracket. This extension provides visual feedback to allow the programmer subconsciously to end with the correct number of brackets in his code.

Here’s a screenshot of how it works:

It also makes your code look colorful ;). For more information on how to install visit this link.

6. Path Intellisense

This Visual Studio Code plugin autocompletes filenames. As the name suggests it helps you autocomplete your file paths.

Its a simple yet powerful tool for most of us software developers as it not only indexes the working directory but also indexes remote drives as well. It is very useful for developers who tend to divide their codebase into multiple modules. It's a huge help for web developers as it helps them link the correct CSS files to the correct HTML files with ease. To know more about this extension visit this link.

7. Markdown Lint

The Markdown markup language is designed to be easy to read, write, and understand. It succeeds — and its flexibility is both a benefit and a drawback. Many styles are possible, so formatting can be inconsistent. Some constructs don’t work well in all parsers and should be avoided. For example, here are some common/troublesome Markdown constructs.

markdownlint is a Visual Studio Code extension that includes a library of rules to encourage standards and consistency for Markdown files. It is powered by markdownlint for Node.js which is based on markdownlint for Ruby. It also provides a markdown previewer with the help of which you can preview your README.md files directly from your editor.

When editing a Markdown file in Code with markdownlint installed, any lines that violate one of markdownlint’s rules will trigger a warning in the editor. Clicking one of the warnings in the dialog will display that rule’s help entry in the default web browser. For more information, visit this link.

8. Prettier

Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary.

This extension supports Prettier plugins when you are using a locally resolved version of prettier. If you have Prettier and a plugin registered in your package.json, this extension will attempt to register the language and provide automatic code formatting for the built-in and plugin languages. To install, visit here.

9. Code Runner

Run code snippet or code file for multiple languages: C, C++, Java, JavaScript, PHP, Python, Perl, Perl 6, Ruby, Go, Lua, Groovy, PowerShell, BAT/CMD, BASH/SH, F# Script, F# (.NET Core), C# Script, C# (.NET Core), VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml Script, R, AppleScript, Elixir, Visual Basic .NET, Clojure, Haxe, Objective-C, Rust, Racket, Scheme, AutoHotkey, AutoIt, Kotlin, Dart, Free Pascal, Haskell, Nim, D, Lisp, Kit, V, and custom commands.

To know more visit this link.

10. Visual Studio Code Remote — WSL

The Remote — WSL extension extension lets you use the Windows Subsystem for Linux (WSL) as your full-time development environment right from VS Code. This new, optimized support lets you:

  • Use Windows to develop in a Linux based environment, using Linux specific toolchains and utilities.
  • Edit files located in WSL or the mounted Windows filesystem (e.g. /mnt/c).
  • Run and debug your Linux based applications on Windows, in VS Code.

Remote — WSL runs commands and extensions directly in WSL so you don’t have to worry about pathing issues, binary compatibility, or other cross-OS challenges. You’re able to use VS Code in WSL just as you would from Windows.

For more information visit this link.

The extensions mentioned above are not in any particular order. Each of these extensions excel in thier own way.

Thank You for reading, have a nice day!!

--

--