How to use a devcontainer in vscode.dev?

Question

I'm trying to move to vscode.dev for totally online coding. I was able to SSH into my computer via the remote tunnels extension. However, I was not able to install the devcontainers extension, neither run/build a devcontainer, on the browser. Using vscode locally I can do that, but I'd like to use a devcontainer on the browser as I'm on a tablet

UPDATE: please raise awareness and ask/vote for this feature here: https://github.com/microsoft/vscode-remote-release/issues/9059

Answer 1

I do not think Dev Containers is meant to be used from a remote vscode.dev environment, only from a local OS and VSCode:

GitHub Codespaces would provide an online development experience closer to what you need, since it does support Dev Containers

As illustrated in this thread, you can use both:

• Launch VSCode
• Make sure dev container and GitHub Repositories, and GitHub CodeSpaces extensions are installed
• Ctrl-Shift-P > Dev Containers: Create Dev Container...
• Define the dev container, include GitHub CLI feature, and launch it.
• Open Terminal in dev container
• git init -b main && git commit -a -m "Dev container"
• gh repo create YourAccount/RepoName --private --source . --push (and any other commands)
• Ctrl-Shift-P > Codespaces: Create New Codespace

---

As commented, it is not supported yet, and depends on issues like:

• vscode-remote-release issue 9131: "Open tunnel directly to a devcontainer": so that we can connect to that devcontainer from vscode.dev.

• vscode-remote-release issue 9132: "Allow opening a tunnel with an API token", that way, it would be possible to create a docker image which open a tunnel without user intervention.

  It includes, from Connor Peet:

  Please check out the code tunnel user login command. You can pass an access token there.

  Note that the access token would need to be a valid token created by VS Code or the CLI before, or at least under the VSCode app ID.

  And Connor Peet adds:

  Actually it looks like the dev tunnel CLI is now public.
  So the way to go is to create a tunnel using the dev tunnels CLI, after signing in with your preferred GH/MSA account, and create a token with the connect, manage, and host permissions on the tunnel.
  Then it can be hosted with the command

  code tunnel --tunnel-id=<tunnel.id> --host-token=<token> --name=<preferred-tunnel-name>.
  

---

Q1 2024: microsoft/vscode-remote-release issue 9059 now includes from Ryan Young :

I didn't want to wait for Microsoft to work on this, so I wrote my own program YoRyan/myspace.
It builds dev containers using the dev container CLI and then injects the code CLI to create a tunnel.

It isn't quite seamless, since you need to authenticate every time you create a new tunnel, and you only get five slots on vscode.dev.
But it includes support for devcontainer.json-defined settings and extensions, so it almost feels as good as Codespaces.

Ryan goes on:

There's now a code serve-web command that starts a self-hosted, standalone VS Code server that looks and performs great.
I have this command implemented in myspace as the local subcommand, and it's almost perfect for the DIY Codespaces use case.

But unfortunately, the dev container CLI does not yet implement port forwarding for dev containers (devcontainers/cli#186). That means we only get one port (appPort) which we have to use for the VS Code server itself. Without access to the other ports, you can't reach any services you spin up in your dev container.

Answer 2

There's an open issue for that and itappears that it's in the backlog

https://github.com/microsoft/vscode-remote-release/issues/9059

Answer 3

vscode.dev is a lightweight version of Visual Studio Code that runs in the browser. It's primarily designed for quick editing, browsing, and lightweight tasks. It doesn't support the full suite of extensions and features that the desktop version of VS Code does.

The Remote - Containers extension, which provides the development containers functionality in VS Code, relies on Docker to work. Running Docker containers directly from a browser-based editor like vscode.dev presents challenges, especially around security and resource management.

If you're looking to use development containers in a more mobile or flexible manner, here are a few suggestions:

1. VS Code on Desktop with Remote Access: You mentioned you're on a tablet. If you have a desktop or a more powerful machine, you can set up Docker and VS Code with the Remote - Containers extension there. You can then access this setup remotely from your tablet. This seems to be what you've tried with SSH tunnels.

2. Use GitHub Codespaces: GitHub Codespaces is a service that provides cloud-hosted development environments. It supports devcontainers and runs in the browser. It's like vscode.dev but with more features and integrations. However, it's a paid service based on usage.

3. Cloud-hosted Docker solutions: There are services that let you run Docker containers in the cloud. You can set up a development container in one of these services and then connect to it from vscode.dev or any VS Code instance.

4. Local Development: If your tablet runs a full OS (like Windows or Linux), you might be able to install Docker directly on it and then use the desktop version of VS Code for your development container needs.