개발/개발 환경 설정

VSCODE와 GIT 저장소 연동

루플 2022. 9. 14. 01:05

개인노트북에 개발 환경을 처음부터 설치하게 되어서

 

나중에 혹시 헤매는 일을 대비하기 위해 설치 과정을 개인적으로 정리하기로 했습니다.

 

아래 과정은 설정 과정을 주관적으로 정리한 내용이라 개인마다 차이가 있을 수 있습니다.


1. Vscode 설치

https://rupeul17.tistory.com/3

 

VsCode 설치 방법

1. 설치파일 다운로드 Download Visual Studio Code - Mac, Linux, Windows Download Visual Studio Code - Mac, Linux, Windows Visual Studio Code is free and available on your favorite platform - Linux, m..

rupeul17.tistory.com

 

에디터로 사용할 Vscode를 설치합니다.

 

자세한 내용은 블로그 내 다른 포스트에 정리하였습니다.

 


2. Git 설치

Git 설치 (tistory.com)

 

Git 설치

1. 설치파일 다운로드 Git - Downloads (git-scm.com) Git - Downloads Downloads macOS Windows Linux/Unix Older releases are available and the Git source repository is on GitHub. GUI Clients Git comes w..

rupeul17.tistory.com

 

다음으로 Git을 설치합니다.

 

이것도 블로그 내 다른 포스트에 정리하였습니다.

 


3. Git 저장소를 Vscode와 연동하기 (로컬로 가져오기)

앞에서 Vscode와 Git을 설치하였으면 이젠 Vscode와 Git 저장소를 연동을 하도록 하겠습니다.

 

 

Git을 설치하였다면 Vscode 실행 후 F1키를 누른 후 Git Clone 을 검색하면 위와 같이 검색이 될 것입니다.

 

Git: Clone을 선택해줍니다.

 

 

그러면 위와 같이 저장소 URL을 입력하라는 창이 뜹니다.

 

여기에 내가 가져오고 싶은 저장소의 주소를 복사해서 넣어주시면 됩니다.

 

 

 

Github 사이트에 접속하셔서 내가 원하는 저장소의 URL을 복사하여 입력해줍니다.

 

 

 

그러면 위와 같이 저장소를 저장할 위치를 선택하는 창이 나옵니다.

 

본인이 저장하고 싶은 디렉토리를 지정해줍니다.

 

 

모든 작업이 완료되면 workspace에서 저장소에서 가져온 소스를 확인할 수 있습니다.


4. Commit 및 Push 해보기

저장소에서 소스를 가져왔으니 이번에는 변경사항을 Git에 올려보겠습니다.

 

 

시험을 위해 저장소 내 테스트 문서를 작성하고 저장하였습니다.

 

 

그 뒤에 화면 왼쪽에 브런치 모양의 아이콘을 누르면 위와 같이 저장소 내 변경사항을 보여줍니다.

 

Push를 하기 위해 '+' 모양의 아이콘을 눌러 staged 상태로 변경해줍니다.

 

 

변경되었으면 Message를 입력하고 Commit을 해줍니다.

 

 

Commit이 완료되면 Push를 할 수 있는 상태가 됩니다.

 

Sync Changes 를 눌러주면 Push가 진행되어 저장소 내 변경사항이 반영됩니다.

 

 

※ 처음 Push를 진행할 때 Github 계정 연결을 요구하는 창이 뜹니다.

 

Github 계정을 로그인 해주면 Push 가 정상적으로 진행됩니다.

 

 

 

이렇게 Vscode와 Git 설치 및 연동, 그리고 Commit 까지의 과정을 정리해보았습니다.

 

본문 서두에 적었듯이 두 번 헤매지 않도록 주관적인 시점에서 기록한 것이니 

 

개인마다 위 과정과 다를 수 있습니다.