GitHub Pages로 웹사이트 배포하기

GitHub Pages란?

GitHub 저장소의 파일을 웹사이트로 바로 공개할 수 있는 무료 서비스입니다.

무료: 공개 저장소라면 비용 없음
자동 배포: 파일을 커밋하면 몇 분 안에 반영
커스텀 도메인: 자신의 도메인 연결 가능

포트폴리오, 프로젝트 문서, 개인 블로그 등에 많이 씁니다.

개인 프로필 페이지 만들기

username.github.io 형식의 저장소를 만들면 https://username.github.io로 접근할 수 있는 개인 페이지가 됩니다.

새 저장소 만들기
- Repository name: 본인username.github.io (예: daleschool.github.io)
- Public 선택
- Add a README file 체크
Create repository 클릭

index.html 추가하기

저장소에 index.html 파일을 추가합니다.

Add file → Create new file
파일 이름: index.html
내용 작성:

<!DOCTYPE html>
<html lang="ko">
  <head>
    <meta charset="UTF-8" />
    <title>나의 GitHub 페이지</title>
    <style>
      body {
        font-family: sans-serif;
        max-width: 600px;
        margin: 50px auto;
        padding: 0 20px;
      }
    </style>
  </head>
  <body>
    <h1>안녕하세요! 👋</h1>
    <p>GitHub으로 만든 첫 번째 웹페이지입니다.</p>
    <ul>
      <li>이름: 홍길동</li>
      <li>관심사: 개발, 독서</li>
      <li>GitHub: <a href="https://github.com/본인username">@본인username</a></li>
    </ul>
  </body>
</html>

커밋 메시지: feat: 개인 페이지 추가
Commit new file 클릭

GitHub Pages 활성화하기

저장소 Settings → 왼쪽 메뉴 Pages 클릭:

Source: Deploy from a branch
Branch: main / / (root) 선택
Save 클릭

몇 분 후 https://본인username.github.io에서 웹사이트를 확인할 수 있습니다.

처음 배포는 1~3분 정도 걸립니다. Pages 설정 화면에서 배포 URL이 나타나면 완료입니다.

프로젝트 페이지 만들기

개인 페이지(username.github.io) 외에도, 기존 저장소를 웹페이지로 공개할 수 있습니다.

my-first-repo 저장소에 Pages를 설정하면:

URL: https://username.github.io/my-first-repo

저장소 Settings → Pages → Branch 설정하면 됩니다.

단, 이 경우 저장소에 index.html이 있어야 메인 페이지가 표시됩니다. 없으면 README.md가 기본으로 표시됩니다.

웹사이트 업데이트하기

파일을 수정하고 커밋하면 자동으로 배포됩니다.

index.html 파일 클릭 → 연필 아이콘
내용 수정 (예: 소개 문구 변경)
커밋 메시지: docs: 소개 문구 업데이트
커밋 후 1~2분 뒤 웹사이트 새로고침

저장소 Actions 탭에서 배포 진행 상황을 실시간으로 볼 수 있습니다.

"왜?" — 코드 없이 웹사이트를 가질 수 있다

개발자가 아니어도 GitHub Pages로 할 수 있는 것들:

포트폴리오: 프로젝트 목록, 이력서
프로젝트 문서: 사용 방법, API 문서
팀 위키: 온보딩 문서, 가이드
개인 블로그: Jekyll, Hugo 등 정적 사이트 생성기와 연동

GitHub Pages + Markdown으로 코딩 없이도 전문적인 웹사이트를 만들 수 있습니다.

심화 학습

커스텀 도메인 연결하기

username.github.io 대신 example.com 같은 자신의 도메인을 쓰고 싶다면:

도메인 구매 (가비아, 네임칩 등)
도메인 DNS 설정에서 GitHub Pages IP로 A 레코드 설정
저장소 Settings → Pages → Custom domain 입력
HTTPS 강제 적용 체크

상세한 설정은 도메인 제공업체와 GitHub Pages 공식 문서를 참고하세요.

Jekyll로 블로그 만들기

GitHub Pages는 Jekyll이라는 정적 사이트 생성기를 기본으로 지원합니다.

저장소에 마크다운 파일로 글을 작성하면 Jekyll이 자동으로 블로그 형식으로 변환합니다. 코딩 없이 블로그를 운영할 수 있습니다.

Settings → Pages → Theme Chooser로 미리 만들어진 테마를 선택할 수도 있습니다.

본인username.github.io 저장소를 만드세요.
index.html 파일을 추가해 간단한 자기소개 페이지를 만드세요.
GitHub Pages를 활성화하고 실제 URL에서 확인하세요.
내용을 수정하고 커밋한 뒤 웹사이트가 자동으로 업데이트되는 것을 확인하세요.

Q1. username.github.io 형식의 저장소를 만들면 어떤 URL로 접근할 수 있나요?

A) https://github.com/username
B) https://username.github.io
C) https://pages.github.com/username
D) https://github.io/username