Git

[Git] VSCode와 git의 연동 및 git 내용

easy-6 2025. 3. 9. 21:25

1.VSCode를 설치한다. 

https://code.visualstudio.com/download

 

Download Visual Studio Code - Mac, Linux, Windows

Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. Download Visual Studio Code to experience a redefined code editor, optimized for building and debugging modern web and cloud applications.

code.visualstudio.com

 

2. git을 설치해줘야한다. 

본인의 경우는 OS를 윈도우로 사용하기 때문에 Windows 버전으로 다운 받았다. 

https://git-scm.com/downloads/win

 

Git - Downloading Package

Download for Windows Click here to download the latest (2.48.1) 64-bit version of Git for Windows. This is the most recent maintained build. It was released on 2025-02-13. Other Git for Windows downloads Standalone Installer 32-bit Git for Windows Setup. 6

git-scm.com

 

3. 해당 방법을 통해 git bash에서 본인의 git과 VSCode의 연결고리 생성 및 pull과 push를 할 수 있다. 

https://easy-6.tistory.com/30

 

[Git] git허브 설정 및 react 파일 올리기

깃허브에서 처음 repository를 생성 후, VSCode와 연동 하려고 하였다. 아래는 그 과정이다.  1. git 설치 후 Git Bash에서 환경 설정을 해줌  1.1) 환경설정 1단계 git config --global user.name "사용자 이름 "

easy-6.tistory.com

 


 

4.  3의 내용에서 추가된 내용 

// git과 관련된 주요 내용 

-- 기존 존재하는 프로젝트를 다운 받는게 아닌 새로운 프로젝트를 생성 후 git의 새로운 repository와 
연동시키기 위해서는 먼저 git init을 사용해야한다. 

 

# git init 
.git 하위 디렉토리 생성함 

 

# git add . 
커밋에 모든 파일 변경 사항을 포함 


# git pull 

pull 을 통해서 내용을 받을 수 있음

-- 미리 만들어진 git을 다른 컴퓨터에서 받아올 때

 

 

  • VSCode 기준

1. F1 누른 후 git clone 검색

 

2. 깃허브 계정과 연동

 

3. 깃허브 연동시 git repository URL 입력 및 git repository를 선택할 수 있음

 

  3-1 URL 입력 >> repository 들어간 후 code 화면에서 HTTPS의 링크 복사 후 VSCode에서 입력

 

  3-2 git repository 선택 >> 해당 화면처럼 본인이 repository를 선택할 수 있음

 

 

4. 저장할 local 위치 선택 -- 본인의 경우에는 c\users\user에 저장해놓음 (조만간 따로 개별 폴더 생성 후 내부에 보관할 예정 )

 

5. Open 클릭 -- Open : 현재 열려있는 VSCode에서 Open

-- Open in New Window : 새로운 창으로 VSCode Opeen

-- Add to Workspace : 현재 열려있는 VSCode에 Workspace를 추가함

[그림1] VSCode WorkSpace 선택

 

6. 위의 내용을 통해서 git의 내용을 가져온 걸 확인 할 수 있다. 


  • 깃 허브 push 및 pull로 받는 순서

1. git add .

-- 커밋에 파일 변경 사항을 한번에 모두 포함 해서 add로 추가함

ex :: git add .

[그림 2]Terminal에서 git add.로 추가

 

(생략 가능)
git status 
--  파일의 상태를 확인할 수 있음

ex :: git add . 후 git status를 사용한다면 아래의 이미지를 확인할 수 있음

 

[그림 2]Terminal에서 git status로 파일 상태 확인

 

 

2. git commit -m "커밋 메시지"

-- 커밋 생성 (기존 파일의 변경사항을 확정)

ex :: git commit -m "Update README"

[그림 3]Terminal에서 git commit으로 기존 파일의 변경사항을 업데이트함

 

3. git push origin "브랜치이름"

-- commit을 통해 변경한 사항을 원격 서버에 업로드함

ex :: git push origin -m master

[그림 4]Terminal에서 git push origin master 로 변경된 사항을 원격 서버에 업로드함

 

 

4. git pull -- 원격 저장소의 변경 내용이 현재 디렉토리에 가져와지고(fetch) 병합됨 (merge)

  ●변경 사항이 없을 때 pull 하면 나오는 이미지

[그림 5]Terminal에서 git pull로 파일 받음

  ● 변경 사항이 존재할 때 pull 하면 나오는 이미지

[그림 6]Terminal에서 git pull로 파일 받음

 

출처 :: https://crong-cat.tistory.com/entry/Visual-Studio-Code%EC%97%90%EC%84%9C-github-%EC%86%8C%EC%8A%A4-%EA%B0%80%EC%A0%B8%EC%98%A4%EA%B8%B0

 

Visual Studio Code에서 github 소스 가져오기

1. Visual Studio Code 실행 (비 워크스페이스 열기 : Ctrl + Shift + N) 2. 키보드 F1 > git clone 검색 후 선택 3. git repository URL입력한다. 3-1. git 로그인 > 받으려는 레파지토리에서 Code 클릭 후 URL 복하해서 붙여

crong-cat.tistory.com

 

https://velog.io/@delilah/GitHub-Git-%EB%AA%85%EB%A0%B9%EC%96%B4-%EB%AA%A8%EC%9D%8C

 

[GitHub] Git 명령어 모음

_ # INDEX _ _ Git 명령어 _ 명령어 | 명령어 | 내용 설명 | |:----------:|:----------:| | $ git init | .git 하위 디렉토리 생성 | | $ git add 파일명 | 수정사항 중, 커밋에 추가 | | $ gi

velog.io