Coding/Web.

[Web. / Github] VS코드 프로젝트 깃허브 연동

Wonder Park 2023. 9. 10. 14:39
728x90

 

깃허브에 코드 업로드 하고 어디서든 다시 불러와서 수정할 수 있어서 개인 프로젝트할 때 굉장히 유용한 것 같습니다. 물론 근본적으로 협업을 위한 툴이긴 하지만요.

그 동안은 외장하드 등에 저장하기도 하고 Git. 설치하지 않고 폴더채로 깃허브에 올리기만 하고. 그래서 불편했었습니다. 

  git 설치

git 설치는 별로 어려운 과정이 없습니다. 운영체제에 맞게 다운 받아서 설치하면 됩니다. 

https://git-scm.com/downloads

 

Git - Downloads

Downloads macOS Windows Linux/Unix Older releases are available and the Git source repository is on GitHub. GUI Clients Git comes with built-in GUI tools (git-gui, gitk), but there are several third-party tools for users looking for a platform-specific exp

git-scm.com

  repository 저장 기본 로직

<출처 : https://heannim-world.tistory.com/130>

로컬 저장소에 프로젝트를 저장하여 클라우드에 올리고 다시 로컬 저장소를 만들어 (본인이 작업하는 컴퓨터) 다운 받아서 작업을 하면서 Index 작업 후 업로드를 하는 로직을 이해하는 것이 중요해 보입니다. 

  깃허브 새 저장소 (Repository) 생성

https://github.com/

 

GitHub: Let’s build from here

GitHub is where over 100 million developers shape the future of software, together. Contribute to the open source community, manage your Git repositories, review code like a pro, track bugs and fea...

github.com

깃허브에 접속하여 로그인 하고 본인 대시보드에 들어가면 repository 생성을 할 수 있습니다. 

 

Repository Repository

이름 만들고, public or private  선택 후 바로 생성하면 됩니다.  그리고 아래의 주소를 복사해놓으면 됩니다. 

 
 VS코드에서 커밋 푸시 하기

사실 깃허브 목록에서 버튼을 눌러 바로 진행이 가능합니다만 아무래도 개발을 공부하니 터미널을 통해 명령어 작업을 하는 것이 도움이 될 것 같습니다. 

1) 터미널을 엽니다.

git init

2) 깃허브 저장소 위치를 설정합니다. 

저장소 입력하고 git remote -v 로 확인합니다.

git remote add origin 복사한 저장소 주소
git remote -v

3) 커밋할 파일 추가합니다.  브랜치 게시합니다. 

왼쪽 프로젝트 섹션에서 깃 메뉴 들어가면 변경사항에 있는 소스파일을 볼 수 있습니다. 커밋 메시지 입력하고 커밋합니다. 

커밋 완료 후 바로 branch 게시하기 버튼이 뜹니다. 눌러주면 아래와 같이 깃허브에 자알 올라가 있습니다. 

위 작업을 터미널에서 명령어로 모두 진행하는 것이 추후에는 더욱 편하고 명확하다고 하는데 단순히 변경사항 커밋 후 게시하는 것은 버튼을 통해 진행할 수 있습니다. 

참고로 처음 진행할 때는 개인 토큰을 발행 후 인증을 받아야 하는 것으로 알고 있습니다. 이 역시 추후에 제 개인 토큰 만료가 되면 다시 한번 블로깅하도록 하겠습니다. 

 

728x90

'Coding > Web.' 카테고리의 다른 글

[Web개발/공부] M1 맥에 HomeBrew 설치하기  (0) 2023.08.29
[Web 개발/공부] 호스팅과 배포?  (0) 2023.08.29