VScode와 Github 연동 완벽 가이드 | 초보자도 따라하는 Git 연동부터 해제까지

 

개발자라면 누구나 한 번쯤 들어본 ‘깃허브(GitHub)’와 ‘VScode’. 하지만 실제로 두 도구를 연동해서 사용하는 방법은 다소 복잡하게 느껴질 수 있습니다. 이번 포스팅에서는 Git, VScode, 그리고 GitHub를 처음 접하는 분들도 쉽게 따라 할 수 있도록 연동 과정을 순서대로 상세히 안내드립니다.

코딩 입문자부터 실무자까지, 누구나 활용 가능한 GitHub 연동법을 지금부터 함께 알아보겠습니다.

---

✅ 목차

1. Visual Studio Code와 Git 설치하기
2. GitHub 계정 만들기
3. Git 기본 설정하기
4. VScode에서 GitHub 연동하기
5. GitHub 연동 해제하기
6. 마무리 및 실전 팁

---

1. Visual Studio Code와 Git 설치하기

🔹 Visual Studio Code 설치

Visual Studio Code(이하 VScode)는 마이크로소프트에서 제공하는 무료 코드 편집기입니다. 가볍고 확장성이 뛰어나 Git과도 자연스럽게 연동됩니다.

설치 방법

1. VScode 공식 홈페이지(https://code.visualstudio.com/)로 이동합니다.
2. Windows, macOS, Linux 중 사용하는 운영체제에 맞는 버전을 다운로드합니다.
3. 설치 프로그램을 실행하고 기본 옵션으로 설치를 진행합니다.

✅ 설치 팁: 특별한 설정 없이 기본 옵션으로 설치해도 무방합니다. 대부분의 기능은 추후 확장팩(Extension)으로 추가할 수 있습니다.

---

🔹 Git 설치

Git은 버전 관리 시스템의 대표 주자입니다. 로컬에서 작성한 코드를 Git을 통해 관리하고, GitHub와 연동해 협업도 가능해집니다.

설치 방법

1. Git 공식 홈페이지(https://git-scm.com/downloads)에서 운영체제에 맞는 버전을 다운로드합니다.
2. 설치 중 여러 설정 옵션이 등장하지만, 일반적인 사용 목적이라면 Next만 눌러 진행하셔도 충분합니다.
3. 설치가 완료되면 터미널 또는 명령 프롬프트를 열어 아래 명령어로 확인할 수 있습니다.

git --version

정상적으로 버전이 출력된다면 설치가 완료된 것입니다.

---

2. GitHub 계정 만들기

GitHub는 코드 저장소를 웹에 올려두고 공유하거나 협업할 수 있는 플랫폼입니다.

가입 방법

1. GitHub 공식 홈페이지(https://github.com/)에 접속합니다.
2. ‘Sign up’을 클릭해 사용자 이름, 이메일, 비밀번호를 입력하고 가입을 완료합니다.
3. 이메일 인증 절차까지 마무리되면 GitHub 사용이 가능합니다.

💡 팁: 하나의 GitHub 계정으로 여러 프로젝트를 관리할 수 있으므로, 개인/팀 프로젝트 모두에 활용할 수 있습니다.

---

3. Git 기본 설정하기

Git을 설치한 뒤에는 본인의 사용자 정보(Name, Email)를 등록해야 합니다. 이 정보는 이후 커밋(commit) 로그에 사용됩니다.

🔸 사용자 정보 설정 명령어

git config --global user.name "사용자이름"
git config --global user.email "사용자이메일@example.com"

설정 확인:

git config --list

정상적으로 설정되었다면, 입력한 이름과 이메일이 리스트에 표시됩니다.

---

4. VScode에서 GitHub 연동하기

이제 본격적으로 VScode에서 GitHub와 연동하여 파일을 업로드하는 방법을 알아보겠습니다.

🔸 예제 프로젝트 준비

1. 작업할 새 폴더(예: Test)를 생성합니다.
2. 폴더 안에 소스 파일을 하나 추가합니다. 예시:

App.java

public class App {
    public static void main(String[] args) {
        System.out.println("Hello World!");
    }
}

---

🔸 VScode에서 GitHub 업로드하기

1. VScode 좌측 사이드바에서 **소스 제어 아이콘(세 번째 Git 아이콘)**을 클릭합니다.
2. "GitHub에 게시" 버튼을 클릭하면 인증 팝업이 나타납니다.
3. GitHub 계정으로 로그인하고 권한을 허용합니다.

🔐 주의사항: GitHub 인증은 최초 1회만 진행하면, 이후에는 자동으로 연결됩니다.

1. 저장소(Repository) 유형 선택:
   • Public: 전체 공개 저장소
   • Private: 비공개 저장소 (자신만 접근 가능)
2. 업로드할 파일을 선택하고 확인을 누르면 GitHub에 자동으로 푸시(Push)됩니다.
3. 브라우저에서 GitHub 저장소 페이지를 열면, 업로드한 파일(App.java)을 확인할 수 있습니다.

---

5. GitHub 연동 해제하기

깃 연동을 해제하고 싶은 경우에는 다음 두 가지 방법을 활용할 수 있습니다.

🔸 방법 1: VScode에서 리포지토리 닫기

1. VScode 좌측 ‘소스 제어’에서 해당 리포지토리를 우클릭합니다.
2. ‘리포지토리 닫기’ 메뉴를 선택합니다.
3. 우측 하단에 ‘닫힌 리포지토리 다시 열기’ 버튼을 클릭하면 언제든 재연결 가능합니다.

🔸 방법 2: 로컬 Git 폴더 삭제

1. 해당 프로젝트 폴더 위치로 이동합니다.
2. 숨김 파일을 표시하여 .git 폴더를 삭제합니다.
   • Windows: 보기 > 숨긴 항목 체크
   • macOS/Linux: Command + Shift + . 또는 ls -a 명령어 사용

❌ .git 폴더 삭제 시 주의: 이전 Git 기록이 모두 삭제되며, 해당 폴더는 Git과의 연동이 완전히 해제됩니다.

---

6. 마무리 및 실전 팁

💬 마무리 정리

VScode와 GitHub 연동은 초보자에겐 다소 생소할 수 있지만, 위 과정을 순서대로 따라가면 누구나 손쉽게 설정할 수 있습니다. 특히 Git은 팀 프로젝트와 협업 시 필수적인 도구이므로, 기초 설정과 사용법을 정확히 익혀두는 것이 중요합니다.

🧠 실전 팁

• commit은 자주자주!
  중요한 작업을 마칠 때마다 commit을 습관화하면 문제 발생 시 이전 버전으로 복구가 용이합니다.
• branch를 적극 활용하자
  실험적인 기능 개발 시 메인 브랜치를 유지하면서 새로운 브랜치에서 작업할 수 있어 충돌 없이 프로젝트를 관리할 수 있습니다.
• .gitignore 설정은 필수
  업로드할 필요 없는 파일(.class, .log 등)은 .gitignore 파일에 등록하여 깃허브에 올라가지 않도록 설정하세요.

---

✅ 마무리

이번 포스팅을 통해 VScode에서 GitHub를 연동하고, Git을 설치 및 설정하는 전 과정을 알아보았습니다. 앞으로 더 많은 개발자들이 효율적으로 협업하고, 자신의 프로젝트를 효과적으로 관리할 수 있기를 바랍니다.

궁금하신 점이나 추가로 다뤄줬으면 하는 Git 관련 주제가 있다면 댓글로 남겨주세요! 👍