Integrar Docker ao Visual Studio Code

Integrar o Docker ao Visual Studio Code torna o desenvolvimento mais ágil e eficiente. A extensão Docker oferece um painel visual para explorar containers, imagens, volumes e redes; além de atalhos para logs, terminais e ações comuns (start, stop, remove). Abaixo explico passo a passo como configurar e usar a extensão, e adiciono listas práticas, cenários de falha, alternativas e um mini-SOP para produção local.

Requisitos prévios

• Docker Desktop (ou um daemon Docker acessível) instalado e em execução.
• Visual Studio Code atualizado.
• Permissões adequadas para executar o Docker no seu sistema (membros do grupo docker no Linux ou acesso do Docker Desktop no Windows/Mac).

Importante: em Macs com chip Apple Silicon (M1/M2) verifique compatibilidade de imagens (arm64 vs amd64). Se usar WSL2 no Windows, habilite a integração com WSL nas configurações do Docker Desktop.

Instalar a extensão Docker no VS Code

1. Abra o Visual Studio Code.
2. Acesse a vista Extensões (ícone de quadrado ou Ctrl+Shift+X).
3. Procure por “Docker” e instale a extensão oficial da Microsoft.

Após a instalação, um ícone Docker/Containers aparece no canto inferior esquerdo do editor — esse é o Docker Explorer.

Conectar o Docker Desktop ao VS Code

Quando o Docker Desktop estiver em execução, a extensão normalmente conecta automaticamente. Em cenários mais avançados você pode apontar a extensão para:

• um Docker remoto (DOCKER_HOST),
• um contexto Docker diferenciado (docker context),
• ou para o mecanismo integrado do WSL2.

Para verificar a conexão, clique no ícone Docker/Containers para abrir o Docker Explorer. Lá verá containers em execução, imagens, registries, volumes e redes.

Nota: se o VS Code não mostrar o daemon, confirme que o Docker Desktop está rodando e que não há conflitos de rede/firewall. No Windows, permita integração com WSL2 se usar distribuições Linux.

Gerir containers, imagens e volumes a partir do VS Code

No Docker Explorer você pode:

• Ver containers em execução e parados;
• Iniciar, parar, reiniciar e remover containers via menu de contexto (botão direito);
• Construir imagens a partir de um Dockerfile;
• Puxar imagens de registries públicos e privados;
• Inspecionar e remover volumes;
• Ver redes e contextos.

Ao clicar com o botão direito num container aparecem as ações comuns, como Start, Stop, Restart e Remove.

Para imagens, você pode construir, executar e remover diretamente no painel Imagens.

Volumes também aparecem no Explorer e podem ser inspecionados ou removidos.

Criar e executar uma app conteinerizada no VS Code

Abaixo um exemplo prático com uma app Node.js/Express leve. Crie uma pasta de projeto e um arquivo chamado index.js com este código:

const express = require("express");  
const server = express();  
const PORT = 4000;  
  
server.get("/", (req, res) => {  
  res.send("Welcome to our Express app!");  
});  
  
server.listen(PORT, () => {  
  console.log(`App running on port ${PORT}`);  
});

Este código inicia um pequeno servidor Express na porta 4000 e responde na rota raiz.

Gerar Dockerfile a partir da extensão

No Command Palette (⇧⌘P no Mac ou Ctrl+Shift+P no Windows) execute o comando Add Docker files to Workspace. A extensão guiará as escolhas:

• Plataforma: Node.js
• Arquivo package.json (se existir)
• Porta exposta (ex.: 4000)
• Incluir Docker Compose? (sim/nao)

Selecione Node.js como plataforma e o package.json no diretório do projeto.

A extensão gerará um Dockerfile, um .dockerignore e, opcionalmente, um compose.yaml.

Construir e executar a imagem

• Clique com o botão direito no Dockerfile e selecione Build Image, ou use Docker Images: Build Image no Command Palette.

• Verifique a imagem criada na seção Images.

• Execute a imagem clicando em Run (Run Image) ou usando o comando container images: run.

• Confirme qual imagem deseja executar.

• Verifique o container em execução no painel Containers.

• Para abrir a app no navegador, clique com o botão direito no container e selecione Open in Browser.

• A saída de logs aparece no painel de saída/terminal e confirma que o container está rodando.

Mini-SOP: passo a passo rápido

