서버도, 비용도 필요 없습니다. HTML 파일 하나만 있으면 10분 안에 전 세계에서 접근할 수 있는 사이트를 만들 수 있습니다.
GitHub Pages
깃허브 페이지 소개
GitHub Pages는 GitHub에서 공식 제공하는 정적 웹사이트 무료 호스팅 서비스입니다. 별도의 서버를 구매하거나 클라우드 비용을 지불할 필요 없이, Git 저장소에 파일을 올리는 것만으로 웹사이트가 자동으로 배포됩니다.단계별 배포 방법 (4단계)
1. GitHub 저장소 (Repository) 생성
GitHub에 로그인한 뒤 우측 상단 + 를 누르고 New repository를 클릭합니다.
- Repository name: 원하는 이름을 입력합니다 (예: my-portfolio)
- Public 설정 — GitHub Pages 무료 플랜은 Public 저장소에서만 동작합니다
- Add a README file 체크 권장 (초기화 편의)
2. HTML 파일 업로드 (또는 Git으로 푸시)
두 가지 방법 중 편한 방법으로 올리시면 됩니다.
방법 A - GitHub 웹 업로드 (Git 없이)
- 저장소 페이지에서 상단 'CODE' 탭으로 이동합니다.
- 중간에 Uploading an existion file 을 클릭합니다.
- index.html 및 style.css, script.js 등 필요한 파일 드래그 앤 드랍 합니다.
- Commit changes 클릭합니다.
방법 B - Git CLI 사용 (권장)
git clone https://github.com/사용자명/저장소명.git
cd 저장소명
# index.html 등 파일을 이 폴더에 복사한 뒤
git add .
git commit -m "feat: add initial website files"
git push origin main
3. GitHub Pages 활성화
- 저장소 상단 탭에서 Settings 를 클릭합니다.
- 좌측 사이드바에서 Pages 메뉴 선택합니다.
- Source 항목에서 Deploy from a branch 선택합니다.
- Branch를 main, 폴더를 / (root)로 설정합니다.
- 하단에 Save 버튼을 클릭
4. 배포 확인
보통 1~3분 내에 배포가 완료됩니다. Settings → Pages 화면 상단에 배포된 URL이 표시됩니다.배포 URL 형식https://사용자명.github.io/저장소명/
트러블 슈팅
404 페이지가 뜨는 경우
- 원인 : index.html 파일 없음 또는 파일명 오타
- 해결 : 루트에 index.html 확인, 대소문자 통일
배포가 10분 넘게 안 된는 경우
- Pages 설정 미저장, 또는 Actions 실패
- Actions 탭에서 오류 로그 확인
CSS·JS가 적용 안 되는 경우
- 파일 경로에 / 오류
- 상대 경로(./style.css) 사용 확인
수정 후 반영이 안 되는 경우
- 브라우저 캐시
- 강제 새로고침 Ctrl+Shift+R (Mac: Cmd+Shift+R)
Private 저장소인데 배포 안 되는 경우
- 무료 플랜은 Public만 지원
- 저장소를 Public으로 전환하거나 GitHub Pro 업그레이드
0 댓글