본문 바로가기
source-code/software

GitHub 활용하기

by mattew4483 2021. 4. 27.
728x90
반응형

우리의 친절한 GitHub는 만든 웹사이트를 쉽게 배포하도록 도와준다.

 

2021.04.06 - [Deploy] - GitHub로 배포하기

 

GitHub로 배포하기

GitHub는 Code 저장, 이전 상태 복구, 협업 이라는 전통적인(?) 기능뿐만 아니라... 우리가 만든 웹 페이지를 다른 사람들도 이용할 수 있도록 서버에 호스팅 하는 기능을 포함하고 있다! 제일 먼저

23life.tistory.com

요리요리 따라 해 보면... https://본인유저네임.github.io/ 로 페이지 배포가 완료된다!

 

그런데... 해당 레포지토리에 올라가 있는 기존 파일 대신, 다른 HTML 파일로 배포를 하고 싶다면?

 

1. 레포지토리 삭제 후 재생성

제일 간단... 하면서도 간단한 방법!

 

레포지토리 이름이 github.io → 배포 가능! 이라고 생각하면 되는데...

문제는 요 레포지토리는 한 계정 당 하나밖에 만들 수 없다는 것!

 

따라서 기존 github.io 레포지토리를 삭제한 후, 새로 만들어주면 될 일이겠다.

해당 레포지토리의 Settings에 들어간 후 아래로 쭉쭉 스크롤!

 

딱 봐도 위험하게 생긴 Danger Zone 속 Delete this repository를 클릭!

 

그럼 이렇게 확인창이 뜬다.

Please type 어쩌고~에 해당하는 부분을 복사해 입력해준 후 아래 버튼을 클릭하면 레포지토리가 삭제된다.

 

이후 (처음부터) github.io 레포지토리를 만들고... 해당 HTML 파일을 올리고 어쩌고를 반복해주면 완료! 와우!

 

2. 해당 레포지토리에 새로 연결 + 강제 push

추억이 담긴 레포지토리를 삭제하기가 싫다!면 두 번째 방법.

 

먼저 GitHub에 올리고 싶은 파일들이 담긴 폴더에서 Git Bash를 켜주자.

. code 명령어를 입력해 VS코드로!

 

Ctrl + ~ 을 눌러 터미널 창도 켜주자.

ls 명령어를 통해 현재 디렉토리를 확인! → 여기에 있는 파일들이 원격 저장소인 GitHub에 올라간다고 생각하면 된다!

 

git init 명령어를 입력하면 어쩌고 저쩌고가 뜬 후 파란색 글씨로 (master) 가 보이게 된다.

→ git과 연동이 잘 됐고만!

 

다음은 git remote add origin 레포지토리주소 명령어를 입력!

레포지토리 주소를 origin이라는 이름으로 연결한다는 뜻.

이를 통해 다음부터는 origin이라는 이름으로 해당 주소의 레포지토리를 업로드/다운로드할 수 있다. 와!

 

git remote -v 명령어를 통해 연결된 레포지토리를 확인할 수 있다. 잘 됐고만.

 

이제 연결한 레포지토리에 열심히 만든 파일들을 올려주자.

 

git add .git commit -m "커밋 메시지" 를 입력하면 된다!

 

add는 Staging Area에 파일들을 올리고, commit은 Staging Area에 올라간 파일들을 저장한다는 뜻!

무슨 말인지 어렵다면... GitHub에 우리가 만든 파일을 올리기 위해 add → commit이 필요하다고 생각하면 편하다. 우와!

 

이제 이렇게 저장된 파일을 우리의 레포지토리에 올리면 된다

→ 요 녀석은 push!

git push 레포지토리이름 브랜치이름 명령어를 입력하면 되는데,

방금 래포지토리 이름을 origin으로 지정했고, 기본 branch의 이름은 master이므로...

git push origin master로 입력해주면 될 테다! 

 

근데 안된다! 왜?

눈이 아프지만 영어를 어찌저찌 읽어보면... git pull 을 먼저 하란다!

 

왜 이런 일이 일어났지?

