Products & Services/VS Code

[VSCODE] VS Code 를 이용한 원격(Remote) 코드 개발

TechNote.kr 2019. 11. 13. 23:35
728x90

 

 

 

VS Code 를 통한 원격 개발이 필요한 상황들


[상황 1]
Client 개발일 경우 일반적으로 Local Machine 에서 개발이 가능하지만 Server 개발일 경우 원격으로 접속하여 개발을 하거나, Local Machine에서 개발 후 Server로 이동을 시키던지 해야 한다. 

[상황 2]
사용하는 Local Machine가 Windows 인 반면 Linux Program을 개발해야 한다면 원격으로 Linux Machine에 접속하여 개발을 진행해야 한다. 

이와 같이 다양한 상황에서 Remote Machine을 상대로 개발을 해야하는 경우가 있다. 이와 같은 경우 실제 사용하는 Machine과 개발 대상 Machine이 서로 달라 개발에 불편한 점이 발생하곤 한다. 

하지만 VS Code와 Microsoft의 Remote Development Extension를 사용한다면 Local Machine에 Source Code 없이도 마치 Remote Machine을 Local Machine 처럼 생각될 수 있도록 개발하는 것이 가능하다. 

[VS Code 의 Remote Development Extension Link]

 

[VS Code 의 Remote Development Extension 구조도, 출처 : https://code.visualstudio.com/docs/remote/ssh]


 그림에서 보듯이 Local Machine에서 VS Code 를 이용하여 작업하지만 그 작업 대상은 Remote Machine으로 해당 Machine에 접속해 VS Code Server를 설치하고 해당 Machine에서 동작할 필요한 Extension 설치 후 마치 Local Machine에서 하듯이 코드 개발, 실행, 테스트 등을 수행할 수 있다. 

현재 해당 Extension 은 3가지 형태의 원격 개발을 가능하게 한다. 

 

SSH (Secure Shell)

Containers 
WSL (Windows Subsystem for Linux)

 

 

 

VS Code 에서 SSH 를 통한 원격 개발 설정


1) VS Code 의 Extensions Marketplace 에 가서 Remote Development 를 Install 한다. 

 

 

 

2) Remote Development 를 Install 하게 되면 Remote - WSL, Remote - SSH, Remote - Containers 등이 일괄 설치되는 것을 확인할 수 있다.  

 

 

 

3) 원격 접속을 위해 화면 왼쪽 하단의 >< 모양의 아이콘을 클릭하면 아래와 같은 메뉴를 볼 수 있다. SSH 를 이용한 원격 접속을 할 예정이므로 Remote-SSH: Connect to Host... 메뉴를 선택한다. 

 

 

 

4) userID@IPAddress 형식으로 아래와 같이 연결하고자 하는 정보를 입력한다. 

 

 

 

5) 접속을 하게 되면 새로운 VS Code 가 실행되면서 접속을 이어간다. 

 

 

 

6) 접속이 완료되면 좌측 하단에 연결 정보가 표시된다.

 

 

 

OUTPUT 창을 유심히 본다면 VS Code Server 가 원격 Machine에 설치되어 구동 되고 있다는 로그를 확인할 수 있다. 

 

 

 

7) 원격에 연결만 되었을 뿐 Workspace에 추가된 Folder가 없으므로 Open Folder 버튼을 눌러 추가한다. 

 

 

 

 

 

 

 

8) 원격의 workspace 를 만들었다 하더라도 개발 환경 extension 설치를 해야 한다. 원격 연결 후에 extension 을 설치하려고 하면 Install in SSH: OOO.OOO.OOO.OOO 이런식으로 원격에 설치할 수 있도록 버튼이 추가되어 보인다. 해당 버튼을 눌러 원격에 설치하고자 하는 extension을 설치한다. 

 

 

 

설치가 되면 Reload 가 필요하고 Reload Required 버튼을 누르면 VS Code 가 재실행된다.

 

 

 

이후 재실행된 VS Code 에서는 설치한 extension 을 원격에 설치된 Extension 목록에서 확인할 수 있다. 

 

 

 

9) 이후 원격 Machine에서 사용할 Python Interpreter 를 고르고, 테스트 코드를 작성하여 실행할 수 있다.  

 

 

 

10) 코드 작성 후 오른쪽 상단의 삼각형 모양의 아이콘을 누르면 실행된다.

 

 

 

11) 별도의 terminal 없이 바로 하단에서 원격 실행 결과를 확인할 수 있다. 

 

 

 

 

Key file 을 통한 SSH 자동 접속 in VS Code


 위와 같이 해둘 경우 VS Code 로 SSH 접속시 마다 인증을 진행해야만 한다. 좀 더 편히 작업을 하기 위해서는 Key File을 미리 생성해 두어 자동으로 접속하게 하는 것이 필요하다. 

 

Windows 10 에서 VS Code 를 사용하여 원격 Machine (Linux) 에 접속할 경우 PowerShell 에서 다음과 같이 명령어를 수행한다. (단, 계정이 한글이어서 경로에 한글이 있을 경우 정상적으로 진행되지 않는다. 이로인한 문제로 인해 계정을 새로 만들기도 하였다.)

PS C:\Users\User> ssh-keygen -t rsa -b 4096
PS C:\Users\User> $REMOTEHOST="user@192.168.0.52"
PS C:\Users\User> scp "$env:USERPROFILE\.ssh\id_rsa.pub" "${REMOTEHOST}:~/tmp.pub"
PS C:\Users\User> ssh "$REMOTEHOST" "mkdir -p ~/.ssh && chmod 700 ~/.ssh && cat ~/tmp.pub >> ~/.ssh/authorized_keys && chmod 600 ~/.ssh/authorized_keys && rm -f ~/tmp.pub"

 

 

 

 

728x90