Visual Studio Code Remote - Tunnels

Glitch Tutorials
1

image
image1366×685 74.3 KB

Visual Studio Code recently added a hosted “tunnel” service to help you connect from an editor on your local computer to a development server. Here’s a little post on using Glitch as that server.

Previously we tried using SSH to connect (thread) and before that, using a third party solution that serves the editor as the project’s website (post).

With Visual Studio Code’s own tunneled service, we have the following nice things:

  • pro: Your project can serve your actual project website. It doesn’t take up the HTTP server on $PORT.
  • pro: Communication doesn’t take place through a stack of horrible hacks on top of WeTTY.
  • pro: It provides its own Visual Studio Code editor that you can open in your browser, so you don’t even have to have it installed natively.

And there’s this one philosophically objectionable thing:

  • con: Communication goes through a hosted service, and authentication goes through another hosted service. They, and Visual Studio Code itself, are all in the Microsoft umbrella though, so eh.

Instructions

You need to make a bunch of links to install the server program in /tmp because these days it’s too big to fit into your home directory /app. Also, it stores some security sensitive information in your home directory /app/.vscode-cli, so we link these to be stored in /app/.data.

# in your project container
mkdir /tmp/vscode-cli-server-stable /tmp/vscode-cli
mkdir -p ~/.data/vscode-cli-state
mkdir -p ~/.local/bin
mkdir -p ~/.vscode-cli
ln -s /tmp/vscode-cli/code ~/.local/bin
ln -s /tmp/vscode-cli-server-stable ~/.data/vscode-cli-state/server-stable
ln -s .data/vscode-cli-state ~/.vscode-cli

You need to install the Visual Studio Code CLI. You can get it from their website (their download page). Here’s how to do it from the terminal.

# in your project container
curl -L 'https://code.visualstudio.com/sha/download?build=stable&os=cli-alpine-x64' | tar -xC /tmp/vscode-cli

Then you run the command to start the server.

# in your project container
code tunnel

When you do this the first time, it’ll ask you to agree to some stuff, sign in with GitHub, and choose a name for the machine, and download the rest of the server program.

Eventually, it gives you a URL to open in your browser (see image at top of this post).

Suitability

Still RAM-hungry.

image
image1029×262 19.3 KB

image
image1362×650 150 KB

aaaaaaa :skull:

Oh, and nobody asked, but in the 214 MB installation of the server program, 38 MB is @vscode/ripgrep :skull:

4 Likes