비주얼 스튜디오 코드(visual studio code)로 깃 커밋 쉽게 하는 방법

비주얼 스튜디오 코드(visual studio code)를 이하 vsc라고 부르겠습니다

vsc로 코드를 작업하다가 command line으로 깃허브 관리를 쉽게하실 수 있습니다.

바로 깃 extension을 이용하면 됩니다.
우선 깃의 기본에 대해 알아야합니다.

깃 허브 repository에 올리기 위해서는 다음과 같은 과정을 거쳐야 합니다.
1. add
2. commit
3. push

변 경된 파일을 add를 통해 stage 상태로 올리고
commit을 통해 변경 사항을 등록합니다.
이렇게만 하면 local에서만 적용이 되기 때문에 git hub repository에 올리기 위해서는 push를 합니다
이를 vsc에서 편하게 하실 수 있습니다. 차례차례 따라해보세요

- git repository 설정 -

우선 git repo를 만드셨다고 가정하겠습니다. (clone을 위해 최초 README.md 파일 하나 만들어 놔주세요)
그러면 local에서 git 폴더를 만들어주세요 저는 보통 아래 처럼 관리합니다
Document/git/repo1
Document/git/repo2
Document/git/repo3....

1. 깃 초기 연동

원하는 위치에 git이라는 폴더를 만들어주세요
그리고 다음 명령어를 차례차례 입력합니다.

git init 
git config user.email "ssafy@naver.com" 
git config user.name "ssafy" 
git clone 깃repo주소복사 

2. vsc extension 설치

 

3. vsc로 깃 커밋하기

vsc를 켜면 왼쪽에 버튼들이 몇개 보입니다.

저는 아래와 같이 총 8개의 버튼이 보이네요 (extension에 따라 사람마다 다릅니다)

이는 드래그앤 드랍으로 순서를 마음대로 바꿀 수 있어요

위에서 빨간색으로 네모 친 부분을 눌러보세요

 

그러면 위와 같은 창이 옆으로 생깁니다.

깃이 1번에서 연동이 잘 되었다면 여기서 파일들을 커밋하고 푸시하고 풀하고 다 하실 수 있습니다.

저는 지금 총 2개의 git project가 보이네요

 

현재 README.md 파일만 있을텐데 이 파일에 글자를 추가하고 저장하게 되면

위와 같이 CHANGES에 파일이 추가되서 보여요

여기에 변경된 파일들이 보인답니다.

 

- Git Add 하기

이 변경된 내용을 add하기 위해서는 + 버튼만 눌러주면 됩니다.

위 버튼을 누르면 Add가 됩니다.

 

변경된 파일이 여러개인 경우에는 위처럼 한번에 Add 하실 수 있습니다

 

add를 하게 되면 위와 같은 상태로 바뀝니다.

 

- commit 하기

이제 커밋을 해봅시다

위의 Message라고 placeholder가 있는 곳에 commit 메시지를 적어주시면 됩니다.

 

그리고 그 위의 check버튼을 누르면 커밋 끝!!

 

변경사항을 커밋했기 때문에 변경된 내용이 없는 것으로 나옵니다

 

- push하기

그럼 이제 push를 해서 github repo에 올려봅시다

...으로 되어있는 걸 누르면 여러 git 명령어들이 나오는데 여기서 push를 눌러주면 바로 push가 됩니다!

(다른 사람이 push한게 없어서 충돌이 없다는 가정하에...)

 

그리고 vsc 아래에서도 확인하실 수 있어요

아직 push하기 전인데 위 화살표로 되어있는게 commit한 개수

아래 화살표가 push 해야하는 것의 개수를 의미해요. 저거를 눌러주면 바로 푸시(push)나 풀(pull)을 할 수 있어요

그 왼쪽은 현재 master branch라는 의미입니다.

그리고 이제 github에 가셔서 확인해보시면 업로드 되어있을 겁니다

 

- 깃 레퍼지토리 관리

참고로 깃 레퍼지토리 관리를 git lens를 통해서 하실 수 있습니다.

아까 extenstion 설치할때 깔렸을거에요

(더 자세하게 하시려면 명령어를 쓰시거나 gitKraken을 이용하세요)

여기서 커밋할 브랜치 관리

변경된 파일, 라인 히스토리 관리

commit 검색등 하실 수 있습니다