GitHub Pages란 무엇인가?

웹호스팅이 뭔지부터 이야기해볼까요? 여러분이 웹사이트를 만들었는데, 그걸 인터넷에 올려서 누구나 볼 수 있게 하려면 서버가 필요하잖아요. 그런데 직접 컴퓨터를 서버로 쓰는 건 nightmare예요. 항상 켜놔야 하고, 인터넷 연결도 안정적일 테니, 전기세부터 보안까지 골치 아픈데요. 그래서 호스팅 회사들이 등장한 거예요. 이들은 인터넷에 연결된 컴퓨터(호스트)를 빌려주고, 웹 서버 소프트웨어까지 설치해 주는 서비스를 제공해요. 요즘은 클라우드 호스팅이라고 불리지만, 기본적으로 같은 개념이랍니다.

GitHub Pages는 이런 웹호스팅의 한 종류인데, GitHub라는 개발자 플랫폼에서 무료로 쓸 수 있는 거예요. GitHub는 원래 소스코드 저장과 협업을 위한 사이트잖아요. 개발자들이 코드를 백업하고, 팀원과 공유하는 데 최적화됐어요. 그런데 이 플랫폼에 웹호스팅 기능이 내장되어 있어서, 저장소에 HTML 파일을 올리기만 하면 자동으로 웹사이트가 배포되는 거예요. 제가 처음 알았을 때 '와, 이게 가능하다니!' 싶었어요. 실제로 GitHub는 2008년에 시작됐고, 지금은 전 세계 1억 명 이상의 개발자가 쓰는 거대한 생태계예요. Pages 기능은 2008년부터 있었지만, 2022년 업데이트로 더 빠르고 안정적으로 변했더라고요.

왜 GitHub Pages를 추천하냐면, 무료라는 점이 제일 크죠. 유료 호스팅처럼 월 5천 원~수만 원 안 들고, 도메인도 username.github.io처럼 기본 제공돼요. 예를 들어, 제 계정이 'myblog'라면 myblog.github.io로 사이트가 열리는 거예요. 비교해보면, Netlify나 Vercel 같은 다른 무료 호스팅도 있지만, GitHub Pages는 Git 버전 관리와 연동돼서 코드 변경 이력을 자동 추적해줘요. 이게 개발자 입장에서 엄청 편한데, 실수로 파일 망가뜨려도 이전 버전으로 롤백할 수 있거든요. 실제 테스트로 간단한 HTML 페이지(헬로 월드)를 올려봤어요. 로컬에서 브라우저로 열 때랑 똑같이 동작하더라고요, 다만 이제 전 세계 어디서나 접근 가능해졌어요.

하지만 완벽하진 않아요. 트래픽이 많아지면(하루 100GB 초과) 제한 걸릴 수 있고, 동적 콘텐츠(데이터베이스 연동)는 안 돼요. 정적 사이트(HTML/CSS/JS만)에 최적화된 거라, 블로그나 포트폴리오에 딱이에요. 배경 지식으로, 웹호스팅 유형을 비교해보면 공유 호스팅(저렴하지만 느림), VPS(비싸지만 자유로움), 클라우드(확장성 좋음) 등이 있어요. GitHub Pages는 클라우드 스타일의 정적 호스팅으로, AWS S3나 Google Cloud와 비슷하지만 훨씬 쉽죠. 초보자 팁: GitHub 계정이 없으면 먼저 github.com에서 회원가입하세요. 이메일 인증만 하면 돼요. 그리고 무료 플랜으로 충분하니, 유료 업그레이드 고민 말고 시작해보세요. 이 기능 알면 웹 개발이 훨씬 재미있어질 거예요, 직접 해보니 코드 올리는 게 백업처럼 느껴지더라고요.

단계별로 이해하려면, 호스팅의 기본 흐름을 알아야 해요. 1) 파일 준비: index.html 같은 파일 만듦. 2) 업로드: 호스팅 서버로 전송. 3) 배포: 서버가 파일을 읽어 브라우저에 보여줌. GitHub Pages는 이걸 자동화한 거예요. 예시로, 제 테스트 사이트는

안녕하세요!

GitHub 저장소 만들기와 파일 업로드

자, 이제 GitHub Pages의 기반이 되는 저장소를 만드는 법부터 해볼게요. 저장소(Repository)는 코드 보관함 같은 거예요. GitHub에 로그인하면 상단 + 버튼 클릭해서 'New repository' 선택하세요. 이름은 'my-first-website'처럼 자유롭게 지으세요. Public으로 설정하면 누구나 볼 수 있고, Private은 비공개예요. 우리처럼 초보자라면 Public으로 가는 게 좋죠, 왜냐면 Pages 기능이 Public 저장소에서만 무료로 활성화되거든요. 제가 직접 해봤는데, 이름 지을 때 하이픈(-) 쓰면 URL이 깔끔해져요.

