VSCode Virtual Environments using your Browser

It’s no secret I’m a huge fan of virtual environments and PowerShell. Late last year I wrote this series on Nested Virtual PowerShell Desktop Environments on Windows 10 & Windows Server 2019 in Azure A lot of the back story for that three post series was to have virtual environments for PowerShell.

Moving forward six months and I’m at the beginning of the journey towards migrating from PowerShell Desktop to PowerShell Core. The quickest way to get started with PowerShell Core is to use the Windows 10 feature of Windows Subsystem for Linux. Of course you should also have made (or be making) the migration from PowerShell ISE to VSCode.

So what if you could have Virtual VSCode environments accessible via a browser as your IDE for building and using PowerShell Core? Well you can.

Here is VSCode running a PowerShell Core command via a browser from a Ubuntu based Windows Subsystem for Linux environment in a Windows 10 Virtual Machine running in Azure.

Prerequisites

A key component of this magic is Code Server. Code Server is an open source self-contained environment for VSCode designed to offload the IDE from lower powered environments (tablets, Chromebooks etc) and is currently supported on Linux and Mac (OSX) with Windows coming soon.

If you have an environment with either of those then all good, as you were. If you only have Windows then on Windows 10 install Windows Subsystem for Linux via the Microsoft Store App. My Windows System for Linux flavour is Ubuntu.

Code Server

Download Code Server from the Github Releases page here and save it to your local machine. Running Ubuntu I downloaded the Linux binary. Untar it using

tar -xf yourDownloadedversion.tar.gz

Change into the extracted directory with the code-server executable in and run code-server

./code-server

Take note of the password as you will need this when you connect to Code Server via your browser.

If the host you are running Code Server is remote (as mine is, in Azure) make sure you have networking configured for the default port (8443). I had to update my NSG for the inbound port of 8443.

Note: this isn’t a normal configuration, allowing source any for incoming ports. I have this locked down to the necessary source IP’s (but I’m not going to show them here).

Then in your browser you can hit the your host on port 8443 and provide the password that was displayed when starting Code Server. You will then have VSCode running in essentially a Virtual Environment accessible via a browser.

PowerShell Core

My Windows Subsystem for Linux Ubuntu version is currently 18.04 and I already had downloaded and installed PowerShell Core for Ubuntu 18.04

lsb_release -a

Installation Instructions are here

Install the PowerShell VSCode Extension along with any of the other extensions you regularly use. BOOM, you now have a Virtual VSCode environment for use with PowerShell Core on (and in my case on Ubuntu under Windows 10).

Summary

What a crazy time to be in the IT industry. Nested disparate operating systems running IDE’s in browsers executing cross-platform scripting languages. Wow.

To run multiple sessions on the same host use the -p (port) command to specify a different port for each instance.