무냐의 개발일지

[HTML] Github (깃헙)에 프로젝트 업로드 & 웹 호스팅하는 법 / 문제 해결 (총정리!!! ) 본문

LeetCode 코딩테스트

[HTML] Github (깃헙)에 프로젝트 업로드 & 웹 호스팅하는 법 / 문제 해결 (총정리!!! )

무냐코드 2024. 7. 20. 19:13

| 터미널 프롬프트를 통해 Github(깃허브)에 프로젝트 업로드하는 방법

 

1. 프로젝트 진행 중인 로컬 파일 위치로 이동

#플젝 진행중인 해당 폴더로 이동 (예시)
cd /Users//Documents/HTML/Project_name

 

2. git 으로 현재 진행중인 내용 기록하고, Commit 하기 

(remote에 저장할 친구들을 준비시키는 과정)

 

| 전체 FLOW :

Working Directory ->  (git add) -> Staging Area -> (commit) -> Local Repository

# 깃을 작동한다
git init

# 숨겨진 파일을 다 확인한다
ls -a

#나의 staging area에 뭐가 있나 확인
git status

#빨간 파일은 아직 staging area에 없는거고, 이거 추가하는 것
git add 파일명
git add . (한번에 다 넣을 때)

#초록색으로 바뀌고, commit 될 준비가 된 것
#-m으로 commit message를 추가해줄 수 있다 (어떤 게 변경됐는지 기록)
git commit -m "Initial Commit"

 

* commit - m 을 통해, 어떤 내용을 commit하는지, 뭐가 업데이트 됐는지 기록하는 건 중요하다! 

 

3. Local -> (git push) -> Remote Repository (Github) 에 최종 저장하기 ! 

#기록 확인
git log

#remote 에 저장하기
git remote add origin 깃헙 레포지터리 주소 (.git으로 끝남)

#push 하기
git push -u origin main
#(git push -u <remote name> <branch name>

#최종 저장된 애와 지금 내가 변경한 것의 차이점을 보려면
git diff 파일명

#이전 버전으로 돌아가려면
git checkout 파일명

 

 


 

| Github(깃허브)에서 웹 호스팅하는 방법

 

1. 웹으로 만들고 싶은 해당 Repository 위의 Settings - Pages 클릭

 

여기서 Branch 는 내가 작업 중인 것 (나는 main) 을 선택 후 Save

 

 

Actions로 가면, 사이트 제작이 진행 중이고 금방 된다!
끝나면 여기  io 들어간 링크가 뜸 

 

 

* 참고

처음에 이렇게 호스팅된 사이트를 열었더니, Readme 파일에 있는 내용만 뜨길래 당황했는데,

알고보니 파일 명이 index.html 인 애를 메인으로 불러온단다.

다른 파일이름 사용 시, 변환하는 방법도 있긴 하나, 그냥 index.html .을 메인 페이지로 쓰는게 제일 편한 방법임

 

 

그럼 완벽하게 !!  github.io. 로 끝나는 주소의 호스팅이 완료된다 ><