Getting started with VS CODE remote development

(Comments)

remote_dev

Let's say you have a GPU virtual instance on the cloud or a physical machine which is headless, there are several options like remote desktop or Jupyter Notebook which can provide you with desktop-like development experience, however, VS CODE remote development extension can be more flexible than Jupyter notebook and more responsive than remote desktop. I will show you step by step how to set up it up on Windows.

Start OpenSSH service

First, let's make sure you have set up SSH on your server, most likely your online server instance will have OpenSSH server preconfigured, the command below can check whether it is running.

service sshd status

If you see something like this, you are good to go, otherwise, install or start the OpenSSH server

● ssh.service - OpenBSD Secure Shell server
Loaded: loaded (/lib/systemd/system/ssh.service; enabled; vendor preset: enabled)
Active: active (running) since Tue 2019-09-17 19:58:43 CST; 4 days ago
Main PID: 600 (sshd)
Tasks: 1 (limit: 1109)
CGroup: /system.slice/ssh.service
└─600 /usr/sbin/sshd -D

For the Ubuntu system, you can install OpenSSH server and optionally change the default 22 port like this

sudo apt-get install openssh-server
# Optionally change the SSH port inside this file.
sudo vi /etc/ssh/sshd_config
sudo systemctl restart ssh

Once you have set it up, ssh to this server from your development machine with IP address, user name and password just to verify there are no glitches.

OpenSSH client on Windows

This step is painless, for Windows 10 users, it is just enabling a feature in the setting page, it might be enabled already. Anyway, here is the step to verify this feature is enabled.

In the Settings page, go to Apps, then click "Manage optional features", scroll down and check "OpenSSH Client" is installed.

openssh1

openssh2

openssh3

Setup SSH keys

You don't want to type your user name and password every time when you log in to the server, do you?

In Windows(your development machine)

Here we will generate an SSH key like this in a command prompt,

ssh-keygen -t rsa

Accept the defaults, you can leave the key phase empty when following along the prompt.

Copy the output of this command,

cat ~/.ssh/id_rsa.pub

Then ssh to the server with user name and password if you haven't already, then run those following command lines to open up append the content you just copied to ~/.ssh/authorized_keys on the server.

mkdir -p ~/.ssh
vi ~/.ssh/authorized_keys

In case you are not familiar with vi, "Shift+END" goes to the end, type "a" to enter append mode, right-click to paste the content of the clipboard. Once you are done, press "Shift + ;" then type "wq" to write and quite. Hopefully, we don't need to edit our code the same way in vi anymore after this.

To verify the SSH is set up, on your Windows machine start a new command line prompt and type ssh <username>@<server ip>, it should log in automatically without asking for the password.

Install Remote Development VS CODE Extension

Open the VSCOD, click the Extension tab, then search for "remote development" and install it.

install_extension

Once it is installed, you will see a new tab named "Remote Explorer", click on it and the gear button.

remote_explorer

Choose the first entry, in my case, it is like C:\Users\hasee\.ssh\config, Once you have it open, fill in the alias, hostname, and user. the alias can be any text which helps you remember, the hostname is likely the IP address of the remote machine.

Once you have this done, just click on the "Connect to Host in New Window" button.

One last step, in the new window click "Open Folder" in the sidebar to select a folder path on your remote machine and you are good to go, type "Ctrl + `" to open the terminal on the remote machine just like doing it locally.

Conclusion and further reading

Now you have it, a quick tutorial showing you how to setup VS CODE remote development from scratch allowing you to enjoy a desktop development experience on a headless remote server.

For the official VS Code Remote Development page, please refer to the website.

Current rating: 5

Comments