본문 바로가기

카테고리 없음

비주얼 스튜디오 코드에서 깃허브와 연동하는 방법을 알려드립니다.

1. 깃허브 계정 생성

깃허브는 개발자들이 협업하고 프로젝트를 관리하는 데 사용되는 웹 기반의 호스팅 서비스입니다. 깃허브를 사용하기 위해서는 먼저 깃허브 계정을 생성해야 합니다. 깃허브 계정을 생성하는 방법은 다음과 같습니다:

  1. 깃허브 홈페이지(https://github.com)를 방문합니다.
  2. 우측 상단의 'Sign Up' 버튼을 클릭합니다.
  3. 요구되는 정보를 입력합니다. 이메일 주소, 사용자 이름, 비밀번호를 입력한 후 'Sign up for GitHub' 버튼을 클릭합니다.
  4. 이메일 계정으로 깃허브 계정을 활성화하기 위한 확인 링크를 받습니다. 이메일을 확인한 후, 링크를 클릭하여 깃허브 계정을 완전히 활성화합니다.
  5. 활성화된 깃허브 계정으로 로그인하여 사용할 수 있습니다.

깃허브 계정이 생성되면, 비주얼 스튜디오 코드와 연동하여 깃허브에 코드를 저장하고 관리할 수 있습니다. 이제 비주얼 스튜디오 코드를 설치해보도록 하겠습니다.

2. 비주얼 스튜디오 코드 설치

비주얼 스튜디오 코드는 마이크로소프트에서 개발한 무료 오픈 소스 소프트웨어 개발 도구입니다. 비주얼 스튜디오 코드를 설치하기 위해서는 다음의 단계를 따르세요:

  1. 비주얼 스튜디오 코드 공식 웹사이트(https://code.visualstudio.com)를 방문합니다.
  2. 웹사이트의 다운로드 페이지에서 운영체제에 맞는 설치 파일을 선택합니다 (Windows, macOS 또는 Linux).
  3. 선택한 설치 파일을 다운로드한 후 실행합니다.
  4. 설치 프로세스를 진행하기 위해 약관에 동의하고 설치 위치를 지정합니다.
  5. 설치가 완료되면 비주얼 스튜디오 코드가 자동으로 실행됩니다.

이제, 비주얼 스튜디오 코드를 실행하여 깃허브와 연동 설정을 진행해보겠습니다.

3. 깃허브 연동 설정

비주얼 스튜디오 코드에서 깃허브와 연동하여 코드를 저장하고 관리할 수 있습니다. 깃허브 연동 설정하기 위해서는 다음의 단계를 따르세요:

  1. 비주얼 스튜디오 코드를 실행합니다.
  2. 상단 메뉴에서 '파일(File)'을 클릭하고 '폴더 열기(Open Folder)'을 선택하여 저장할 프로젝트 폴더를 선택합니다.
  3. 프로젝트 폴더를 열면 왼쪽 사이드바에서 소스 파일들이 표시됩니다.
  4. 왼쪽 사이드바의 아래에 있는 아이콘들 중에서 '소스 제어(Source Control)'(아이콘은 세로로 나란히 된 구분선)를 클릭합니다.
  5. 소스 제어 패널이 열리면 상단에 '소스 제어 관리자 열기(Open Source Control View)'를 클릭합니다.
  6. 소스 제어 관리자 패널이 열리면 '소스 제어 플러그인의 워크스페이스 구성(Configuration of Source Control Provider)' 영역에서 깃(Git) 아이콘을 클릭합니다.
  7. '빠른 시작하는 Git 시작(Quick Start to Git)' 영역에 있는 '진행(Initialize Repository)' 버튼을 클릭하여 깃 저장소를 초기화합니다.
  8. 저장소를 초기화한 이후에는 수정한 파일이나 새로 생성한 파일 등을 선택하여 '커밋(Commit)'할 수 있습니다. 커밋은 변경 사항을 저장하는 것으로 깃허브에 업로드하기 전에 로컬 환경에만 반영됩니다.
  9. '해달라는 메시지가 없어요(No tag changes available)'와 같은 메시지가 표시되면 커밋을 클릭합니다.
  10. 커밋 메시지를 작성하고 'Ctrl + Enter' 키를 누르거나 체크 표시를 클릭하여 커밋을 완료합니다.
  11. 상단 메뉴에서 '소스 제어(Source Control)'을 클릭하고 'Push'를 선택하여 로컬 저장소의 변경 사항을 깃허브에 업로드합니다.

이제, 비주얼 스튜디오 코드에서 깃허브와 연동하여 코드를 저장하고 관리할 수 있습니다. 이로써 깃허브와 비주얼 스튜디오 코드를 활용하여 협업 프로젝트를 시작할 수 있습니다.