원격 개발, 더욱 강력해지다

2022년 12월 07일, Brigit Murtaugh 작성, @BrigitMurtaugh

Visual Studio Code의 핵심은 코드 편집기이며, 원격 개발 환경을 통해 다른 환경과 통합되어 더욱 강력하고 유연해집니다.

Spectrum of remote development options

이 사실을 인지하지 못할 수도 있지만, VS Code에는 편집기 실행 및 관리 방법을 제어할 수 있는 내장 명령줄 인터페이스(CLI)가 있습니다. 명령줄 옵션을 통해 파일을 열거나, 확장을 설치하거나, 진단을 출력할 수 있습니다.

Output of code CLI

CLI는 VS Code Desktop을 사용하는 워크플로우에서 매우 유용하지만, CLI로 원격 인스턴스를 시작할 수 없다는 공백이 있었습니다. 그래서 CLI를 더욱 강력하게 만들기 위해 로컬과 원격을 더 가깝게 연결하여 이 공백을 해결하고자 했습니다.

오늘, VS Code Desktop 또는 vscode.dev에서 VS Code를 실행하고 원격으로 머신에 연결할 수 있도록 향상된 code CLI를 공개하게 되어 기쁩니다. 업데이트된 CLI는 최신 VS Code 릴리스에 포함되어 있으며 독립 실행형 설치로도 사용할 수 있으므로, VS Code Desktop을 설치할 수 없는 컴퓨터에도 안전하게 연결하여 원격으로 작업할 수 있습니다.

새로운 CLI 외에도 원격 개발 개선을 위해 다음과 같은 업데이트를 적용했습니다.

VS Code UI에서 직접 터널링을 활성화할 수 있습니다.
터널링이 더 이상 비공개 미리 보기 상태가 아닙니다. 누구나 가입 없이 터널을 생성하고 사용할 수 있습니다.
두 개의 원격 확장 이름을 변경하여 작동 방식과 개발에 도움이 되는 부분을 더 명확하게 했습니다.
- "Remote - WSL" 확장은 이제 간단히 WSL로 변경되었습니다.
- "Remote - Containers" 확장은 개발 환경을 생성하는 데 사용되는 점을 반영하여 Dev Containers로 이름이 변경되었습니다.

하나의 도구로 어디든 터널링

터널링은 한 네트워크에서 다른 네트워크로 데이터를 안전하게 전송합니다. SSH 또는 HTTPS 설정을 번거롭게 할 필요 없이(물론 원한다면 설정할 수도 있습니다 😊) 보안 터널을 사용하여 VS Code 데스크톱 또는 웹 클라이언트에서 원하는 모든 머신에서 개발할 수 있습니다.

VS Code에서 원격 머신으로 터널링할 수 있는 두 가지 훌륭한 옵션이 있습니다.

새롭고 향상된 code CLI를 사용합니다.
VS Code UI에서 직접 터널링을 활성화합니다.

다음 섹션에서 두 가지 옵션을 모두 살펴보겠습니다.

향상된 `code` CLI

VS Code Server를 출시했을 때, VS Code Server를 code CLI에 통합하려는 장기적인 비전을 언급했습니다. 이제 이 목표를 달성했으며, VS Code Desktop을 설치할 수 없는 VM이나 잠긴 머신에서 작업하는 경우를 대비하여 독립 실행형 설치로도 사용할 수 있도록 했습니다.

다음은 code CLI를 설치하고 보안 터널을 생성하는 단계입니다. VS Code Server의 비공개 미리 보기를 사용했다면 단계가 매우 유사할 것입니다.

참고: VS Code Server의 비공개 미리 보기 기간 동안 독립 실행형 code-server CLI를 사용했다면, 이제 최신 code CLI(최신 VS Code Desktop 또는 독립 실행형 다운로드 사용)를 대신 사용해야 합니다.

로컬 VS Code 클라이언트에서 개발하려는 원격 머신에 code CLI를 설치합니다. 이는 원격 데스크톱, VM 또는 Windows Subsystem for Linux(WSL) 배포판일 수 있습니다.

CLI는 기존 VS Code 설치에 자동으로 포함되어 추가 설정이 필요하지 않습니다. 원격 머신에 VS Code가 설치되어 있지 않거나 설치할 수 없는 경우, 다운로드 페이지에서 독립 실행형 설치를 통해 CLI를 받을 수 있습니다.

참고: 독립 실행형 설치를 사용하는 경우, 다음 섹션의 명령어는 code 대신 ./code로 시작합니다.
도움말 명령어를 사용하여 CLI가 성공적으로 설치되었는지 다시 확인합니다.
```
code -h
```
다음 명령어로 터널링별 명령어를 탐색할 수 있습니다.
```
code tunnel -h
```
CLI를 설치했으니, 이제 이 머신을 터널링용으로 설정하여 모든 VS Code 클라이언트에서 연결할 수 있도록 하겠습니다.
tunnel 명령어로 보안 터널 생성
```
code tunnel
```
이 명령은 이 머신에 VS Code Server를 다운로드하여 시작한 다음, 해당 서버로 터널을 생성합니다.

참고: 머신에서 처음 터널을 시작할 때 서버 사용권 계약에 동의하라는 메시지가 표시됩니다. 프롬프트를 건너뛰려면 명령줄에서 --accept-server-license-terms를 전달할 수도 있습니다.
이 CLI는 이 원격 머신에 연결된 vscode.dev URL, 예: https://vscode.dev/tunnel/<machine_name>/<folder_name>을 출력합니다. 이 URL은 원하는 모든 머신에서 열 수 있습니다.
클라이언트에서 처음으로 vscode.dev URL을 열면, https://github.com/login/oauth/authorize... URL에서 GitHub 계정에 로그인하라는 메시지가 표시됩니다. 이를 통해 터널링 서비스에 인증되어 올바른 원격 머신 세트에 액세스할 수 있는지 확인합니다.

