VS Code

사전 요구 사항

1. VS Code
2. Dev Containers 확장 (ms-vscode-remote.remote-containers)
3. 머신에서 실행 중인 Docker 또는 Podman (시작하기 참조). VS Code Dev Containers는 백엔드로서의 Podman도 지원합니다.

빠른 시작

git clone https://github.com/f5-sales-demo/devcontainer.git
code devcontainer

VS Code가 .devcontainer/devcontainer.json을 감지하고 알림을 표시합니다: “컨테이너에서 다시 열기”. 이를 클릭하거나 명령 팔레트를 사용하세요:

Dev Containers: Reopen in Container

VS Code가 이미지를 빌드(또는 풀)하고, 컨테이너를 시작하며, 확장을 설치하고, 컨테이너 내부에서 터미널을 엽니다.

작동 방식

.devcontainer/devcontainer.json 파일은 VS Code에 Docker Compose를 사용하도록 지시합니다:

"dockerComposeFile": ["../docker-compose.yml", "../docker-compose.build.yml"],
"service": "dev",
"workspaceFolder": "/workspace"

devcontainer 설정은 빌드 파일을 명시적으로 포함하므로, “컨테이너에서 다시 열기” 또는 “컨테이너 다시 빌드”를 사용할 때 VS Code가 로컬에서 이미지를 빌드할 수 있습니다.

확장

확장은 컨테이너 내부에 자동으로 설치됩니다:

확장	설명
Python	Python 언어 지원
ESLint	JavaScript/TypeScript 린팅
Prettier	코드 포맷팅
Docker	Dockerfile 및 compose 지원
Terraform	HCL 언어 지원
Go	Go 언어 지원
Rust Analyzer	Rust 언어 지원
YAML	YAML 언어 지원
Kubernetes	Kubernetes 매니페스트 지원

확장을 추가하려면 .devcontainer/devcontainer.json의 customizations.vscode.extensions 배열을 편집하세요.

포트 포워딩

VS Code는 compose 파일에 정의된 포트를 자동으로 포워딩합니다. noVNC 디스플레이는 http://localhost:6080/vnc.html에서 사용할 수 있으며 — VS Code가 포트가 준비되면 알림을 보냅니다.

추가 포트는 VS Code의 포트 패널에서 필요 시 포워딩할 수 있습니다.

Devcontainer CLI 대안

VS Code UI 대신 명령줄을 선호하는 경우:

npm install -g @devcontainers/cli

devcontainer up --workspace-folder .
devcontainer exec --workspace-folder . zsh

다시 빌드

Dockerfile 또는 compose 파일을 변경한 후:

Dev Containers: Rebuild Container

이 명령은 이미지를 다시 빌드하고 컨테이너를 재시작합니다. 이름이 지정된 볼륨(workspace, home)은 다시 빌드해도 유지됩니다.