1. Inicie o Docker Desktop.
2. Abra VS Code e instale a extensão Docker.
3. Crie seu projeto e verifique package.json e index.js.
4. Command Palette: Add Docker files to Workspace → Node.js → escolher package.json → expor porta → escolher Compose.
5. Build Image via menu de contexto no Dockerfile.
6. Run Image via painel Images.
7. Validar container no painel Containers e Open in Browser.
8. Para logs: clique em Attach Shell ou View Logs.

Critérios de aceitação

• A imagem é construída sem erros.
• O container inicia e responde na porta configurada.
• Logs mostram inicialização do servidor e ausência de exceções.
• Arquivos .dockerignore e Dockerfile foram gerados e aplicados.

Checklists por função

Desenvolvedor:

• Código local executa sem erros.
• package.json correto e portas definidas.
• .dockerignore inclui node_modules, logs e arquivos sensíveis.

DevOps/SRE:

• Imagens etiquetadas com versões (tags).
• Não expor portas sensíveis em produção.
• Utilizar multi-stage builds para reduzir tamanho.

QA/Tester:

• Contêiner inicia em tempo razoável.
• Rotas essenciais respondem via Open in Browser / curl.
• Logs acessíveis e persistidos quando necessário.

Quando isso pode falhar (cenários comuns)

• Docker Desktop não está em execução ou falta permissão.
• Conflito de portas (porta 4000 já usada localmente).
• Arquitetura da imagem incompatível com a máquina (arm64 vs amd64).
• Falha no package.json ou falta de dependências.
• WSL2 não integrado no Windows causando falha de conexão.

Soluções rápidas:

• Verifique docker ps no terminal; reinicie o Docker Desktop.
• Mude a porta exposta no Dockerfile/compose.
• Use imagens multi-arquitetura ou construa localmente para a arquitetura correta.

Alternativas e abordagens relacionadas

• Usar a CLI do Docker (docker build, docker run) para maior controlo.
• Docker Compose (compose up) para aplicações multi-serviço.
• Extensão Remote - Containers do VS Code para desenvolver dentro do container.
• Codespaces / GitHub Actions para CI/CD automatizado.
• Em ambientes sem Docker Desktop, considerar Podman (compatível CLI) com plugin VS Code adequado.

Boas práticas e segurança

• Não execute processos como root dentro do container; crie um usuário não-root.
• Use multi-stage builds para reduzir superfície de ataque e tamanho final.
• Adicione .dockerignore para evitar incluir segredos e node_modules.
• Evite expor portas não necessárias e prefira mapear apenas o que for preciso.
• Gerencie credenciais via secrets (Docker, Kubernetes ou gerenciadores externos), nunca em código-fonte.

Mini glossary (1 linha cada)

• Container: processo isolado com sistema de arquivos, rede e namespace próprios.
• Imagem: snapshot imutável usado para criar containers.
• Dockerfile: instruções para construir uma imagem.
• Docker Compose: ferramenta para definir e executar aplicações multi-container.

Caixa de fatos e heurísticas

• Portas comuns de desenvolvimento: 3000, 4000, 8080, 5000 (exemplos, ajustar conforme app).
• Heurística de tamanho de imagem: alvo < 200 MB para serviços simples; use Alpine e multi-stage.

Depuração: passos rápidos

1. docker logs para ver saída.
2. docker inspect para detalhes de rede/volumes.
3. Attach Shell (VS Code) para inspecionar o filesystem do container.
4. Rebuild com –no-cache se mudanças não surtirem efeito.

Impacto × esforço (qualitativo)

• Integração via extensão VS Code — impacto alto, esforço baixo.
• Migração para CI/CD com Docker — impacto alto, esforço médio.
• Uso de imagens otimizadas e scanning de vulnerabilidades — impacto médio, esforço médio.

Resumo

Integrar Docker ao VS Code reduz atrito: você gera Dockerfiles automaticamente, constrói imagens e gere containers no mesmo fluxo. Use as checklists para desenvolvimento e produção, aplique boas práticas de segurança e siga o mini-SOP para obter resultados rápidos. Em caso de problemas, verifique status do Docker, conflitos de porta e compatibilidade de arquitetura.

Importante: mantenha segredos fora do repositório e prefira tags e pipelines para promover imagens em ambientes controlados.