5/13 GitHub와 Visual Studio Code 연동하기

1. Visual Studio Code를 설치할 때

Code로 시작하는 것 두 개에 꼭 체크해준다.

 

 

2. GitHub에서 연동할 Repository를 만든다.

README에 꼭 체크한다.

 

 

3. 해당 Repository의 git 주소를 복사한다.

 

 

4. Git을 설치한 후에,

연동할 폴더를 내 컴퓨터의 어디에 만들고 싶은지 정하고,

해당 폴더에서 마우스 오른쪽 클릭하고 Git Bash Here를 누른다.

※ 바탕화면에 만들려면 바탕화면에서 마우스 오른쪽 클릭

 

Git Bash를 켜고

git clone git주소

를 입력하고 엔터친다.

※ 여기서는 붙여넣기가 Ctrl+v가 아니라 Shift+Insert이다.

 

그러면 해당 폴더에 자동으로 Repository와 같은 이름의 폴더가 생성된다.

이 폴더에는 README 파일과 함께 숨겨진 git 파일들이 존재해서

Visual Studio Code와 연동할 수 있게 해준다.

 

 

 

5. 연동할 폴더에 마우스 오른쪽 클릭한 후

Code로 열기를 누른다.

 

 

6. 예시로 ex1.html 파일을 만들었다.

 

 

7. 왼쪽 세번째 Source Control로 가서 Message를 입력한 후 체크표시(Commit)를 누른다.

※ 만약 이렇게 뜰 경우

Git CMD를 열어서 다음과 같이 등록해주고 다시 시도하면

깃허브 로그인 창이 뜬다.

Continue를 눌러서 Authorize해주고, 그 후에 VS code 열기를 꼭 Yes해줘야 한다.

 

 

 

8. 체크표시 오른쪽에 ...을 클릭하고 Push를 누른다.

 

 

10. Push가 완료된 후에 GitHub의 Repository로 들어가면 연동이 되어 있는 것을 볼 수 있다!

 

※ 설정 밑에 master 눌러서 로그인

 

 

* Extensions에서 Live Server 설치하기

→ html 파일 열 때 마우스 오른쪽 클릭하고

Server로 열기 클릭

* PC설정 - 앱 - 기본 앱 - 웹 브라우저를 Chrome으로 바꿔준다.