How to use VS Code to work on a Remote Machine

Ubuntu command line on VSCode

In this article, we will walk you through on how to use Visual Code Code (“VS Code”) to work on a remote machine such as a VM or a remote desktop. As developers, as we work through different projects, our computers keep getting filled with various SDKs, CLI tools, frameworks, and packages. Wouldn’t it be nice, if there was a remote machine or a VM where you can install all of these software (that you will seldom use) and yet be able to work on them using a code editor (Visual Studio Code for example) on your desktop?

TLDR;

  • Create an Ubuntu VM in VirtualBox
  • Enable SSH access on the VM
  • Install an extension called Remote – SSH in VS Code (on your Desktop)
  • Connect to the VM from VS Code using Remote – SSH

Step by Step Instructions

In this tutorial, we will walk you through the entire process on macOS (Apple Silicon).

Step 1: Install VirtualBox (go to Step 2 if you already have it)

  • Download from here
  • The host machine’s architecture matters. So download the correct version. In this case, since we are using Apple Silicon, we will need to install version 7.0.8 (or older).
VirtualBox Download

Step 2: Install Ubuntu

  • Once again, your desktop’s architecture matters.
  • For macOS using Apple Silicon, we recommend using the non-GUI Ubuntu Server (ARM 64)
  • Current LTS Download Page
Follow the steps below to create the Ubuntu VM.
Step 1: Add a New VM
Step: 2 VM Install
Step 3: VM Install
Step 4: VM Install
Step 5: VM Install
Step 6: VM Installation
Ubuntu installed

If you got the right ISO image for Ubuntu, the installation will proceed at this point and take usually between 5 and 10 minutes to complete. Could take a bit longer.

Get a coffee 😉 

6 minutes and 23 seconds later …

Ubuntu installed!

Step 3: Enable SSH on the new Ubuntu Virtual Machine

Log in to your Ubuntu VM and exectute the following command to update the Ubuntu package manager and isntall OpenSSH server. You will need this to allow VS Code or other code editors to connect to this VM.

sudo apt update && sudo apt install openssh-server -y # Ubuntu/Debian

Enter the following command next to make sure ssh server runs at start up

sudo systemctl enable ssh

(If the second command throws an error, simply restart your vm and rerun the command.)

Start the SSH server:

sudo systemctl start ssh

Check the status:

sudo systemctl status ssh

If all is well, you should see an output like the following, which confirms SSH Server is listening on Port 22.

Ubuntu - SSH Server Listening

Step 4: Set Up Network for SSH Access

In VirtualBox, open the Settings for the newly installed Ubuntu VM, and go to the Network tab. 

–> Select Bridged Networking for the drop down labelled “Attached to:”.

–> Click OK.

Ubuntu - Network Configuration

Step 5: Find the new VM's IP address

Type the following command at the VM’s prompt:

ip a | grep "inet "

Look for the row which has something like “enp0s8” and write down the IP address. In my case, it’s 192.168.5.148. Make a note of this.

Ubuntu: VM IP Address

Step 6: VS Code Setup

Install this extension called “Remote – SSH”

VS Code - Remote SSH

Step 7: Remote-SSH: Add New SSH Host

Open the VS Code Command Palette:

Cmd + SHIFT + P (on macOS)

Ctrl + SHIFT + P (on Windows)

If the right option is not selected, start typing “Remote-SSH …” and you will see the option to select “Remote-SSH: Add New SSH Host…”

Select this command.

Remote-SSH: Add New SSH Host

Enter:

ssh vm_user_name>@vm_ip_address

In my case it was:

ssh kc@192.168.5.148

Follow the prompts to add this VM as an SSH host on your machine. If all is well at this point, you will get a success prompt at the bottom right-hand corner of VS Code like so:

SSH Host Added

Click on the Connect button and follow the prompts to add a config file and connect to this Ubuntu VM. For this tutorial, we kept all the default locations.

Step 8: Connect to the VM and Open Terminal

If you are here, that means your setup has been successfully completed. You should see the virtual machine IP address at the bottom left of the screen.

VSCode Connected to VM

At this point, press CTRL + ` to open a terminal on VS Code and you will see the terminal on your VM.

All done! And that’s how to connect Visual Studio to a Remote Host and keep your machine squeaky clean!

Ubuntu Terminal in VSCode on Mac

Few Tips and Things to Remember

  • The obvious one … the VM must be running for your local machine to connect to it.
  • To avoid opening the VirtualBox VM window, right click on the VM name in VirtualBox, as select Start -> Headless Start
  • When connecting to the remote host from VS Code, you will have enter the password. Consider setting up SSH Key Authentication

If you enjoyed this article, consider checkout out our engineering blog and subscribing to our monthly newsletters.

Feature photo by Gabriel Heinzer on Unsplash

Recommended Posts