VSCode를 이용한 GitHub 연동하기

 

Git은 개발 중인 소프트웨어의 버전 관리를 도와주는 도구입니다. 코드를 실수로 누락하거나 특정 시점의 상태로 되돌리고 싶은 경우, Git을 사용하면 손쉽게 복구가 가능합니다.

 

최근 많이 사용되는 코드 에디터인 'Visual Studio Code'에도 Git을 이용한 버전 관리 기능이 내재되어 있습니다. 원격 Git 저장소인 GitHub를 이용하면 다른 개발자와의 협업 및 프로젝트 관리에 용이하니, 아래의 방법으로 연동해보세요.

 

앞서 확인하기

해당 조건들을 모두 만족하는지 확인 후, 다음 단계로 넘어가주세요.

1. 컴퓨터에 Git이 설치되어 있습니다.
   💬 아니오 >> Git 다운로드하기 (Stable Build)
2. 사용중인 GitHub 계정이 있습니다.
   💬 계정이 아직 없어요 >> GitHub 계정 만들기

 

---

내 프로젝트를 GitHub에 올리기

컴퓨터에서 작업한 소스 코드를 VSCode를 이용하여 원격 저장소인 GitHub에 올리는 과정입니다.

Git을 이용한 버전 관리는 GitHub 좌측 패널의 세 번째 탭에 위치한 '소스 제어'에서 할 수 있습니다.

 

Git 프로젝트 설정하기

 

프로젝트에서 소스 제어 탭을 처음으로 열었다면, 아직 Git 설정이 완료되지 않아 소스 제어를 사용할 수 없다는 안내 문구가 표시됩니다. '리포지토리 초기화(Repository Init)'를 누르면 .git 폴더가 프로젝트 내에 생성되며 버전 관리를 사용할 수 있게 됩니다. 

 

변경 사항을 저장하기

 

변경 사항을 올바르게 저장하기 위해선, Git 버전 관리에서 가장 중요한 '영역' 개념에 대해 먼저 이해해야 합니다.

• 작업 영역(Working Directory) : 우리가 실제로 파일을 추가하고 수정하는 공간입니다. Git의 추적을 받지 않습니다.
• 스테이징 영역(Staging Area) : Git이 추적할 변경 사항을 올려 놓는 공간입니다. 사용자가 작업 영역에서 "버전으로 기록할 파일"만을 선별하여 이 곳에 올려놓습니다.
• 로컬 저장소에 커밋(Commit) : 스테이징 영역에 올려놓았던 파일들을 묶어 하나의 버전으로 만듭니다. 즉, 커밋을 통해 영구적으로 해당 상태가 기록됩니다. 이후에는 언제든 다시 이 시점으로 돌아올 수 있습니다.

즉, 현재 프로젝트에서 (상태를 기록할) 파일을 골라 스테이징하고, 스테이징된 파일들을 커밋하여 하나의 버전으로 만들게 됩니다.

아래는 해당 순서대로 변경 사항을 저장하는 방법을 알려드리겠습니다.

 

변경 사항의 모든 파일들에 마우스를 올리면 '+'(스테이징) 버튼이 표시됩니다.

작업 영역에서 원하는 파일을 골라 스테이징하거나, '모든 변경 내용 스테이징'을 선택해 현재 상태를 저장할 준비를 완료합니다.

 

 

스테이징 준비가 완료되었다면, 커밋 메시지를 작성하세요.

이전과 비교해 어떤 점이 달라졌는지를 작성하는 것이 관례이며, 최초의 업로드라면 "Initial Commit"으로 작성해도 좋습니다.

 

아래 글을 참고하여 커밋 메시지 작성 방법에 대해 자세히 알아보세요.

[Git] 좋은 commit message 작성법

 

 

작성자 정보 입력하기 (최초 실행 시)

커밋을 했을 때 최초 1회에 한해 username과 email을 입력하라는 안내 문구가 출력될 수 있습니다.

Ctrl + J (터미널) 를 눌러 아래 명령어를 입력하세요.

git config user.name (작성자 이름)
git config user.email (작성자 이메일)

 

다른 사람이 해당 프로젝트를 열었을 때, 커밋 히스토리에 해당 이름과 이메일이 보이게 됩니다.

 

GitHub에 게시하기

현재의 커밋은 컴퓨터 내에만 저장되어 있습니다. 다른 사람과 공유하거나 원격 저장소에 백업하기 위해선 게시해야 합니다.

 

'게시'를 눌러 Private 또는 Public 리포지토리로 업로드할 수 있습니다.

• Private : 업로드 된 리포지토리는 나(작성자)와 내가 추가한 협력자만 볼 수 있습니다.
• Public : 업로드 된 리포지토리를 누구나 볼 수 있습니다.

게시가 완료되었다면, 본인의 깃허브에서 업로드된 리포지토리를 확인할 수 있습니다.

 

 

---

변경된 코드를 GitHub에 업데이트하기

 

게시 이후, 최신 변경 사항을 GitHub 원격 리포지토리에 업데이트 하려면 Push(푸시) 하세요.

---

GitHub에서 프로젝트 가져오기

로컬 저장소에 없는 GitHub 리포지토리를 새롭게 가져오거나, 다른 사용자가 올린 소스코드를 내려받을 때 해당 방법을 사용합니다.

리포지토리의 초록색 'Code' 버튼을 눌러 Git 주소를 복사합니다.

 

'F1' 또는 'Ctrl+Shift+P' 를 눌러 명령 팔레트를 열고 'git clone'을 검색합니다.

 

아까 복사해두었던 리포지토리 url을 붙여넣으면 로컬 저장소로 GitHub의 소스코드를 가져올 수 있습니다.

 

 

---

프로젝트를 최신 상태로 업데이트하기

원격 저장소에 새로운 변경사항이 업로드되었을 때, 로컬 저장소에도 원격 저장소의 최신 변경 사항을 가져올 수 있습니다.

팀프로젝트에서 다른 사람이 푸시(Push)한 새로운 코드를 가져올 때, 또는 내가 다른 컴퓨터에서 작성한 코드를 동기화할 때 사용할 합니다.

 

소스 제어에서 '풀(Pull)'을 눌러 현재 브랜치에 대한 최신 변경 사항을 통합하세요.

브랜치란 Git에서 커밋들의 연속된 히스토리를 가리키는 포인터로, 다음 글에서 더 자세히 다루어 보겠습니다.