💡 Learn more : Visual Studio Codespaces.
📺 Watch the video : Work with your Azure apps in Visual Studio Codespaces.
You can now use Visual Studio Codespaces to develop your applications with. This means that you can open a browser and start coding. Or you can use VS Code or Visual Studio (available soon) on your local machine and connect that to Visual Studio Codespaces. This is a great way to develop a resource-intensive application on a simple device. You run VS Code on a laptop without much power and Visual Studio Codespaces does the heavy lifting in he cloud.
In this post, we'll use Visual Studio Codespaces to develop a simple Azure Function in a browser.
If you want to follow along, you'll need the following:
Let's get started!
(Create a new Billing plan)
Now that we have a Billing plan, we can create an environment in it
a. Fill in a Name for the environment
b. Optionally provide a Git Repository that will be connected to the environment. You can leave this blank for now
c. Select the Instance Type. this is the Virtual Machine that runs your environment
d. Configure the Suspend idle time for the environment This shuts down the environment when you aren't using it for a certain amount of time. You'll be charged for the VM time when you use the environment, and you'll be chared a much smaller fee when he environment is suspended
e. Optionally, you can tell the environment to load your Dotfiles, which are files that begin with a period, like .bashrc, .gitignore and .editorconfig
f. Click Create to create the environment
(Create a new Environment)
After a while, your environment will be ready to use. You can use it from your browser or connect to it from VS Code or Visual Studio (available soon). Click on the name of the environment to open it in the browser.
(Connect to the new environment)
You are now connected to Visual Studio Codespaces in your browser. It looks and feels exactly like VS Code and it has the same capabilities. By default, it has IntelliCode and Live Share enabled and you can install any VS Code extension that you want.
(Visual Studio Codespaces in a browser)
Let's create an Azure Function and run it.
npm install -g azure-functions-core-tools
(Port forwarding in Visual Studio Codespaces)
(Azure Function called from local machine)
You can also open Visual Studio Codespaces from VS Code. Lets try that. Go back to the Visual Studio Codespaces dashboard. Now right-click on the menu of the environment, like in the image below and select Open in VS Code.
(Open Visual Studio Codespaces in VS Code)
When you open Visual Studio Codespaces in VS Code for the first time, you'll be asked to sign in and create a firewall rule and to install a VS Code extension. Once you've done all of that, you can use Visual Studio Codespaces just as you did in the browser. The same code is there. It also has the same extensions installed, you don't have to do that again for your local environment. And when you run the code, it runs in Visual Studio Codespaces and has port forwarding so that you can open the result in your local browser.
(Visual Studio Codespaces in VS Code)
Visual Studio Codespaces provides a full-fledged development environment in the cloud that you can access from your browser, or from your local VS Code or Visual Studio (available soon). It can replace your development Virtual Machine and enables you to do compute-intensive work from a simple machine. Go and check it out!