내가 만든 웹페이지를 세상에 공개하기 위해서 간단하게 github로 배포할 수 있다!
git과 github 계정만 있다면 여러운 과정 없이 무료로 배포 가능하다.
GitHub Pages는 GitHub의 리포지토리에서 HTML, CSS 및 JavaScript 파일을 직접 가져와서 필요에 따라 빌드 프로세스를 통해 파일을 실행하고 웹 사이트를 게시하는 정적 사이트 호스팅 서비스입니다.
GitHub 프로젝트 시작
우선 github.com으로 접속한다.
Repositories에서 기존 프로젝트를 사용하거나, 아님 New 버튼을 눌러서 새로운 프로젝트로 만들 수도 있다.
새로운 프로젝트 만들기
* private 프로젝트는 배포 불가능!
create repository 버튼을 누르면 아래와 같은 페이지로 넘어가는데
creating a new file 과 uploading an existing file 중 고를 수 있다.
나는 만들던 프로젝트를 업로드하여 배포할 것이기 때문에
두번째 버튼을 눌러주겠다.
choose your files 버튼을 눌러서 내가 원하는 폴더/파일을 업로드 해주고
Commit changes 버튼만 눌러주면!
새로운 프로젝트 생성 완료.
프로젝트 설정
프로젝트 배포를 위해서 설정에 들어가준다.
settings > Pages 에 들어가서
Branch를 None -> main 으로 바꾸어주고 save버튼까지 눌러준다.
2-3분 정도 대기하고 페이지를 새로고침 해주면?
짜잔! 깃허브 링크로 프로젝트가 배포되었다.
이 때 배포하는 주소는 http://{깃허브 계정}.github.io/{프로젝트명}으로 고정된다.
주의사항
하지만 여기서 문제..
분명 이전 프로젝트에서 연습했을 때에는 잘 됐었는데..
내가 모르고 있던 것이 하나 있었다.
읽어보니 나보고 index.html 파일을 내놓으란다.
찾아보니,
깃허브 배포에서는 동적인 페이지는 배포가 불가능하며, 정적인 페이지 (html, css, js)만 배포가 가능하다.
또한, 프로젝트 최상단 루트 경로에 index.html 파일이 존재해야한다.
이런! 내 프로젝트 파일은 mypage.html이었기 때문에 안되었던 것이다.
다시 index.html로 파일을 바꾸어서 배포해보면?
내가 개발 중인 페이지가 잘 나오는 것을 볼 수 있다!!!