생성 후, 저장소 페이지에 'uploading an existing file' 링크가 보일 거예요. 클릭하면 파일 업로드 화면이 나와요. 방법은 두 가지예요. 첫째, 'choose your files' 버튼으로 로컬 파일 선택. HTML, CSS, 이미지 등을 골라보세요. 둘째, 파일 탐색기(Windows 탐색기나 Mac Finder)에서 드래그 앤 드롭. 이게 더 빠르죠. 업로드 끝나면 'Commit changes' 버튼 누르세요. 여기서 변경 사항 설명 적는 게 좋아요, 예를 들어 "첫 번째 HTML 파일 추가"라고요. 이 커밋이 버전 기록이 돼서 나중에 유용해요. 실제로 제 경우, index.html 파일(내용:

GitHub Pages 테스트

이게 동작하나요?

왜 이 과정이 중요한지 설명할게요. GitHub는 Git이라는 버전 관리 시스템을 쓰잖아요. 업로드할 때마다 '커밋'이 쌓여서, 코드 히스토리를 볼 수 있어요. 비교해보면, 그냥 파일 공유 사이트(Google Drive)랑 달리, GitHub는 브랜치(분기)나 풀 리퀘스트(변경 제안) 같은 협업 도구가 있어요. 초보 팁: 파일 이름은 index.html로 하세요. 이게 기본 페이지라서 저장소 루트에 있으면 자동으로 메인으로 로드돼요. 만약 여러 파일 있으면, 폴더 구조를 미리 생각하세요. 예: css/ 폴더에 스타일시트 넣기. 제가 테스트할 때, 이미지 파일(jpg 100KB)을 드래그했더니 5초 만에 업로드됐어요. 에러 나면 파일 크기 확인하세요, GitHub는 100MB 제한이에요.

배경 지식 추가로, GitHub 저장소는 클라우드 저장소예요. 로컬 Git 설치 없이 웹 인터페이스만으로도 충분하죠. 하지만 고급 유저라면 Git CLI(명령어)로 푸시하는 게 더 나아요. 단계별 가이드: 1) GitHub 로그인. 2) + > New repository. 3) 이름 입력, Public 체크, Create repository. 4) 업로드 섹션으로 이동. 5) 파일 드래그, Commit. 이걸 따라 하면 2분 컷이에요. 주의사항: 특수 문자 파일명 피하세요, 브라우저 호환성 문제 생길 수 있어요. 대안으로, VS Code 같은 에디터에 GitHub 확장 설치하면 로컬에서 바로 업로드돼요. 이게 편리하더라고요. 실제 예시로, 제 저장소에 포트폴리오 HTML 올렸을 때, 클릭하면 소스코드 미리보기까지 나와서 공유하기 좋았어요. 수치로, 무료 저장소 용량은 1GB, 파일당 100MB라 소규모 사이트에 딱 맞아요. 이 단계 마스터하면 웹호스팅의 50%는 끝난 거예요, 이제 Pages 활성화로 넘어가요. 직접 해보니 저장소 만드는 게 코드 백업처럼 느껴지더라고요!

GitHub Pages 활성화와 웹사이트 배포

드디어 GitHub Pages를 켜는 단계예요. 저장소 페이지에서 'Settings' 탭 클릭하세요. 왼쪽 사이드바에 'Pages' 메뉴가 있어요. 클릭하면 소스 브랜치 선택 부분이 나와요. 'Deploy from a branch' 아래 'None' 옆 main(또는 master) 브랜치 선택하고 '/ (root)' 폴더 지정하세요. Save 누르면 활성화돼요. 그런데 바로 안 돼요, 1-5분 기다려야 해요. 이게 신기한데, GitHub가 자동으로 빌드(파일 컴파일)하고 디플로이(배포)해주는 거예요.

진행 상황 확인은 'Actions' 탭에서 해요. 여기서 빌드 로그를 실시간으로 볼 수 있어요. 제 경우, index.html 업로드 후 Pages 켜니 'Build and deployment' 워크플로가 실행됐어요. 로그에 "Building site"부터 "Deploying"까지 나오고, 초록 체크 표시 뜨면 성공! URL은 Settings > Pages에 username.github.io/repo-name 형태로 나와요. 클릭하면 사이트가 열리죠. 제가 테스트한 사이트는 로컬 브라우저랑 똑같이 보였어요, 다만 이제 https://로 안전하게 접속돼요. 이 주소 공유하면 전 세계에서 볼 수 있어요, 진짜 마법 같아요.

업데이트 방법도 간단해요. 파일 수정 후 다시 업로드하고 Commit 하면 자동 빌드 돼요. 예를 들어, 제 HTML에

수정된 내용

이론적으로 정리하면, 세 요소: 당신의 컴퓨터(파일), 방문자(브라우저), 호스팅(GitHub 서버). 파일 업로드 → 서버가 index.html 읽음 → 브라우저에 전송 → 페이지 표시. 장점은 코딩만 하면 업체가 나머지 해줘요. 단점은 서버 원리 이해 부족, 그래서 나중에 직접 서버 수업 추천해요. 수치로, 배포 시간 1-10분, 무료라 비용 0원. 비교하면 유료 호스팅(Bluehost)은 동적 지원하지만 월 3천 원 들고 설정 복잡해요. GitHub Pages는 교육적+실용적이에요. 직접 해보니 업데이트가 자동이라 스트레스 없더라고요. 이제 여러분 차례예요, 사이트 띄우고 공유해보세요!