In this tutorial, you will configure and start using development container.

This codelab assumes you are deploying a development container on Jetstream2 virtual machine. Using another virtual machine would be similar but not explicitly covered.

Prerequisites

Additionally, following are additional prerequisites to deploy development containers:

1. Visual Studio Code's Remote Development Extension Pack
2. Docker container runtime: pre-installed in Jetstream2 VM images (Jetstream2 documentation)

Codelab Objectives

In this codelab, you will use a Jetstream2 virtual machine to deploy a development container.

1. Create and connect to Jetstream2 virtual machine.
2. Add or import development container configuration files.
3. Use VS Code to start development container.

Jetstream2 allows you to create virtual machine instances.

1. Read Jetstream2 documentation for creating a VM instance
2. Evaluate if the default choices are suitable. For this class, m3.medium should be sufficiently powerful.
3. Built-in root disk storage size is small. Enter a larger size for your root disk size:
   
4. Connect to your VM with "Web Shell" found in Interactions pane.

We will install VS Code in your VM, and connect to it from your local installation of VS Code.

1. In "Web Shell", download and expand VS Code:

   curl -Lk 'https://code.visualstudio.com/sha/download?build=stable&os=cli-alpine-x64' --output vscode_cli.tar.gz
   tar -xf vscode_cli.tar.gz
   

2. Above command extracts standalone code executable in the same directory.
3. To configure your VM to accept remote tunnel connections from your local VS Code, we will install VS Code as a service. A service runs in the background even after reboot.

   ./code tunnel service install
   sudo loginctl enable-linger $USER
   

   Use your GitHub credentials to login.
4. In your local installation of VS Code, type Ctrl+Shift+p and start typing Remote-Tunnels: Connect to Tunnel...
5. Choose GitHub and find your VM from the list. Once connection is established, bottom left of your window displays your VM name:
   

Cloning a repository (PSTAT 234)

We will clone a repository with development container configuration files.

1. Open a new VS Code window: right-click on VS Code icon and choose New Window
2. Click on Clone Repository button, then Clone from GitHub.
3. Start typing and select UCSB-PSTAT-234/Fall2025.
4. Choose the file location on VM where the repository will be cloned. Press enter or click Select as Repository Destination.
5. After opening the directory with cloned repository, your window will look like this:

Now you are ready to start your development container!

Here are the essential commands in Command Palette (shortcut is Ctrl+Shift+p):

• Dev Containers: Reopen in Container: opens the project directory inside the container.
• Dev Containers: Rebuild and Reopen in Container: rebuild the container image (i.e.,Dockerfile) or devcontainer.json changes.
• Dev Containers: Rebuild Without Cache and Reopen in Container: rebuild the container image without any previous container build artifacts.

After your window connects to the running container, the status bar will change:

Now your VS Code window is connected to a remote development container!

Interactions in this window are performed on your virtual machine, inside the container.

When bottom left does not indicate Dev Container, you are on a remote host via a remote tunnel.

1. Host File Explorer shows files on the host (Jetstream2 VM)
   
2. Host Remote Eplorer - Remote Tunnels shows various cremote compute resources
   
3. Host Remote Explorer - Dev Containers lists development containers
4. Host Container Tools lists running containers and container images

When bottom left shows Dev Container, you are inside a container.

1. Devcontainer File Explorer shows files inside the container
2. Devcontainer Remote Explorer lists development containers

After you modify your devcontainers settings (rebuilding, adding/removing lines in Dockerfile, etc.), VS Code creates new container instances without cleaning up ones you were using.

This VS Code behavior results in

• Increasing number of running containers you do not use any more
• Using up more memory
• Using more disk storage

Eventually, you will need to clean up unused containers and images to reclain memory and disk storage space.

You can remove containers from VS Code. First, open Remote Explorer.

If you are inside a container, your window might look similar to the following (note bottom left):

If you are on the VM host, but not inside the container, your window might look similar to the following (note bottom left):

To remove containers, you can right click on a container and choose "Stop Container" first, then, "Remove Container"

After you remove unused running containers, you might also want to remove unused container images. These have been downloaded when VS Code built container images from your Dockerfile, so if needed, they will be downloaded again automatically. Hence, it is fine to remove all container images that can be deleted.

If you haven't installed it already, install Container Tools Extension on the host (i.e., not in the container). Then, click on Prune icon to delete unused container images.

After pruning completes, you will see a notification.

Troubleshooting: disk storage is full

You have completed the following steps:

1. Created a virtual machine on Jetstream2.
2. Installed a remote tunnel service in your VM.
3. Connected your local VS Code to the remote VM.
4. Cloned repository files from GitHub to your VM.
5. Started a development container inside your VM.
6. Learned how to manage running/stopped container instances.
7. Learned how to delete unused container images.