VSCode Dev Containers

containers, development, productivity, tips

Visual Studio Dev Containers allow us to easily leverage the benefits of containers in our development environments, providing all of the required tools and extensions, allowing for different versions depending on the project without affecting our local machine.

See the Visual Studio Code Remote - Containers extension docs for details, and the tutorial for a quick example of getting up and running using a sample project.

// continue from here <<<<

Getting started is easy, all you need is Visual Studio Code and Docker Desktop.

Once Docker is up and running install the Remote - Containers extension and run the Remote-Containers: Open Folder in Container… command. You'll be prompted to select one of the base dev container definitions from the provided list or use the Dockerfile from your project if one exists.

This will create a devcontainer.json file in the .devcontainer folder at the root of your project. There are plenty of customisation options covered in the documentation and I'd encourage you to explore them. The basic setup should be enough to give you a flavour of using dev containers though.

After you've completed the setup VSCode should restart and begin building your container. Once it's ready it will automatically connect to the container and you're good to go. The first time might take a few minutes depending on the image / Dockerfile you're using, it will be much faster after the first successful build.

Once you're connected to the container, development is just like before. You edit your files, access the terminal, interact with extensions, just like you would locally, the only difference is it's all happening in the container, isolated from the rest of your system and other development environments.

It's even possible to deploy images to a local Kubernetes cluster from within the dev container. You'll need to forward the Docker socket to make this work.

I had a quick go at setting this up with the Tekton Dashboard and have something that almost works. I can deploy the built images to a local Kubernetes cluster but ran into some problems with the port-forward required to run the front-end in the dev container using webpack-dev-server connected to the back end deployed in the cluster. Something to pick up another day as it would drastically simplify the instructions for new contributors to the project, no longer having to deal with setting up Go, Node.js, npm, etc. Just open the project in VSCode, connect to the container, and away you go…

I'll be exploring dev containers more over the next while and will continue to update my thoughts and findings here.