Enhancing Skills

How to Run a Docker Container in VS Code (Step-by-Step Guide)

Quick Overview

  • Learn how to install Docker and connect it to VS Code
  • Run containers using terminal, UI, or Dockerfile
  • Use Dev Containers for a full development environment

What You Need First


Step 1: Verify Docker Is Working

Open a terminal in VS Code and run:

docker --version

If you see a version number, you’re good to go.


Step 2: Access Docker Inside VS Code

  • Open VS Code
  • Look at the left sidebar
  • Click the Docker icon

From here you can:

  • View running containers
  • Manage images
  • Start/stop containers

Step 3: Run a Container (3 Ways)

Option 1: Run from Terminal (Fastest)

docker run -d -p 8080:80 --name my-nginx nginx

Then open:
http://localhost:8080

What this does:

  • Downloads nginx if needed
  • Starts a container
  • Maps port 8080 to port 80

Option 2: Run from VS Code UI

  • Open Docker panel
  • Go to “Images”
  • Right-click an image (like nginx)
  • Click “Run”

You can configure:

  • Ports
  • Environment variables
  • Container name

Option 3: Use a Dockerfile (Best for Projects)

Create a file named Dockerfile:

FROM node:18
WORKDIR /app
COPY . .
RUN npm install
CMD ["npm", "start"]

Then run:

docker build -t my-app .
docker run -p 3000:3000 my-app

Step 4: Use Dev Containers (Best Experience)

Create a .devcontainer/devcontainer.json file:

{
  "name": "Node Dev",
  "image": "node:18",
  "postCreateCommand": "npm install"
}

Then in VS Code:

  • Press F1
  • Choose “Reopen in Container”

This runs your entire development environment inside Docker.


Useful Docker Commands

Check running containers:

docker ps

Stop a container:

docker stop my-nginx

Remove a container:

docker rm my-nginx

View logs:

docker logs my-nginx

Common Issues

Docker not running

  • Start Docker Desktop

Port already in use

  • Change port mapping:
-p 8081:80

Permission errors (Linux/macOS)

  • Try:
sudo docker ...

Tips for Developers

  • Use Dockerfiles for repeatable builds
  • Use Dev Containers to avoid environment issues
  • Keep container scope small for faster performance

Summary

Running Docker inside VS Code gives you:

  • A visual way to manage containers
  • Fast terminal-based control
  • Full dev environments using Dev Containers

If you’re building apps or working with structured repos, this setup makes your workflow more reliable and easier to maintain.


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.