🐳 Lesson 23 of 40 DevOps Intermediate

Docker & Dev Containers

Dev Containers let you define your entire development environment in code. VS Code opens your project inside a Docker container — giving every teammate an identical, reproducible setup.

57% complete

1Installing the Dev Containers Extension

Search for Dev Containers in Extensions (by Microsoft). You'll also need Docker Desktop (or Podman) installed and running on your machine.

2Adding a Dev Container to Your Project

Press Ctrl+Shift+P → Dev Containers: Add Dev Container Configuration Files. Choose a base image (e.g., Node.js 20) and VS Code generates a .devcontainer/devcontainer.json for you.

.devcontainer/devcontainer.json

{
  "name": "Node.js Dev",
  "image": "mcr.microsoft.com/devcontainers/node:20",
  "features": {
    "ghcr.io/devcontainers/features/git:1": {}
  },
  "postCreateCommand": "npm install"
}

3Opening Your Project in a Container

After adding the config, press Ctrl+Shift+P → Dev Containers: Reopen in Container. VS Code builds the image, starts the container, installs your extensions inside it, and reopens the window — all transparently.

4Docker Extension

The Docker extension (by Microsoft) adds a Docker Explorer to the Activity Bar. You can manage images, containers, volumes, networks, and registries without leaving VS Code. Right-click a container to attach a shell or open its logs.

5Custom Dockerfiles

For more control, point devcontainer.json at a Dockerfile or docker-compose.yml. This lets you install specific OS packages, set environment variables, and replicate your production environment exactly.

💡 Tip: Dev Containers work seamlessly with GitHub Codespaces — the same .devcontainer config file drives both your local container and your cloud-hosted Codespace.