Noteworthy Trending Visual Studio Code Extensions of june 2020
Tags: vscode, beginners, javascript, webdev
Published: 2020-06-14 13:03:25

## Formatting Toggle

A VS Code extension that allows you to toggle the formatter (Prettier, Beautify, …) ON and OFF with a simple click.

You can install it with:
```
ext install tombonnike.vscode-status-bar-format-toggle
```
[More info](https://marketplace.visualstudio.com/items?itemName=tombonnike.vscode-status-bar-format-toggle)

## TypeScript God

> Unlock god mode for TypeScript development 🔱.

Raises the level of tooling support for TypeScript in VSCode. Bringing the learnings and knowledge from previously developing atom-typescript and alm-tools into VSCode to make VSCode the bestest.

You can install it with:
```
ext install basarat.god
```
[More info](https://marketplace.visualstudio.com/items?itemName=basarat.god)

## Version Lens

This extension shows version information when opening a package or project for one of the following:
- dotnet https://www.dotnetfoundation.org/
- dub https://code.dlang.
- jspm https://jspm.
- maven https://maven.apache.
- npm https://www.npmjs.com/
- https://pub.dev/
- composer https://getcomposer.org/


You can install it with:
```
ext install pflannery.vscode-versionlens
```
[More info](https://marketplace.visualstudio.com/items?itemName=pflannery.vscode-versionlens)

## Twitch Themer

A Visual Studio Code extension that listens to twitch chat and allows viewers to change the streamers VS Code theme by sending !theme
![](https://raw.githubusercontent.com/michaeljolley/vscode-twitch-themer/master/resources/screenshot-example.gif)

You can install it with:
```
ext install MichaelJolley.vscode-twitch-themer
```
[More info](https://marketplace.visualstudio.com/items?itemName=MichaelJolley.vscode-twitch-themer)

## Better Align

Align your code by colon(:), assignment(=,+=,-=,*=,/=) and arrow(=>). It has additional support for comma-first coding style and trailing comment.

And it doesn't require you to select what to be aligned, the extension will figure it out by itself.
![](https://raw.githubusercontent.com/WarWithinMe/better-align/master/images/2.gif)

You can install it with:
```
ext install wwm.better-align
```
[More info](https://marketplace.visualstudio.com/items?itemName=wwm.better-align)

## Deno
Adds Deno support for VS Code using the TypeScript Deno language service plugin.

This extension works using VS Code's built-in version of TypeScript. You do not need to configure the plugin in your tsconfig.json if you are using VS Code's version of TypeScript.

You can install it with:
```
ext install denoland.vscode-deno
```
[More info](https://marketplace.visualstudio.com/items?itemName=denoland.vscode-deno)

## Svelte Beta

Provides syntax highlighting and rich intellisense for Svelte components in VS Code, utilising the svelte language server.

Do you want to use Typescript/SCSS/Less/..? See "Using with preprocessors" below.

If you added "files.associations": {"*.svelte": "html" } to your VSCode settings, remove it.

You can install it with:
```
ext install svelte.svelte-vscode
```
[More info](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode)

## Package Installer

A VSC extension to list packages from package.json and search for and install packages.

This is a work-in-progress and began so that I could learn how to make web views and tree views for VSC extensions.

You can install it with:
```
ext install sketchbuch.vsc-packages
```
[More info](https://marketplace.visualstudio.com/items?itemName=sketchbuch.vsc-packages)

### Oradew

This extension allows you to develop your Oracle (PL/SQL) project in Visual Studio Code. It enables you to:
- Manage PL/SQL source code with version control (Git)
- Compile files and Run statements with ORA errors problem matching
- Package files into a single SQL deployment script
- Deploy to multiple environments in one click

You can install it with:
```
ext install mp.oradew-vscode
```
[More info](https://marketplace.visualstudio.com/items?itemName=mp.oradew-vscode)

**👋Say Hello!** [Instagram](https://www.instagram.com/lampewebdev/) | [Twitter](https://twitter.com/lampewebdev) | [LinkedIn](https://www.linkedin.com/in/michael-lazarski-25725a87) | [Medium](https://medium.com/@lampewebdevelopment) | [Twitch](https://dev.to/twitch_live_streams/lampewebdev) |