In recent years, VS Code has been the darling of most developers. Are you part of that crowd, too? Why? Tell us about it in the comments session! 😀
If you are in the resistance class and have not yet surrendered or do not even think about surrendering to the firepower of the Microsoft editor, comment as well and leave your point of view, I would like to understand more about your preference.
If you want to know more about what VS Code or other editors is, I recommend reading this article explaining which editor you should use according to developers.
Since the release of Visual Studio Code in 2015, the popularity of the source code editor has only been growing and gaining the space that was shared between publishers such as SublimeText, Atom, Vim, and many others.
About three years ago, I, like other developers working with me, decided to test the exchange of the SublimeText as the Standard editor for VS Code. And I haven’t let go since.
There are some reasons, which led me to opt for the exchange, which is not limited to plugins, but I will not focus on them in that post.
Today I will talk about the 10 main plugins (for me) that I add to the editor whenever I set up a new desktop environment.
Without rolling, let’s get to the point that are the best extensions for open source software purchased in 2016 by Microsoft, the VS Code:
- Quokka
- Beautify
- Live Server
- Javascript (ES6) Code Snippets
- ESLint
- Paste JSON as Code
- Remote – Containers
- GitLens
- Debugger for Chrome
- Markdown All in One
Quokka
Quokka.js is a fast prototyping playground for JavaScript and TypeScript in your VS Code, with access to your project files, embedded reports, code coverage and advanced output formatting.
The execution time values are updated and displayed on your IDE beside your code while you type.
In other words, as you type, the results appear in real-time directly on VS Code.
To gain access to Quokka’s best features, there is the paid version. You know what? Visit the official extension page to learn more about Quokka’s power. 😀
Beautify
It may seem kind of futile at first, but believe me, this extension works like a beauty!
In a practical way, beauty makes the identification of its code by standardizing formatting in a legible and, why not say, beautiful way as the name itself suggests.
If you don’t have the beauty installed yet, install it here.
Live Server
This extension is practically mandatory for you to enjoy the front-end environment.
With Live Server, it is possible to make changes to the code editor, switch to the browser and update to see changes without losing yourself by switching between Windows.
In an even simpler way to explain, let’s say that your browser is automatically updated whenever you make some code change.
In addition, it also runs its application on a local host server. As there are some things you can only test by running your application live on a server, so this is an interesting benefit and justifies the name of the extension :).
Learn more about Live Server.
Javascript (ES6) Code Snippets
Needless to say, JavaScript is the basis of web development. So, for that reason alone, the installation of this extension is already justified.
Enough of tiring your fingers by typing a truck of codes unnecessarily and the JavaScript (ES6) Code Snippets is able to provide excerpts of JavaScript, TypeScript, Vue, React and HTML code in a practical and simple way.
I’m not even going to extend much, I think it’s more of a mandatory extension for a front-end developer.
Set up here.
ESLint
I won’t waste much time explaining about this extension, few words are enough: ESLint basically checks your code for common errors and lets you know where the bug is in the editor itself.
It’s like a Virtual x-9 that’s validating your code while you write it and report your mistakes.
You can install it from here.
Paste JSON as Code
This extension to VS Code allows you to quickly convert JSON data to JavaScript, TypeScript, Python, Go, Ruby, Swift, Elm and other languages.
Yeah, that’s right, it allows you to paste JSON as code directly into the VSCode.
Click here and install that Wonder.
Remote – Containers
The Docker popularized the concept of containers to another level, allowing devs like you to develop without burning too much gray matter with the more systemic part.
And to give a hand in this matter, Remote – Containers came to help by allowing the packaging of all the files needed to run a new program in a ‘container’ enabling users to run smoothly and without having to install any dependency. And all this directly via VS Code.
To install the extension, just click here.
GitLens
Although VS Code already has native integration with Git, Git Lens is a powerful extension that provides a few extra little things within VS Code.
In my opinion, it is one of the most useful extensions for VS Code helping you who work with other people in the same repository. History, recent changes, code authorship, general information and confirmation search are some of the best features of this extension.
Learn more here.
Debugger for Chrome
The name itself already delivers what makes this extension; basically, Debugger for Chrome is a Visual Studio Code extension that serves to debug JavaScript easily and quickly into Chrome by marking breakpoints directly inside the editor.
Check out more about the extension here.
Markdown All in One
Markdown all in one is an extension that I like very much as a content producer and serves to write Markdown using VS Code.
It is a complete extension and comes with functional features such as live viewing and syntax highlighting.
Why not write your documents, notes and everything, directly on the Visual Studio Code?
In addition, the extension itself is highly customizable and well documented.
Learn more about the extension here.
I would like to make it clear that the extensions I have chosen reflect a personal opinion of mine, are not immutable truths and if you have a preference for some unquoted extension, let me try out what you are using on your VS Code.
