VS Code를 사용한 원격 개발
2019년 5월 2일 | The VS Code Team, @code
요약
오늘 저희는 Visual Studio Code를 위한 세 가지 새로운 확장 프로그램의 미리 보기 버전을 출시하게 되어 기쁘게 생각합니다. 이 확장 프로그램들은 컨테이너, 물리적 또는 가상 머신에서의 원격 개발, 그리고 Linux용 Windows 하위 시스템(WSL)과의 원활한 개발을 지원합니다. 시작하기를 위해 원격 개발 확장 팩을 설치하시면 즉시 시작하실 수 있습니다.
참고: 현재는 Insiders 빌드를 사용해야 하지만, 원격 개발 지원은 결국 안정(Stable) 릴리스에서도 제공될 예정입니다.
어떻게 여기까지 오게 되었는지 자세히 알아보려면 계속 읽어보세요.
개발 동향
VS Code의 인기가 높아짐에 따라, 저희는 다양한 개발 환경을 가진 더 많은 사용자와 소통할 기회를 얻었습니다. 이 중 상당수는 저희의 환경과는 매우 달랐습니다. 이러한 소통을 통해 VS Code를 발전시켜 실제 개발자들의 고충을 해결할 방법을 찾으려고 노력했습니다.
이러한 대화 과정에서 흥미로운 패턴이 나타났습니다. 많은 개발자들이 특정 개발 및 런타임 스택으로 구성된 컨테이너 및 원격 VM을 대상으로 VS Code를 사용하여 개발하려고 시도하는 것을 보았습니다. 이는 로컬에 이러한 개발 환경을 설정하는 것이 너무 어렵거나, 방해가 되거나, 때로는 불가능했기 때문입니다.
우리 모두 이 문제를 경험한 적이 있습니다. 해당 머신을 완전히 밀어버릴 때라고 생각하지 않는 한 :), 새로운 스택(Rust, Go, Node, Python3 등)을 시도하는 것을 망설입니다. 현재 잘 맞춰진 환경을 "망칠까 봐" 걱정하기 때문입니다.
Python 개발자들은 VS Code로 전환하고 싶어 하지만, 특정 Python 스택에 맞춰 구성된 개발 환경으로 컨테이너와 가상 머신을 사용해야 하기 때문에 그렇게 할 수 없습니다.
코드베이스가 매우 크기 때문에 Facebook(그리고 Microsoft!)과 같은 회사에서는 vim과 같은 편집기를 사용하여 안전하고 강력한 "개발자 VM"에 원격으로 연결하고, 최고의 노트북조차 처리할 수 없는 규모의 대안 클라우드 기반 검색 및 탐색 서비스를 사용합니다.
데이터 과학자들은 대규모 데이터셋을 분석하기 위해 방대한 저장 공간과 컴퓨팅 서비스가 필요한 경우가 많으며, 이는 견고한 데스크톱에서도 저장하거나 처리할 수 없는 데이터입니다.
Linux용 Windows 하위 시스템(WSL)의 인기는 부분적으로 대상 운영 체제를 포함한 격리된 개발 환경을 쉽게 설정할 수 있도록 하기 때문입니다. 실제로 VS Code 리포지토리에서 세 번째로 많이 댓글이 달린 이슈는 Windows의 Linux 배포판에서 Bash 터미널을 사용하여 code를 실행하는 것을 지원하는 것입니다.
현재 솔루션의 과제
이러한 대화 내내, 우리는 개발자들이 이러한 유형의 개발에서 직면하는 동일한 과제들을 계속해서 들었습니다.
-
원격 데스크톱은 작동할 수 있지만, 일부 Linux 배포판에서는 설정이 어렵거나 불가능하며, 개발 경험이 "지연"될 수 있습니다.
-
SSH와 Vim(또는 파일 동기화 기능이 있는 로컬 도구)은 작동하지만, 느리고 오류가 발생하기 쉬우며, 일반적으로 최신 개발 도구의 생산성이 부족합니다.
-
브라우저 기반 도구는 다양한 시나리오에서 유용하지만, 개발자들은 데스크톱 도구가 제공하는 풍부함과 익숙함, 또는 기존에 로컬에 설치된 도구 체인을 포기하고 싶어하지 않습니다.
더 나쁜 것은(저희 생각에는!) 개발자들이 이러한 환경에서 작업하기 위해 IntelliSense(자동 완성), 린팅, 디버깅과 같은 핵심 VS Code 경험을 희생해야 했다는 것입니다.
다른 접근 방식
이러한 과제들을 듣고 WSL 지원을 살펴보았는데, 간단해 보였습니다. VS Code를 설치하고(당시에는 조심스럽게!) 평소처럼 Windows 파일 시스템을 편집했습니다. Node.js의 원격 디버깅을 활성화하기 위한 작업을 수행했고, Bash 셸에서 code를 실행할 수 있도록 작은 스크립트를 설치하면 될 것이라고 생각했습니다.
하지만, 그것은 올바르지 않았습니다. Node.js 디버깅에서 했던 것처럼 각 런타임마다 특별한 작업을 하는 것은 말이 되지 않았습니다. Windows에 Python 2.7과 Flask가 설치되어 있거나(또는 전혀 없음!) Linux 배포판에 Python 3.7과 Django가 설치되어 있다면, VS Code가 모든 것을 Windows 버전으로 보고 있었기 때문에 제대로 된 자동 완성이나 린팅을 얻을 수 없었을 것입니다. Windows와 Linux 모두에서 개발 환경을 복제해야 한다는 점은 WSL을 사용하는 목적 자체를 무색하게 만들었습니다.
우리는 VS Code를 두 곳에서 동시에 실행할 수 있는 방법, 즉 개발자 도구를 로컬에서 실행하고 물리적 또는 가상 머신(예: 컨테이너 또는 VM)의 컨텍스트에서 실행되는 개발 서비스 세트에 연결하는 방법이 필요하다고 확신하게 되었습니다. 이를 통해 원격 환경의 컨텍스트에서 풍부한 로컬 개발 경험을 얻을 수 있습니다.

