클라우드 서버에 PuTTY, FileZillra 등을 사용해서 SSH, SFTP를 사용한다.

vscode에서 Remote - SSH extension을 설치하면 원격으로 코드를 수정하고 실행할 수 있다.

 

1. vscode extension 설치

좌측에서 extensions 탭을 클릭한다.

remote 라는 검색어를 입력하면 Remote - SSH 가 나오는데, Microsoft에서 제작한 것을 설치하면 된다.

 

2. 비밀키 위치 이동

서버에서 제공한 key 파일을 C:\Users\사용자이름\.ssh 폴더에 넣습니다. 

 

3. Command Palette 실행 ( 단축키 : Ctrl + Shift + P )

Remote라고 입력하면 Remote-SSH가 검색된다.

 

4. Remote-SSH: Add New SSH Host... ( 새로운 원격 호스트 추가 )

명령어 본인의 정보를 한줄로 넣어준다.

ssh -i {key 파일 경로} {사용자}@{ip주소} -p {port번호}

(또는 애초에 -i 명령어 입력 시 key파일의 절대주소 값 입력)

[예시]

ssh -i ~/.ssh/key root@118.67.133.181 -p 2223

 

5. Remote-SSH: Connect to Host...

명령 팔레트를 통해 실행시키면 등록된 호스트 리스트들이 나오고, 그 중 연결하고자 하는 호스트를 선택한다.

연결하고 나서 좌측 Explorer 탭을 클릭하면 Connected to remote 에서 "Open Folder" 를 클릭한다.

원하는 원격지의 디렉토리를 클릭하면. 그것이 Work Directory로 IDE가 시작된다.

이제 본격적으로 사용하는 방법에 대해서 알아보자.

우리가 주로 다룰 탭은 'Source Control' 탭이다.

내 'Repository'에 소스가 변경되면 'Source Control'에 띄워지게 된다.

'Explorer' 탭에서도 수정된 파일을 확인해 볼 수 있다. M이라고 표시되는 것을 보면 Modify의 줄인말인듯 하다.

 

[git add]

스테이징 상태로 올리기 위해서는 버튼 하나만 클릭하면 된다!

수정한 파일 옆의 + 버튼을 누르면  git add가 된다!

 

[git reset]

만약 git add를 취소하고 싶다면?? git reset을 해야하는데!

Staged Changes 폴더에 있다면, ADD가 된 것들이고,

' - ' 버튼을 누르면 스테이징 취소가 되어 우측 상태로 원상 복구가 된다.

 

[check changes]

이전 소스에서 어떤 것이 변경되었는지 표시되어 확인할 수 있다.

 

[git discard changes]

다음은 테스트를 위해 주석을 한줄 추가 했다.

그랬더니 변경사항으로 해당 주석을 안내하고 있다.

왼쪽이 이전 소스이며, 우측이 최신 소스인데, 

최신 소스를 이전소스로 다시 되돌리는 방법으로 discard changes를 사용한다.

화살표 버튼을 누르면 다시 되돌릴 것인지를 정확히 물어보고, 

최종적으로 Discard Changes를 누르면 이전 소스로 원복해 버리고, source control 목록에서 제거되어 버린다.

이전 소스와 같이 되어 변경된 사항이 없어지게 된다.

 

[git commit]

이제 커밋을 해보자! 역시 버튼 하나와 메세지만 입력하면 된다!

스테이징 된 파일이 있다면, 'SOURCE CONTROL' 우측에 체크 버튼이 COMMIT 버튼이다!

클릭하고, 이제 코멘트를 달아주도록 하자.

메세지 입력란에 특징이 될만한 내용을 입력하고 엔터를 치면! COMMIT이 된다!

혹시 소스가 충돌이 되는 문제는 다음에 다루도록 하자.

충돌이 나서 커밋이 안된다면, 일단 작업한 소스를 백업을 하고, Pull로 받은 뒤에, 작업한 소스를 추가하여 add 후 commit 해주도록 하자!

 

[git push]

이제 Push를 하면 오늘의 잔디밭을 심을 수 있다!!

SOURCE CONTROL 우측 끝에 확장 버튼을 누르면 Push 가 나오는데,

클릭 한번으로 푸시 할 수 있어서 매우 간편하다.

 

[git pull]

pull도 마찬가지로 확장 버튼에서 pull 을 클릭하면 끝!

 

기존에 git bash로 하다가 GUI를 하게 되니 편한 부분이 있다.

하지만 branch나 세부적인 작업들은 bash가 더 나을 것이다.

결국은 TOOL은 그 상황에 맞게 잘 사용하는 것이 좋겠다!

기존에 리눅스 명령어로 깃허브를 사용했는데, 스테이징 하는 것이 눈에 잘 들어오지 않았다.

그래서 상태를 그래픽으로 확인할 수 있는 GUI를 찾다가 발견하게 된 것이

visual studio code 의 "GitHub Pull Requests and Issues" extension 이다!

 

오늘은 그 사용법을 알아보자.

지난 블로그에서 했지만, extension을 먼저 설치해 준다.

그렇게하면, 좌측 메뉴 바에 못보던 깃허브 버튼이 추가되고, 

 

 

설정 위에 있는 사람 아이콘에서 알림이 하나 발생하게 된다.

사람 아이콘을 클릭하면, 상세 내용을 확인할 수 있는데, 깃허브에 로그인을 해달라는 내용이다.

깃허브와 연동해보자.

해당 화면이 나오고 계속하기 버튼을 클릭한다.

아이디와 패스워드를 입력하여 로그인 해준다. 성공하였다면 Success! 라고 나온다!

크롬에서 'Visual Studio Code 열기' 를 물어볼 것이고, vscode 에서는 깃허브 연동에 대한 허용을 물어볼 것이다.

열기하여 연동해주면 된다.

 

누구나 무료로 쉽게 사용할 수 있는 IDE인 Visual Studio Code를 설치해보자.

먼저, Google에 'visual studio code' 라고 입력하여 검색하거나 아래의 링크로 이동한다.

https://code.visualstudio.com/

 

Visual Studio Code - Code Editing. Redefined

Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications.  Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.

code.visualstudio.com

해당 사이트로 들어가게 되면, 다운로드 버튼이 있다.

다운로드 버튼을 누르고, 조금 기다리면 "VSCodeUserSetup-x64.exe" 가 다운로드 된다.

이제 설치를 시작해보자. 

동의하고 다음을 클릭한다.

본인이 설치하고 싶은 경로로 변경하여 설치해도 무방하다.

이름은 웬만하면 그대로 유지하고 다음을 눌러준다.

이번 블로그에 핵심인데, "Code(으)로 열기"를 꼭 선택하고 다음을 클릭한다. 저것을 선택하게 되면~

향후 손쉽게 디렉토리나 소스파일을 vscode로 열어 작업할 수 있게 된다.

저것을 체크하지 않으면 따로 별도의 작업을 해야만 해당 기능을 사용할 수 있게 된다.

기타에 3가지 항목이 들어 갔는지 확인하고 설치를 한다.

이렇게 하면 설치가 완료 되었고, VScode를 실행해보자.

vscode에서 python을 실행해 보기 위해서는 Extension을 설치해 주어야 한다.

블록 모양 버튼(Extension) 버튼을 클릭하고, 검색바에 'python'을 검색하여

'Microsoft' 사에서 제작한 Python을 설치해 준다. 다른 것을 사용하기 보다 해당을 추천한다.

깃허브 유저는 해당 Extension도 추가적으로 설치하여 쉽게 깃허브를 사용해보자.

다음 블로그에는 깃허브 익스텐션에 대해 작성할 예정이다.

+ Recent posts