How to deploy a Docker container with VS Code

Image: BalanceFormCreative/Adobe Stock

VS Code is one of the most popular open source IDEs on the planet. It can work with a large number of languages, is quite easy to use, and is available for Linux, macOS, and Windows. Another very interesting feature of the application is that it includes a wide range of extensions that add various additional abilities, such as working with containers.

With the help of a Docker extension, you can create containers, create images, deploy applications, and more.

I’ll show you how to make that happen, using VS Code on Pop!_OS Linux. You can do this on any platform that has Docker installed. I’ll walk you through installing VS Code and Docker on my Ubuntu-based operating system of choice. If you are using a different platform, you will need to modify the installation process accordingly.

SEE: Hiring Kit: Back-End Developer (TechRepublic Premium)

What you’ll need to implement Docker

To get started with Docker in VS Code, you’ll need a running instance of an operating system that supports both, and a user with administrator privileges.

How to install Docker

The first thing we will do is install Docker.

Download and install the necessary GPG key:

curl -fsSL | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg

Now add the official Docker repository:

echo "deb [arch=amd64 signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null

Install the necessary dependencies:

sudo apt-get install apt-transport-https ca-certificates curl gnupg lsb-release -y

Finally, we can install the latest version of the Docker engine:

sudo apt-get update
sudo apt-get install docker-ce docker-ce-cli -y

When the installation is complete, add your user to the docker group with:

sudo usermod -aG docker $USER

Please log out and log back in for the changes to take effect.

How to install VS code

To install VS Code, go to the official download page, open a terminal and run the following command:

sudo dpkg -i ~/Downloads/code*.deb

When the installation is complete, open VS Code from your desktop menu.

How to install the Docker extension

After the first run of VS Code, it should detect that Docker is installed and ask if you want to install the Docker extension. If so, click install and you’re good to go. Otherwise, click the gear icon near the bottom left of the VS Code window and in the search field type Docker. When the Docker extension appears, click the associated Install button (Figure A).

Figure A

Installing the Docker extension for VS Code.

After the extension installs, you should see all the containers, images, and registries you’ve already created listed in the left pane.

How to deploy a container

In the VS Code window, click Terminal | New Terminal. With the terminal window open, let’s extract and run the starter Docker container with:

docker run -d -p 80:80 docker/getting-started

If port 80 is already busy, you can implement it on external port 8080 with:

docker run -d -p 8080:80 docker/getting-started

Once the container has been deployed, you will see it listed in the CONTAINERS section. If you right-click on that entry, you can perform a number of actions, including View Logs, Attach Shell, Attach Visual Studio Code, Inspect, Open in Browser, Stop, Restart, and Delete (Figure B).

Figure B

The right-click context menu for a running container in VS Code.

If you expand the entries for the Getting Started container under CONTAINERS, you can right-click any of those files and open them in VS Code for editing (Figure C).

Figure C

Editing a file inside the running container.

Let’s say you’ve pulled an image and want to run a container from it. Right-click on the image in the IMAGES section and click Run.

This will display a container, based on the image, with the standard options. For example, if I click Run for the etherpad image, the command that VS Code will run is:

docker run --rm -d -p 9001:9001/tcp etherpad/etherpad:latest

You should pretty quickly see the etherpad container running in CONTAINERS, where you can right-click the entry and then click Open in Browser to experience the running container.

And that’s pretty much the gist of implementing a container within VS Code. There are so many things you can do with these two tools together and this barely scratches the surface. But for those who like a traditional IDE to use within the container realm, this is a great combination.

Subscribe to TechRepublic’s How To Make Tech Work on YouTube to get the latest tech tips for business professionals from Jack Wallen.

Leave a Comment