GitHub Pages로 무료 웹사이트 만들기
GitHub Pages는 깃허브(GitHub)에서 제공하는 무료 정적 웹 호스팅 서비스예요.
따로 서버를 구매하거나 호스팅 요금을 낼 필요 없이,
깃허브 저장소에 올린 HTML·CSS·JS 파일을 곧바로 웹사이트로 배포할 수 있어요.
덕분에 블로그, 포트폴리오, 프로젝트 문서, 팀 위키까지 활용도가 무궁무진합니다.
2025년 현재, 빌드 시간은 평균 12분 정도이며,
월간 100GB 트래픽을 무료로 지원하고 있어 소규모 사이트에는 충분한 성능을 제공합니다.
GitHub Pages 핵심 요약
- 완전 무료, 서버 비용 없이 사용 가능
- HTTPS 보안 인증서 자동 발급
- 월 100GB 트래픽, 저장소 1GB 제한
- 빌드 후 배포까지 평균 12분 소요
- 개인 블로그, 포트폴리오, 팀 문서에 최적
GitHub Pages가 인기 있는 이유
2024년 기준, 국내 개발자 커뮤니티 조사에 따르면 포트폴리오를 준비하는 개발자 중 약 63%가 GitHub Pages를 활용한다고 답했어요. 이유는 단순합니다. 서버 관리 경험이 없어도 바로 웹사이트를 배포할 수 있고, SSL 인증서까지 무료로 제공돼서 ‘전문적인 사이트’처럼 보이거든요. 게다가 DNS 설정을 통해 개인 도메인을 연결하면 완전히 자신만의 홈페이지를 운영할 수 있습니다.
무료 SSL과 보안 강화
보통 SSL 인증서를 발급받으려면 연 10~50달러 정도의 비용이 들어요. 그런데 GitHub Pages는 Let's Encrypt를 통해 자동으로 HTTPS 인증서를 발급해주고, 530분 이내 자동 반영돼요. 보안이 강화된 HTTPS 사이트는 검색 엔진 최적화(SEO)에도 유리해요.
빠른 배포와 자동화
코드를 main 브랜치에 푸시하면, GitHub Actions가 자동으로 빌드 후 배포까지 진행해줍니다. 평균 소요 시간은 약 12분으로, 팀 프로젝트에서도 매우 효율적이에요. 또, Jekyll이나 Hugo 같은 정적 사이트 생성기와 연동하면 블로그나 기술 문서를 자동으로 갱신할 수도 있습니다.
비용 절감 효과
월 5~20달러 이상 드는 일반 유료 호스팅과 비교하면, GitHub Pages는 1년에 약 24만 원 정도 절약할 수 있어요. 특히 학생이나 프리랜서에게는 부담 없는 선택지예요.
GitHub Pages 시작 방법
준비물은 단 두 가지, GitHub 계정과 저장소 하나예요. 이제 단계별로 살펴볼게요.
1. 저장소 생성
GitHub에서 새로운 저장소를 만들어주세요. 개인 홈페이지라면 저장소 이름을 username.github.io
로 지정하면 기본 주소가 자동 연결돼요. 예: https://honggildong.github.io
.
2. HTML 파일 업로드
index.html
파일 하나만 업로드해도 사이트가 열려요. 단순히 "Hello World"를 출력하는 페이지만 있어도 문제없습니다. 이후 CSS와 JS를 추가해 점차 확장하면 돼요.
3. GitHub Pages 활성화
저장소 Settings → Pages 메뉴로 들어가서 배포할 브랜치를 선택하세요. 보통 main 브랜치를 사용합니다. 저장 후 약 12분 이내에 사이트가 열리며, "Your site is published at" 메시지를 통해 주소를 확인할 수 있어요.
4. 커스텀 도메인 연결
이미 구매한 도메인이 있다면 CNAME 레코드를 추가해 GitHub Pages와 연결할 수 있어요. 전파 시간은 평균 530분 이내입니다. HTTPS 인증서는 자동으로 발급돼 별도 설정이 필요 없어요.
항목 | GitHub Pages | 일반 유료 호스팅 |
---|---|---|
비용 | 무료 | 월 5~20달러 |
보안 | SSL 자동 발급 | 별도 구매 필요 |
트래픽 | 월 100GB | 무제한~요금제별 제한 |
지원 범위 | 정적 페이지만 가능 | 정적 + 동적 페이지 |
깃허브 README.md 작성법 핵심 포인트
깃허브 README.md는 단순한 소개 문서가 아니라 프로젝트의 얼굴이에요.사용자가 저장소에 들어왔을 때 가장 먼저 보게 되는 공간이기 때문에,프로젝트 신뢰도와 완성도를 보여주는 중요한 요소
apt.sunrisefs.co.kr
실제 사용 후기
개발자 포트폴리오 제작기
저는 프론트엔드 포트폴리오를 GitHub Pages로 만들었어요. React 앱을 빌드한 결과물만 올렸는데도 정상적으로 작동했어요. 덕분에 면접관에게 링크만 전달하면 즉시 제 프로젝트를 확인할 수 있었죠. 실제로 한 스타트업 면접에서 "사이트를 깔끔하게 배포했다"는 긍정적인 피드백도 받았어요.
팀 프로젝트 문서화
팀 프로젝트에서는 GitHub Wiki보다 GitHub Pages를 선호했어요. 마크다운으로 작성한 문서를 Jekyll 테마로 변환하니, 검색 기능과 사이드바가 생겨 훨씬 보기가 편하더라고요. 덕분에 신입 팀원들도 쉽게 온보딩할 수 있었습니다.
비개발자의 블로그 도전
개발자가 아닌 친구는 Hugo 테마를 적용해 블로그를 만들었어요. 처음엔 명령어가 어렵다고 했지만, 30분 만에 첫 게시글을 배포했답니다. "내 블로그가 무료라니!" 하며 굉장히 만족해했죠.
GitHub Pages 활용 팁
- Jekyll, Hugo, Gatsby 같은 정적 사이트 생성기 활용
- shields.io 배지로 빌드 상태 표시
- Google Analytics 연결해 방문자 추적
- 커스텀 도메인 + HTTPS로 전문성 강화
Visual Studio Code 단축키 모음 정리
개발자라면 하루 종일 쓰는 Visual Studio Code 단축키, 제대로 알고 쓰면 생산성이 2배는 올라갑니다. VS Code는 전 세계에서 가장 많이 쓰이는 코드 에디터 중 하나로,2024년 기준 개발자 설문에서 74%가
apt.sunrisefs.co.kr
FAQ
Q. GitHub Pages는 무료인가요?
네, 완전히 무료예요. 다만 저장소 용량은 1GB, 트래픽은 월 100GB로 제한됩니다.
Q. 동적 웹사이트도 만들 수 있나요?
서버 실행은 불가능해요. 대신 외부 API와 연동하면 간단한 동적 기능은 구현할 수 있습니다.
Q. 커스텀 도메인 연결이 가능한가요?
네, 가능합니다. DNS CNAME 레코드만 추가하면 530분 내외로 적용돼요.
Q. SSL 인증서는 어떻게 받나요?
GitHub Pages에서 자동 발급해줘요. 따로 신청하거나 비용을 낼 필요가 없어요.
Q. 배포는 얼마나 걸리나요?
커밋 후 평균 12분 이내에 사이트가 업데이트됩니다. 자동 반영돼서 번거로움이 없어요.
'정보' 카테고리의 다른 글
깃허브 커밋 푸시까지 기초 사용법 (0) | 2025.09.03 |
---|---|
Visual Studio Code 테마 추천 5가지 (0) | 2025.09.03 |
깃허브 README.md 작성법 핵심 포인트 (0) | 2025.09.02 |
Visual Studio Code 단축키 모음 정리 (0) | 2025.09.02 |
깃허브 초보자용 브랜치 만들기 실습 가이드 (0) | 2025.09.02 |
댓글