VSCode Extensions for anyone learning how to code

In the world of programming, your text editor or IDE of choice plays a vital role in how you the program, whether it has essential built-in plugins from error highlighting, or code auto-completion.

Amongst IDEs for programming, VSCode happens to be one of the more popular ones. According to a 2019 Developer Survey where there were over 80,000 respondents, 50% of them chose VS Code to be their IDE of choice, and there are several reasons for VSCode’s popularity. VSCode was built by programmers for programmers

The main reason for VSCode’s popularity (Outside that it was made and pushed by Microsoft), is its ability to install several plugins ranging from productivity tools to code version control tools.

In this article, I’ve provided an extensive list of VSCode extensions and plugins that anyone can use. I’ve categorized these extensions by:

  • Productivity,
  • Aesthetics, and
  • Version Control

For Productivity

TabNine: AutoCompletion Software

Tabnine is known as “The AI Assistant for Software Developers”. Tabnine is a VSCode plugin that allows you, the developer, to code faster with whole line and full-function code completions. Tabnine is that extension you never knew you needed.

This extension predicts and suggests your next lines of code based on the context and syntax of the code. How Cool is that! Tabnine is available for any programming language from the popular ones like Python, to the niche ones like Bash. Tabnine is trusted by millions of Developers who work at companies like Amazon, Bloomberg, BMW, Intel, etc.

New Relic CodeStream

This is a developer collaboration platform that allows the user to perform Github pull requests, Gitlab merge requests, and code reviews directly in your IDE.

New Relic codestream eliminates context-switching and simplifies code discussion and code review by putting the necessary collaboration tools in your IDE. New Relic comes with various integrations such as:

  • Code Hosts: Bitbucket, Github, Gitlab
  • Issue Trackers: Asana, Trello, Azure DevOps, Bitbucket, Clubhouse
  • Observability: New Relic, Pixie
  • Messaging Services: Slack, Microsoft Teams

LiveServer

The LiveServer VScode extension is a quick development that lets the developer launch a local development server with a live reload feature for static and dynamic pages.

Key Features

  • A quick development Live Server with live browser reload
  • SVG Support
  • Customizable Port Number, server root from the default browser
  • Support for Chrom Debugging Attachment
  • Customizable Supporting Tag for Live Reload feature.

For Aesthetics

Colorize

Colorize is a VScode extension that allows developers to instantly visualize CSS colors in their css/sass/less/postcss/stylus/XML files.

Key Features:

  • Generate colour backgrounds for CSS variables, preprocessor variables, rgb/rgba colors, hsl/hsla colors, etc.
  • Color background live update

Icon Fonts

IconFonts is a VScode extension that allows the developer to find snippets for popular icon fonts such as Font Awesome, Ionicons, Glyphicons, Octicons, Material Design icons, etc. Icon Fonts is also available for Atom and Sublime Text Editor.

For Version Control

Git Lens

Git Lens helps you visualize code authorship at a glance via Git blame annotations and Code lens, gain valuable insights via rich visualizations, powerful comparison commands, seamlessly navigate and explore Git Repositories, and so much more.

In short, Git lens simply helps you better understand code. Git lens is powerful, feature-rich, and highly customizable to meet your needs.

Key Features:

  • Effortless revision navigation
  • A status bar blame
  • On-demand file annotations
  • Many rich sidebar views
  • Rich remote provider integrations

Git History

Git History is a VSCode extension that allows programmers to view and search git logs along with the graph details. It also comes with other cool features like:

  • Viewing a previous copy of the file
  • View the history of a file
  • View the history of an Author
  • Allows you to compare branches, commits, and files across commits.

VSCode Extensions are one of the greatest things given to us programmers and developers. They have been built to make our lives easier.

Guest post by Raphael Madu

Originally written on Medium.com and Subscribe