I noticed the instructions to setup code-server to run VS Code on your iPad (or anywhere) were somewhat confusing and incomplete when it comes to getting SSL working properly. So I thought I’d put together a little tutorial on how to get it working start to finish. Hopefully it helps someone, and maybe the docs on the site can be updated, because you’re not given full instruction in some places, and it seems like you should do somethings you don’t need too which won’t easily work like using certbot.
This assumes you already have a tailscale account, and have clicked the buttons to enable MagicDNS and HTTPS in your account.
I started with a minimal install of Ubuntu Desktop 22.04 as my server. You certainly could use Ubuntu Server or another flavor, but your instructions may be a little different.
First, log into the server interactively, apply any updates that might be pending just to make sure everything is as up-to-date as possible. Next we’re going to install the openssh-server package since you’ll probably want it anyway, and it allows us to do all the work from another machine via a SSH connection. Open a terminal and run the following:
sudo apt-get install openssh-server.
sudo systemctl enable ssh
Next we’re going to want to install tailscale, you can do this in the same terminal, or you can SSH over to the machine if you prefer.
sudo apt-get install curl
curl -fsSL https://pkgs.tailscale.com/stable/ubuntu/jammy.noarmor.gpg | sudo tee /usr/share/keyrings/tailscale-archive-keyring.gpg >/dev/null
curl -fsSL https://pkgs.tailscale.com/stable/ubuntu/jammy.tailscale-keyring.list | sudo tee /etc/apt/sources.list.d/tailscale.list
sudo apt-get update
sudo apt-get install tailscale
sudo tailscale up
When you run ‘tailscale up’ you’ll be prompted with a URL to visit to authenticate. This can be on the same machine or another, but you’ll want to use a browser to do this.
OK, now you have your linux box connected to your tailscale network, you can do the rest from anywhere. We’ll need to note the IP assigned to the machine on the tailscale network, an easy way to do this is to navigate to https://login.tailscale.com/admin/machines You can also disable key expiry on this page. You may want to do this to prevent it from having to be reauthenticated periodically.
Next we’re going to install code-server
curl -fsSL https://code-server.dev/install.sh | sh
sudo systemctl enable --now code-server@$USER
We want to edit the config for code-server. Open ~/.config/code-server/config.yaml and replace it’s contents with:
bind-addr: <your tailscale server ip>:8080
auth: none
cert: false
restart code-server
sudo systemctl restart code-server@$USER
Now that code server is running, (you can navigate to port 8080 on your server to see it) we’re going to setup NGINX to work as an SSL reverse proxy
First let’s get the certificates. I changed to /etc/ssl/certs to run this command, but you can store your certs where you like, or link them from somewhere else.
sudo tailscale cert heimdall.hyena-alpha.ts.net
This will create a .crt and .key file. Note their name and location, we’ll use them when configuring NGINX.
Next install NGINX
sudo apt install nginx
Then create the file /etc/nginx/sites-available/code-server with contents similar to below, replacing the paths and IP with your own.
server {
listen 443 ssl;
listen [::]:443;
server_name <yourhost.subdomain>.ts.net;
ssl_certificate /etc/ssl/certs/<yourhost.subdomain>.ts.net.crt;
ssl_certificate_key /etc/ssl/certs/<yourhost.subdomain>.ts.net.key;
location / {
proxy_pass http://<tailscaleIP>:8080/;
proxy_set_header Host $host;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection upgrade;
proxy_set_header Accept-Encoding gzip;
}
}
Then link that file into sites-enabled and restart NGINX
sudo ln -s ../sites-available/code-server /etc/nginx/sites-enabled/code-server
sudo systemctl restart nginx
And there you have it. Now you can navigate to http://<yourmachine>.<yourTSdomain>.ts.net and it should automatically redirect you to a secure connection. If you’re doing this so you can run on an iPad, open the URL in Safari, and then click the ‘share’ button, and choose ‘Add to Desktop’ This will create an application link, which will use the PWA when you open it. The advantage here is you don’t have to have the browser chrome while working with the application. Code away!