→ 레포지토리에 새로 만든 파일을 올리려고 하는데, 해당 레포지토리에는 이미 다른 기존 파일이 있는 상태다!

이 경우 GitHub는 기존 파일을 어떻게 하면 좋을지 알 수가 없기 때문에 (맘대로 지우거나 수정해버리면 큰일 날 테니)

무작정 push를 통해 아무 파일을 업로드하는 상황을 막아둔 것!

 

그럼 어떻게 하면 좋을까?

→ 기존 레포지토리에 있는 파일을 몽땅 받은 후, 새로 만든 파일도 함께 올리면 될 테다!

→ 이 녀석이 pull!

(push는 파일을 밀어 올리는 것, pull은 당겨 받아오는 것이라 생각하면 편할지도!)

 

똑같이 git pull origin master를 입력해주면...

어찌저찌 뭐가 뜨는데 밑에 refusing 거절됐단다! 왜???

부족한 영어 실력으로 읽어보면... unrelated histories를 merge 하는 걸 거부한단다.

→ 현재 레포지토리에 올라간 파일과 지금 우리가 올리려는 파일은 GitHub 입장에서 볼 때... 전혀 상관없는 파일들이다! 

이렇게 서로 관련 기록이 없는 프로젝트의 병합(pull)을 기본적으로 막아두는데

git pull 래포지토리이름 브랜치이름 --allow-unrelated-histories 명령어를 통해 일시적으로 이를 승인할 수 있다. 

 

우리도 똑같이 해주자!

쨔잔. 그럼 새로 만든 new.html 뿐만 아니라, 기존 레포지토리에 있던 파일들(index.html, img 등)이 받아져와 있다!

 

이제 우리가 하고 싶은 건? → 기존 index.html 대신 new.html을 배포하고 싶다!

따라서 index.html 파일을 삭제하고 new.html의 이름을 index.html로 변경해주자.

 

ls 명령어를 통해 확인! 요 녀석들을 레포지토리에 올리면 끝날 테다!

 

똑같이 반복해주자! add → commit → push 순서대로 챡챡챡.

 

쨘. 레포지토리로 돌아가 보면 해당 파일들이 잘 올라가 있다. 작성한 커밋 메시지도 잘 보인다!

 https://본인유저네임.github.io/ 로 접속하면 바뀐 파일이 배포된 것도 확인할 수 있다.

 

여기서 질문, 왜 이렇게 거추장스럽게 하느냐면...

GitHub는 기본적으로 파일을 저장하는 엄청 커다란 외장하드라고 생각하면 된다.

문제는 요 녀석이 원격으로 존재하기 때문에... 한 번 올린 파일을 마음대로 삭제할 수가 없다.

 

위 예시로 들자면, 예전에 올라간 Charlie_Brown 이미지가 필요가 없어서 pull 후 파일을 지우고 push를 한다면?

그래도 레포지토리에는 해당 이미지가 그대로 존재한다. 이미 올려버렸으니까!

물론 이를 강제로 병합하거나 삭제하는 명령어도 있지만...

 

요점은 원격 저장소에 파일을 올리기(push) 전에는 항상 기존 파일들을 받아와야(pull)한다는 것!

 

2021.02.20 - [Deploy] - GitHub 기본 명령어 익히기

 

GitHub 기본 명령어 익히기

Git? 개발을 진행하는 과정마다 분기점을 만들어, 필요할 경우 그 지점으로 갈 수 있도록 만든 것. Git? GitHub? Git은 혼자 작업한 내용을 저장하는 곳. GitHub는 Git의 정보를 다른 사람과 공유하는 플

23life.tistory.com

다른 명령어가 궁금하다면 참고해보자!

728x90
반응형

'source-code > software' 카테고리의 다른 글

API 활용하기  (0) 2021.05.23
Lighthouse로 performance 측정하기  (0) 2021.05.12
기본 웹사이트 제작하기  (5) 2021.04.08
GitHub로 배포하기  (0) 2021.04.06
Web Service 기초  (1) 2021.04.04