If you have ever used github1s.com for a quick repository preview, you might be interested in using VS Code for the web, now built into GitHub. To open, simply press dot while on the repository page. Alternatively, you might swap github.com/user/repository for github.dev/user/repository.
The August 2021 release of Visual Studio Code brought high-performance bracket pair colorization. If you are using the famous Bracket Pair Colorizer extension by CoenraadS, you might consider replacing it for a superior programming experience.
In order to do so, you need to go through the following steps:
You may also want to bring (optional) a familiar color scheme from Bracket Pair Colorizer by adding:
If you would like to customize the colors for a given theme only (e.g. if the above colors do not provide sufficient contrast), you might do so by including a key with theme name in workbench.colorCustomizations object:
Other neat features of the aforementioned VS Code release that you might want to opt in include:
To enable it, extend your settings object with
Enabling this feature will show inline type annotation of the parameter names.
You can enable this feature by adding:
to your settings with one of the below values:
This feature will display the type of variables with no explicit type annotation — inferred from context.
This feature will show the type of class properties that don’t have an explicit type annotation.
If you’d like to test all of the above type annotations, extend your settings with the following. Keep in mind though, code can easily get a bit cluttered, so mix and match to your liking.
for TypeScript:
for JavaScript:
Additional highlighting was added to improve the visibility of the scope of a current bracket pair.
Bracket pair guides are enabled by setting `editor.guides.bracketPairs: true`. There is also a possibility to set this property to `active` so that the guides are only visible when the cursor is inside the code block.
The new setting editor.guides.bracketPairsHorizontal controls if and when to render horizontal guides (defaults to active).
These are just some of the nice touches that might help you improve your experience using Visual Studio Code.
You can read more about VS Code for the web here:
If you’re interested in how the super-performant bracket pair colorization was implemented you can check out the article here:
I hope you find these tips useful and can use them in your everyday work.
Mirumee guides clients through their digital transformation by providing a wide range of services from design and architecture, through business process automation to machine learning. We tailor services to the needs of organizations as diverse as governments and disruptive innovators on the ‘Forbes 30 Under 30’ list.
Learn more about who we are and what we do. Have a look through the open positions here and become a part of our team.