JasmineDesign

Cloud hosted development environments accessible from anywhere

VS Code for the Web - Bringing VS Code to the browser

Microsoft has released a preview of VS Code for the Web. Now when you go to https://vscode.dev, you'll be presented with a lightweight version of VS Code running fully in the browser. Open a folder on your local machine and start coding. No install required.

With the availability of vscode.dev, The Visual Studio Code team has begun to finally realize their original vision of building a development tool that can run fully serverless in the browser, no virtual machine or container needed.

Modern browsers that support the File System Access API (Edge and Chrome today) allow web pages to access the local file system (with your permission). This simple gateway to the local machine quickly opens some interesting scenarios for using VS Code for the Web as a zero-installation local development tool.

Since VS Code for the Web is running completely within the browser, some experiences will naturally be more constrained, when compared to what you can do in the desktop app or GitHub Codespaces. For example, the terminal and debugger are not available, since you can't compile, run, and debug applications within the browser sandbox yet.

Extensions such as themes, key maps, and snippets all work in vscode.dev and you can even enable roaming between the browser, the desktop, and GitHub Codespaces through Settings Sync. More extensions will be compatible as authors update them to make use of vscode.dev & github.dev overtime.

vscode.dev also offers support for GitHub and Azure Repos (part of Azure DevOps) built-in.

Should you want more features like a terminal or debugger you can move to GitHub Codespaces at any time. By clicking in the bottom left hand corner click on the green (github.dev) or blue (vscode.dev) GitHub or use keyboard shortcut Ctrl + Alt + o and then choosing Continue Working in a New Codespace and then choose the instance type you want to use, it will then open a new Codespace for you to work in. Note: If you have any changed or added uncommited files then you will be prompted with an option box about how you want to continue.

If you would like more information about working with GitHub Codespaces then our JasmineWS tutorial covers the above step plus also Ending and Deleting Codespaces in detail.

GitHub Codespaces

GitHub Codespaces allows you to develop entirely in a cloud environment with up to 32 cores. Using Codespaces a integrated development environment (IDE) built around Visual Studio Code on GitHub that can be accessed from a web browser, Visual Studio Code, or using SSH.

GitHub Codespaces is a Chargeable product, but with a free of charge GitHub account you still get 120 core hours of usage and 15 GB-monthly storage included each month. Which means if you use 2 core option to setup your Codespace you will get 60 Hours free each month, but if you want more you can setup billing details to allow this. Pro accounts get 180 core hours and 20 GB storage per month.

You can develop in your Codespace directly in Visual Studio Code. By connecting the Visual Studio Codespaces extension with your account on GitHub or you can use a browser-based editor.