
A integração do Docker com o Visual Studio Code (VS Code) aprimora significativamente a experiência de desenvolvimento, permitindo que os desenvolvedores criem e gerenciem arquivos Docker com eficiência, visualizem contêineres e imagens visualmente e acessem logs ou terminais com facilidade. Este artigo fornece um guia completo sobre como configurar o Docker no VS Code por meio da extensão Docker.
Como instalar a extensão Docker no VS Code
Antes de instalar a extensão do Docker, certifique-se de que tanto o Docker quanto o Visual Studio Code estejam configurados corretamente em sua máquina. Para começar, abra a visualização de Extensões no VS Code, pesquise por “Docker” e instale a extensão oficial do Docker fornecida pela Microsoft.

Após a instalação ser bem-sucedida, você notará um ícone do Docker/Containers aparecer no canto inferior esquerdo do seu editor, indicando que o Docker Explorer agora está disponível.

Estabelecendo uma conexão entre o Docker Desktop e o VS Code
Quando o Docker Desktop está em execução, a extensão do Docker com o VS Code se conecta perfeitamente. Normalmente, nenhuma configuração adicional é necessária, a menos que a configuração do Docker envolva configurações especiais (por exemplo, hosts remotos ou integração com WSL).
Para verificar a conexão, clique no ícone Docker/Containers para iniciar o Docker Explorer. Lá, você poderá observar seus contêineres em execução e parados, juntamente com imagens, registros, volumes e redes.

Gerenciando contêineres, imagens e volumes diretamente do VS Code
Com o Docker totalmente integrado ao VS Code, gerenciar tarefas de contêiner nunca foi tão fácil. Você pode visualizar contêineres em execução e parados na seção CONTÊINERES.

Além disso, clicar com o botão direito do mouse em qualquer contêiner lhe dará opções para iniciar, parar, reiniciar ou removê-lo com apenas um clique.

Você também pode extrair novas imagens, criar imagens a partir de configurações existentes ou limpar imagens não utilizadas facilmente. Por exemplo, para excluir uma imagem que não é mais necessária, basta clicar com o botão direito do mouse sobre ela e selecionar Remover.

Além disso, gerenciar volumes vinculados aos seus contêineres é simples: clique com o botão direito do mouse no volume desejado para inspecioná-lo ou modificá-lo.

Você também pode explorar e gerenciar redes, registros, contextos do Docker e obter acesso a uma seção de ajuda e feedback, otimizando ainda mais seu fluxo de trabalho de desenvolvimento.
Criando e executando um aplicativo em contêiner no VS Code
Como exemplo prático, vamos criar um aplicativo Node.js Express simples para ilustrar os recursos da extensão Docker. Comece criando uma nova pasta no VS Code para o seu projeto. Dentro dessa pasta, crie um arquivo chamado index.js
e insira o seguinte 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 trecho de código básico estabelece um pequeno aplicativo Express escutando na porta 4000, respondendo com a mensagem “Bem-vindo ao nosso aplicativo Express!” quando a URL raiz (/) é acessada. Ele estabelece uma base para testar seu Dockerfile.
Em seguida, você precisará de um Dockerfile. Em vez de criar um Dockerfile manualmente e especificar suas instruções, a extensão Docker pode facilitar esse processo. Abra a Paleta de Comandos pressionando ++ no ⇧⌘PMac ou Ctrl++ no Windows e digite o comando.ShiftPAdd Docker files to Workspace

Selecione Node.js como sua plataforma de aplicação entre as opções fornecidas.

Aponte para o arquivo “package.json” localizado na raiz do seu projeto. Este arquivo é o arquivo de configuração principal do seu aplicativo e guiará a extensão Docker na geração de arquivos essenciais relacionados ao Docker.

Em seguida, indique o número da porta que seu aplicativo utilizará para que o Docker possa expô-lo adequadamente.

Selecione Sim quando solicitado a incluir o arquivo Docker Compose.

A extensão Docker agora gerará um Dockerfile, um arquivo “.dockerignore” e um arquivo “compose.yaml”, dependendo da sua seleção.

Para prosseguir com a criação da sua imagem do Docker, clique com o botão direito do mouse no Dockerfile e selecione Build Image ou, alternativamente, execute Docker Images: Build Image na Paleta de Comandos.


Após o processo de compilação, navegue até a seção Imagens no Docker Explorer para ver seu projeto recém-criado refletido lá:

Agora, para executar a imagem, abra a Paleta de Comandos e execute container images: run
, ou simplesmente clique com o botão direito na imagem e selecione Executar.

Selecione sua imagem mais recente na lista exibida.

Por fim, você pode validar se seu aplicativo está em execução verificando a seção Contêineres no Docker Explorer.

Para acessar seu aplicativo, clique com o botão direito do mouse no contêiner em execução no Docker Explorer e selecione Abrir no navegador.

Como resultado, você poderá ver o contêiner em ação com seu aplicativo acessível pela porta especificada anteriormente.

Conclusão
A integração do Docker com o Visual Studio Code agiliza o processo de desenvolvimento, permitindo que os desenvolvedores construam, executem e controlem contêineres com eficiência diretamente de seu ambiente de programação. Após concluir a configuração, você terá acesso direto para criar arquivos do Docker, navegar por contêineres e imagens e visualizar logs ou saídas de terminal com apenas um clique. Essa integração não apenas simplifica a execução e os testes de aplicativos, como também mantém um fluxo de trabalho organizado e produtivo.
Deixe um comentário