Skip to main content

VS Code Remote Tunnel 기반 개발 환경 가이드

등록일: 2026-05-08


본 문서는 스마트폰(S23/G8) 및 랩독(Lapdock) 환경에서 홈서버 자원을 활용하기 위한 'Remote Tunnel'의 설치, 자동 실행 설정 및 제거 방법을 기술함.

1. 서버 측 설정 (Home Server Side)

[설치 및 인증]

  1. 홈서버 터미널에서 다음 명령어를 실행하여 터널을 개설함.
    code tunnel
  2. 출력되는 8자리 인증 코드를 확인한 뒤, microsoft.com/devicelogin 접속.
  3. 코드 입력 후 GitHub 또는 Microsoft 계정으로 로그인하여 인증을 완료함.
  4. 생선된 터널 주소(https://vscode.dev/tunnel/<servername>)를 기록함.

[백그라운드 서비스 등록]

터미널을 종료하거나 서버 재부팅 시에도 터널이 자동 실행되도록 시스템 서비스로 등록함.

# 서비스 설치 및 자동 시작 설정
code tunnel service install

2. 클라이언트 접속 (Client Side)

[PWA 설치]

  1. 폰 브라우저(삼성 인터넷/크롬)에서 기록한 터널 주소로 접속함.
  2. 브라우저 메뉴에서 **'홈 화면에 추가'**를 선택하여 설치함.
  3. 홈 화면의 아이콘을 실행하여 독립된 앱 환경에서 작업함.

[원격 연결]

  1. 하단 파란색 원격 아이콘 또는 Connect to Tunnel 메뉴를 선택함.
  2. 서버에서 설정한 터널 이름을 선택하여 홈서버 환경에 진입함.

3. 서비스 제거 및 정리 (Uninstall)

환경을 초기화하거나 서비스를 중단하고 싶을 때 아래 명령어를 사용함.

[서비스 해제]

백그라운드에서 실행 중인 자동 시작 서비스를 제거함.

# 서비스 중단 및 제거
code tunnel service uninstall

[터널 로그아웃 및 데이터 정리]

계정 연결을 해제하고 로컬에 저장된 터널 관련 데이터를 삭제함.

# 계정 로그아웃
code tunnel user logout

# (수동 설치한 경우) 바이너리 삭제
rm code vscode_cli.tar.gz

4. 운용 팁

  • 확장 프로그램: Cline, Codex 등의 AI 확장은 서버 측에 설치되어 폰의 자원을 소모하지 않음.
  • 포트 포워딩: React, Spring Boot 실행 시 자동으로 로컬 루프백(localhost) 터널링이 수행됨.
  • 네트워크: 지하철 등 이동 중 세션이 끊겨도 인터넷 재연결 시 자동으로 복구됨.