축하합니다! code CLI의 최신 터널링 기능을 성공적으로 설치하고 사용했습니다!

VS Code UI에서 터널링 활성화

원격 머신에 VS Code가 설치되어 있다면 VS Code UI에서 직접 터널을 생성하는 옵션을 선택할 수도 있습니다. 이미 VS Code에서 작업 중이라면 원격 머신에 대한 원격 액세스를 활성화하는 빠르고 편리한 방법입니다.

원격 머신에서 VS Code를 엽니다. VS Code 계정 메뉴에서 원격 터널 액세스 켜기… 옵션을 선택합니다. 아래 이미지에서 볼 수 있듯이, 명령 팔레트(F1)를 열고 Remote Tunnels: Turn on Remote Tunnel Access... 명령을 실행할 수도 있습니다.

Turn on Remote Tunnel Access in the Account menu

GitHub에 로그인하라는 메시지가 표시됩니다. 로그인하면 이 원격 머신에서 터널이 시작되며 연결할 수 있게 됩니다.

Remote tunnel access is enabled toast

원하는 클라이언트에서 위의 알림에서 받은 vscode.dev 링크를 열고 코딩을 시작하세요!

원격 터널을 통해 연결

Remote - Tunnels 확장은 로컬 및 원격 머신 간의 이러한 보안 터널을 관리합니다. code CLI 또는 VS Code UI를 통해 여는 vscode.dev 인스턴스에는 Remote Tunnels 확장이 사전 설치되어 있습니다.

이미 VS Code 클라이언트(데스크톱 또는 웹)에서 작업 중이고 원격 터널에 연결하려는 경우, Remote - Tunnels 확장을 직접 설치하고 사용할 수 있습니다. 확장을 설치한 후, 명령 팔레트(F1)를 열고 Remote Tunnels: Connect to Tunnel 명령을 실행합니다. 활성 터널이 있는 원격 머신에 연결할 수 있습니다.

List of remote machines in Quick Pick

명령 Remote Explorer: Focus on Remote View를 통해 Remote Explorer에서 원격 머신을 볼 수도 있습니다.

List of remote machines in Remote Explorer

터널 또는 머신 제거

CLI를 통해 실행 중인 터널을 중지하려면 Ctrl + C를 사용하여 활성 연결을 종료합니다. VS Code UI를 통해 터널링을 활성화했다면, Remote Tunnels: Turn off Remote Tunnel Access... 명령을 실행합니다.

해당 머신에서 code tunnel unregister 명령을 실행하여 터널링과의 머신 연결을 제거할 수 있습니다. VS Code에서 Remote Explorer 보기를 선택하고 제거하려는 머신을 마우스 오른쪽 버튼으로 클릭한 다음 unregister를 선택합니다.

원격 개발 확장

터널링 및 code CLI 업데이트와 함께, 개발 컨테이너, 원격 머신 또는 WSL을 완전한 기능을 갖춘 개발 환경으로 사용할 수 있도록 하는 원격 개발 확장에도 일부 업데이트를 적용했습니다.

WSL 및 Dev Containers

Remote - WSL 및 Remote - Containers 확장 이름에 대한 피드백을 들었습니다. Remote는 기존 로컬 개발이 아닌 "원격" 또는 "분리된" WSL 배포판 또는 개발 컨테이너에서 개발 중임을 나타내려고 했습니다. 그러나 이는 많은 사람들이 사용하는 "원격"의 다른 사용법이며 혼란을 야기할 수 있습니다 (예: Dev Container가 내 로컬 머신에 있는 것인가?).

이러한 확장의 이름 및 인앱 명령을 명확하게 하기 위해 WSL 및 Dev Containers로 이름을 변경했습니다. Marketplace 및 설명서의 확장 식별자와 같은 링크는 동일하게 유지되므로, 이 두 확장을 현재 사용하는 데 문제가 없을 것입니다.

WSL extension in the Marketplace

Dev Containers extension in the Marketplace

Remote Tunnels

위에서 설명한 대로, SSH 요구 사항 없이 보안 터널을 통해 원격 머신에 연결하는 데 Remote - Tunnels 확장을 사용할 수 있습니다. 이 확장은 "Remote Server"에서 "Remote - Tunnels"로 이름이 변경되었습니다. 이 이름이 동작을 더 명확하게 나타낸다고 생각하기 때문입니다 (결국 이 확장은 보안 터널을 통해 원격 머신에서 개발하는 데 사용됩니다!).

Remote - Tunnels extension in the Marketplace

마무리 - 감사합니다!

오랫동안 원격 환경에 대한 피드백을 받았으며, 최근에는 VS Code Server에 대한 피드백을 받았습니다. 여러분의 의견은 우리 제품 경험을 계속 형성하는 데 큰 도움이 되었으며, 이에 대해 진심으로 감사드립니다. 최신 원격 기능을 어떻게 활용하시는지, 그리고 여러분의 피드백을 기대합니다!

이 블로그에서 설명된 도구에 대해 더 자세히 알고 싶으시면, Remote - Tunnels 확장에 대한 주제를 만들었으며, VS Code Server 및 code CLI 설명서도 최신 변경 사항을 반영하도록 업데이트했습니다.

기능 요청이나 버그는 vscode-remote-release GitHub 저장소에 자유롭게 제출해 주시거나, @code로 트윗을 보내 의견을 공유해 주셔도 좋습니다.

행복한 코딩 되세요!

Brigit Murtaugh, @BrigitMurtaugh