Programming is hard and long process but it doesn’t have to be if you have the right extensions on your editor.
Since vscode is one of the most popular code editors right now. Here are some of the extensions that will help you improve your productivity.
1. Bracket pair Colorizer
When I first saw this plugin I didn’t think I might need this. But if you are working on languages that require a tree of brackets this is going to be a life saver and once you get used to it, you are never going back. I cannot stress on how much trouble it has saved me from. It allows matching brackets to be identified with same colour. This is a must have if you constantly work with JS tech stack. Bracket Pair colorizer extension
2. Code Snippet
How many times have you written same code again and again and you feel that you could save lot of time if you didn’t have to repeat things. Code snippet extensions allows you to speed up this process by generating the regularly written code with simple commands. Each languages have their own snippet generation extensions. One of the popular one is Emmet for HTML, it’s already shipped with vscode. For other languages you have to look for what makes sense to you. I work with React most of the time so my preference is: ES7 React/Redux/GraphQL/React-Native snippets extension
3. Source Control
Source control is an integral part of the development process. If you are working in a team it becomes more important. Having a source control extension on your editor helps you get the repository status, git blames and easier conflict resolution to name a few. And if you don’t like remembering the git commands it’s a must have for you. My goto choice is: GitLens.
4. Linter
Everyone wants to write code that is elegant and beautiful, but it’s hard to be consistent and precise. It’s likely we end up writing code in different styles in different places. And if you want to be a good programmer it’s best to use the industry standard for writing code that’s where the linter comes into play. If you have a good linter you can save lot of time refactoring the code and the code you write will be beautiful and industry standard. My recommendation for javascript based languages is: Eslint
5. Live Server
This is for the developers who are working with Html, CSS and vanilla JS. If you are tired of saving the file and reloading your output each time. Live server extension gives you live reload functionality, so that you can focus on development and not worry about refreshing manually again.
Bonus
Here are some of the additional plugins that are helpful to make your editor better:
- Prettier: Formats your code to make it look better
- Material Icon Theme: Changes your boring folder and file icons to rich language specific icons.
- Quokka.js: It’s a live scratchpad for javascript where you can quickly test out javascript specific code.(it’s like console in editor)
