[Git] Github와 VSCode 연동(원격 레퍼지토리 생성, commit, push)

이번 포스팅에서는 github에 원격(remote) 저장소(repository)를 생성한 후 VSCode로 작성한 소스파일을 commit, push 하는 과정을 다뤄보도록 하겠다.

 

아직 Git을 설치하지 않았다면, 이전 포스팅을 참조해서 설치를 먼저 해야 된다.(Window 10 기준)

 

 

원격 저장소 생성

1. https://github.com/ 사이트에 접속 후 회원가입/로그인한다.

 

2. 화면 좌측에 'New'를 선택한다.

 

3. 표시된 부분만 작성한 후 생성

Description은 생략해도 된다.

 

 

 

원격 저장소 생성 끝

너무 쉽다.

 

그다음, 생성된 원격 저장소와 VSCode를 연결하면 끝이다.

이번 포스팅에서는 git add, commit, push에 대한 개념들은 따로 설명하지 않겠다. 단순히 방법만 설명한다.

 

1. VSCode 프로젝트 폴더로 이동한 후 터미널을 연다.

 

2. 아래 명령어를 입력한다.

 

git init

 

위 명령어를 입력하는 것만으로도 VSCode에서는 그냥 사용할 수 있다.

'소스 제어'에서 웬만한 기능을 다 제공해주고 있어서 저장소 연결부터 커밋, 푸시까지 다 할 수 있다.

 

명령어로 진행하는 방법도 있지만, 이번 포스팅에서는 VSCode 기능으로 진행하는 방법만 설명하도록 하겠다.

VSCode '소스 제어'가 보이지 않는다면 Ctrl + Shift + G 단축키를 누르면 된다.

 

소스 제어를 진행하기 전 git user.name과 user.email을 설정해야 한다.

 

[설정 방법]

터미널에 아래 명령어를 입력한다.

 

git config --global user.name {이름}
git config --global user.email {깃허브 이메일}

 

이메일로 사용자 검증을 진행하기 때문에 입력을 잘해야 한다.

 

[VSCode와 Github 연동]

 

1. 원격 저장소 연결

'원격 추가'를 누르면 URL, 이름을 입력하라고 한다.

원격 저장소 URL을 넣고, 이름은 아무거나 해도 되지만 일반적으로 remote를 사용한다.

 

 

2. 소스 add(staging) 및 commit

수정된 코드에 마우스를 올리면 여러 가지 기능이 보인다.(되돌리기, 스테이징)

로컬에 있는 소스파일이 원격 저장소에 올라가는 순서는 staging -> commit -> push로 진행된다.

 

 

먼저, 원격 저장소에 올릴 소스를 스테이징 하자.

전체 소스를 다 올리려면 개별적으로 '+' 할 필요가 없다. '변경 사항'에 마우스를 올리면 '+'가 나온다. 해당 버튼을 클릭하면 된다.

 

 

스테이징을 하면 위와 같이 표시가 되는데, 커밋 메시지를 입력한 후 커밋 버튼을 누르면 된다.

만약, name과 email을 저장하지 않으면 아래처럼 에러가 발생한다.

 

 

커밋 시 푸시까지 함께 진행할 수도 있지만, 우선 따로 진행을 하는 것으로 설명하겠다.

 

커밋까지 했으면 푸시해서 원격 저장소를 확인해보자.

 

 

만약 최초로 연동하는 거면, VSCode에서 github에 로그인할 수 있도록 허용하라는 팝업들이 뜬다.

허용하면 된다.

 

 

그리고 github를 확인해보면, 소스가 정상적으로 올라온 것을 확인할 수 있다.