How to get VSCode Cloud IDE on Azure

This section describes how to launch and connect to VSCode Cloud IDE on AZURE.

1. Open Visual Studio Code in Browser VM listing on Azure Marketplace

2. Click on Get It Now

• Select a Resource group for your virtual machine
• Select a Region where you want to launch the VM(such as East US)

• Note: If you see “This image is not compatible with selected security type. To keep trusted launch virtual machines, select a compatible image. Otherwise change your security type back to Standard” error message below the Image name as shown in the screenshot below then please change the Security type to Standard.

• Optionally change the number of cores and amount of memory.

Select Authentication type as Password and enter Username as ubuntu and Password of your choice for the VM

• Optionally change the OS disk type.

• Optionally change the network and subnetwork names.Be sure that whichever network you specify have ports 22 (for SSH), 3389 (for RDP) and 443 (for HTTPS) exposed.

• Optionally go to the Management, Advanced and Tags tabs for any advance settings you want for the VM.
• Note: If you want to access VSCode with user provided password, add following Name and Value in tags tab. This will be login password for accessing VS code in browser

Name: vscode-password Value: your password here

• **Note: If you don’t set the metadata with the above mentioned keys, a default random password will be generated. The password is stored in the file /home/ubuntu/vscode_pass.txt for your reference **

• Click on Review + create and then click on Create when you are done.
  Virtual Machine will begin deploying.

3. A summary page displays when the virtual machine is successfully created. Click on the Go to resource link to to go to the resource page. It will open an overview page of virtual machine.

4. In the left navigation pane, select Run command, select RunShellScript and enter following command to change the password of the vm .

sudo echo ubuntu:yourpassword | chpasswd

5. To SSH the VM, use the IP address or DNS address in the putty.

6. Provide the password for ubuntu user, you created in above “Reset Password” step.

7. To connect using RDP via Windows Machine, first note the public IP address of the VM from VM details page as highlighted below

8. Then From you local windows machine, goto “start” menu, in the search box type and select “Remote desktop connection”.
   In the “Remote Desktop connection” wizard, copy the public IP address and click connect

9. This will connect you to the VM’s desktop environment. Provide the username (e.g “ubuntu”) and the password set in the above “Reset password” step to authenticate. Click OK

10. Now you are connected to the out of box VSCode Cloud IDE environment via Windows Machine.

11. To connect using RDP via Linux machine, first note the external IP of the VM from VM details page,then from your local Linux machine, goto menu, in the search box type and select “Remmina”.

Note: If you don’t have Remmina installed on your Linux machine, first Install Remmina as per your linux distribution.

12. In the “Remmina Remote Desktop Client” wizard, select the RDP option from dropdown and paste the external ip and click enter.

13. This will connect you to the VM’s desktop environment via Linux Machine. Provide “ubuntu” as the userid and the password set in above “Reset Password” step to authenticate. Click OK

14. Now you are connected to the out of box VSCode Cloud IDE environment via Linux machine.

15. Once the vm is up and running, you can access Visual Studio Code by going to https://VM_Public_IP.

• Make sure you type https and not http. You will see certificate warning, accept the warning to proceed for login

Note: If you happen to see a blank screen in the browser after login or page load error, wait for 1-2 minutes and open again in new browser window to see VSCode load.

16. Provide the same password you set in tags tab during vm creation.If you have not provided password, you can find the randomly generated password by running below command in Terminal-

cat /home/ubuntu/vscode_pass.txt

Note down auto-generated password.

Note: If the password is empty in the file, wait for 2 minutes and check again.

17. Now you are connected to VSCode in browser.

18. If you prefer, after login, you can remove the password references from VM by deleting the password file (/home/ubuntu/vscode_pass.txt) and removing the metadata as below:

19. We recommend to reserve the VSCode public ip address and make it static in order to access VSCode in browser over the same IP after VM restart.
    Having static IP will also allow the browser to save VSCode password across sessions and user will not have to enter password each time VSCode is opened in browser.

• Below are the steps for reserving public IP and making it static:
• First way, You can assign the static ip while creating the VM. On Networking tab, in Public IP option select Create New and then select static under assignment and click OK as shown below.

• Second way, You can update the Public IP once the VM is up and running. On the VM overview page, select configure under DNS Name and change the assignment option from dynamic to static. Save your changes.

The VM now comes with AI assistance plugins installed out of the box, leveraging open source AutoPilot alternatives, offering intelligent code suggestions, enhanced error detection, and personalized productivity enhancements.

Note: While accessing the extensions page of Code server on google chrome or on microsoft edge , if you encounter Error loading webview: Error: Could not register service worker: SecurityError: Failed to register a ServiceWorker error, then please access the code server in mozilla firefox browser.

Follow below steps to configure these plugins.

1. Codegeeks:

Click on Codegeex icon from the left menu as shown below. It will open login window. Click on Login.

Click on Allow.

It will ask to open the Codegeex link in browser. Click on Open.

On the Codegeex authentication page, click on Signup or you can login with the options given on this page as shown below.

Once you are successfully logged in to the Codegeeks, go back to Code server page. You should see Codegeex Welcome page.

Note: If you don’t see the Welcome screen, please refresh the page.

Enjoy various Codegeex features like Code Generation and Completion, Code Translation, Comment Generation, AI Chatbot and more from the comfort of your Code Server window.

For more details on how to use Codegeex please refer to Codegeex official Documentation

2. Cody AI:

Click on Cody icon from the left menu as shown below. It will open the instruction window. Click on Signup at sourcegraph.com option. Click on Open.

It will take you to the Signup page on sourcegraph website.

Signup with your prefered option. Once successfully logged in to sourcegraph , click on Settings option available under your profile menu on top right corner.

On the Settings page, click on Access Tokens option from left menu and select Generate New Token as shown below.

Follow the instructions and generate the new token. Once ready, copy the token from this page.

Go back to Code server window and click on Add the Access Token to VSCode option. Paste the token in the top bar and Hit Enter as shown in below screenshot.

Now you should see Cody welcome screen.

Note: If you don’t see the Welcome screen, please refresh the page.

Start using various features of Cody ranging from autocomplete, AI chat, Commands, Debug code etc, right from your Code Server Window .

For more details on how to use Cody please visit Cody official Documentation