VS Code 원격 확장 기능 소개
지난 몇 달 동안 저희는 코드 계층 간의 올바른 경계를 재설정하고 로컬 개발 환경에 대한 가정을 제거하기 위해 열심히 노력해 왔습니다. WSL, Docker 컨테이너 또는 SSH를 통한 물리적 및 가상 머신에서 실행되는 원격 워크스페이스를 위한 세 가지 새로운 확장 프로그램을 개발했습니다.

WSL 확장 프로그램을 사용하면 VS Code에서 바로 Linux용 Windows 하위 시스템(WSL)을 완전한 개발 환경으로 사용할 수 있습니다. 이 새롭고 최적화된 지원을 통해 다음을 수행할 수 있습니다.
- Windows를 사용하여 플랫폼별 도구 체인 및 유틸리티를 사용하는 Linux 기반 환경에서 개발할 수 있습니다.
- WSL 또는 마운트된 Windows 파일 시스템(예:
/mnt/c)에 있는 파일을 편집할 수 있습니다. - Windows에서 Linux 기반 애플리케이션을 실행하고 디버깅할 수 있습니다.
명령 및 확장 프로그램은 Linux 배포판에서 직접 실행되므로 경로 문제, 이진 호환성 또는 기타 OS 간의 문제를 걱정할 필요가 없습니다. Windows에서처럼 VS Code를 WSL에서 사용할 수 있습니다.
WSL에서 개발하는 것이 얼마나 쉬운지 보여주는 2분짜리 짧은 동영상을 확인해 보세요.
자세한 내용은 WSL에서 개발하기 문서를 참조하세요.
원격 - SSH 확장 프로그램을 사용하면 SSH 서버가 실행 중인 모든 원격 머신, VM 또는 컨테이너에 호스팅된 폴더 또는 워크스페이스를 열 수 있습니다. SSH를 통한 개발을 통해 다음을 수행할 수 있습니다.
- 로컬 머신보다 더 크고, 빠르거나, 더 특화된 하드웨어에서 개발할 수 있습니다.
- 로컬 머신에 영향을 미치지 않고 다양한 원격 개발 환경 간에 빠르게 전환하고 안전하게 업데이트할 수 있습니다.
- 고객 사이트나 클라우드와 같이 다른 곳에서 실행되는 애플리케이션을 디버깅할 수 있습니다.
예를 들어, 딥 러닝 프로젝트를 진행한다고 가정해 보겠습니다. 일반적으로 GPU가 많이 필요한 가상 머신(예: Azure Data Science Virtual Machine)이 필요하며, 대규모 데이터셋으로 모델을 훈련하는 데 필요한 모든 도구와 프레임워크로 구성되어 있습니다.
SSH를 통한 Vim 또는 Jupyter Notebook을 사용하여 원격 코드를 편집할 수 있지만, 로컬 개발 도구의 풍부함을 포기하게 됩니다. 대신 원격 - SSH 확장 프로그램을 사용하면 VM에 연결하고 Python과 같은 필요한 확장 프로그램을 설치한 다음, 로컬에서 작업하는 것처럼 IntelliSense(자동 완성), 코드 탐색, 디버깅과 같은 VS Code의 모든 훌륭한 기능을 활용할 수 있습니다.
SSH를 통해 가상 머신에서 개발하는 것이 얼마나 쉬운지 보여주는 2분짜리 짧은 동영상을 확인해 보세요.
자세한 내용은 SSH를 사용하여 개발하기 문서를 참조하세요.
Dev Containers 확장 프로그램을 사용하면 Docker 컨테이너를 개발 컨테이너로 사용할 수 있습니다. 컨테이너는 훌륭한 개발 환경을 제공합니다. 왜냐하면
- 배포할 운영 체제와 동일한 환경에서 일관되고 쉽게 재현 가능한 도구 체인으로 개발할 수 있습니다.
- 컨테이너는 격리되어 있으므로 로컬 머신에 영향을 주지 않고 다른 개발 환경 간에 빠르게 전환할 수 있습니다.
- 다른 사람들이 일관된 개발 환경에서 쉽게 개발, 빌드 및 테스트할 수 있으므로 프로젝트에 기여하기 쉽습니다.
devcontainer.json 파일을 사용하여 VS Code에 Dockerfile, 열기 포트, 컨테이너에 설치할 확장 프로그램 등 개발 컨테이너를 구성하는 방법을 지시할 수 있습니다. VS Code가 워크스페이스에서 devcontainer.json을 찾으면 자동으로 이미지를 빌드(필요한 경우)하고 컨테이너를 시작하며 연결됩니다. 파일이 컨테이너에 마운트되므로 파일을 열고 전체 IntelliSense(자동 완성), 코드 탐색, 디버깅 등으로 편집을 시작할 수 있습니다.
Development Containers의 작동 방식을 보여주는 2분짜리 짧은 동영상을 확인해 보세요.
개발 컨테이너에 대한 자세한 내용은 컨테이너 내부에서 개발하기 문서와 오늘 바로 사용할 수 있는 샘플을 포함하는 vscode-remote-try-* 리포지토리를 참조하세요.
확장 프로그램 관리
원격 개발 시 VS Code는 확장 프로그램이 노출하는 기능에 따라 로컬 또는 원격에 설치할 확장 프로그램을 추론하려고 시도합니다. 확장 프로그램은 다음 두 가지 범주 중 하나에 속합니다.
-
UI 확장 프로그램은 로컬에 설치됩니다. 이러한 확장 프로그램은 UI만 사용자 지정하고 워크스페이스의 파일에 액세스하지 않으므로 완전히 로컬 머신에서 실행될 수 있습니다. 로컬에 설치되므로 작업 중인 워크스페이스에 관계없이 항상 사용할 수 있습니다. UI 확장 프로그램의 예로는 테마, 스니펫, 언어 문법 및 키맵이 있습니다.
-
작업 영역 확장 프로그램은 원격으로 설치됩니다. 편집을 위해 작업 영역의 파일과 폴더에 액세스하여 IntelliSense(자동 완성), 정의로 이동, 디버깅 등을 제공합니다. 이러한 확장 프로그램은 UI를 사용자 지정할 수 있습니다. 이러한 확장 프로그램은 원격 호스트의 파일 시스템 및 도구에 완전히 액세스할 수 있도록 원격으로 실행됩니다.

