Today we will not be discussing any code. Instead, we will be talking about something that is fundamental when writing code and without it, there wouldn’t be anything. I am, of course, talking about our code editor, more specifically VSCode.
All the extensions, completely free and compatible with both Windows and Mac, are available on the extension marketplace for VSCode. You can access them by clicking this icon on VSCode:
1. GitLens – Git supercharged
“GitLens supercharges the Git capabilities built into Visual Studio Code. It helps you to visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more.”
2. Better Comments
Better Comments, as its name suggests, is a simple yet very useful extension for categorizing comments in your code.
3. Bracket Pair Colorizer 2
“This extension allows matching brackets to be identified with colours. The user can define which tokens to match, and which colours to use.”
Beautiful screenshots for your code.
5. Material Icon Theme
“The Material Icon Theme provides lots of icons based on Material Design for Visual Studio Code.”
Both plugins provide a ton of very useful snippets for faster writing. You can choose either one, but I recommend you use both since some have extension-specific snippets.
Click on the links below for the full list of available snippets:
3. Auto Rename Tag
“Automatically rename paired HTML/XML tag, same as Visual Studio IDE does.”
“Wraps your selection in HTML tags. Can wrap inline selections and selections that span multiple lines (works with both single selections and multiple selections at once).”
5. Jest Snippets
Simple, snippets for Jest.
The full list for snippets: https://marketplace.visualstudio.com/items?itemName=andys8.jest-snippets
Do not forget to add a good-looking theme to your VSCode! There are plenty of them in the marketplace so go check them out!
And there you have it! This is my definitive setup for JS/React development in VSCode. I hope you found it useful and more importantly, helps you get the most out of VSCode when it comes to JS development!