대부분의 확장 프로그램은 업데이트되었으며 원격 환경에서 제대로 작동하지만, 그렇지 않은 경우 문제가 발생하면 해당 확장 프로그램에 대해 이슈를 제출해 주시기 바랍니다.
확장 프로그램 제작자
VS Code 확장 프로그램을 만드는 경우, 원격 인식 확장 프로그램 API를 구현했습니다. 예를 들어, open 패키지를 사용하여 브라우저 창을 로드하는 대신, 확장 프로그램 제작자는 브라우저를 로컬로 열 vscode.env.openExternal API를 사용해야 합니다. 마찬가지로, 내용을 로컬 클립보드에 배치하는 새로운 clipboard 클래스가 있습니다.
원격 환경에서 확장 프로그램을 실행, 테스트 및 디버깅하는 방법에 대한 자세한 내용을 포함하여 더 많은 정보를 업데이트된 API 설명서에서 찾을 수 있습니다.
시작하기
여기까지 읽어주셔서 감사합니다!
Visual Studio Code 원격 개발을 시작하는 3가지 빠른 단계
-
Insiders 빌드를 설치하세요. 안정(Stable) 버전에서 사용 가능해질 때까지 원격 개발에 필요합니다. Insiders 빌드는 최신 기능과 버그 수정이 포함되어 매일 배포됩니다. 안정성에 대해 걱정되신다면, 걱정하지 마세요! 저희는 VS Code 개발에 Insiders 빌드를 사용하며, 문제가 발생할 경우(그리고 저희에게 알려주시면) 안정(Stable) 버전과 함께 설치할 수 있습니다.
-
WSL, SSH 및 컨테이너 지원을 설치하는 가장 쉬운 방법인 원격 개발 확장 팩을 받으세요. 모두 필요하지 않다면 개별 확장 프로그램을 제거할 수 있습니다.
-
문서를 읽으세요. 문서를 읽어보세요. Dev Container 샘플을 사용해 보세요. Python으로 개발하는 경우(많은 분들이 그렇습니다!), Dan Taylor의 VS Code에서의 원격 Python 개발에 대한 블로그 게시물을 확인하세요.
마지막으로, 문제가 발생하면 이슈를 제출해 주세요. 일반적인 질문에 대한 답변은 FAQ를 참조하세요.
여러분의 의견을 들려주세요!
행복한 코딩 되세요,
@code 팀

