요약
개발 경험이 전혀 없어도, 아루나님의 가이드 + Claude의 도움으로 15분 안에 개인 웹사이트를 인터넷에 공개할 수 있습니다. “되게 어려울 거 같은데?”라고 생각했던 게 실제로는 생각보다 훨씬 쉽습니다.
진행 방법
1단계: GitHub 가입 및 저장소 만들기
1️⃣ GitHub 가입
https://github.com 방문 → Sign up 클릭
이메일, 비밀번호, 사용자명 입력
이메일 인증 완료
2️⃣ 새 저장소(Repository) 만들기
GitHub 로그인 후 우측 상단 + → New repository 클릭
저장소 이름 입력 (예:
gpters_study)Private 선택 (공개하고 싶지 않다면) 또는 Public 선택
Create repository 클릭
화면에 나타날 HTTPS 주소를 복사해두세요. 나중에 필요합니다.
예: https://github.com/당신아이디/gpters_study.git
복사2단계: Git과 GitHub CLI 설치
Windows 사용자 기준:
✅ Git 확인
Windows PowerShell 열기 (Windows 키 + “powershell” 검색)
이 명령어 실행:
git --version
복사버전이 나오면 이미 설치됨. ✓
❌ GitHub CLI 설치 (Git은 있지만 gh는 없을 가능성)
PowerShell에서 이 명령어 실행:
winget install GitHub.cli
복사약관 동의 메시지 나오면 Y 입력 후 Enter
설치 완료 후 PowerShell을 새로 열어야
gh명령어가 작동합니다. (중요!)
⚠️ 주의: 설치 후 같은 PowerShell 창에서
gh를 바로 실행하면 “명령어를 찾을 수 없다”고 뜹니다. PowerShell을 종료했다가 다시 열어야 합니다.
3단계: 로컬 폴더를 GitHub에 올리기
1️⃣ 폴더 이동
PowerShell에서 당신의 프로젝 트 폴더로 이동:
cd C:\Users\당신아이디\Documents\GitHub\project3
복사2️⃣ Git 설정
폴더에서 이 명령어들을 순서대로 실행:
git remote set-url origin https://github.com/당신아이디/gpters_study.git
복사(위의 URL을 당신의 GitHub 저장소 URL로 바꿔주세요)
3️⃣ 모든 파일 추가 및 커밋
git add .
git commit -m "Initial commit: Upload learning hub site"
복사4️⃣ GitHub에 업로드 (Push)
git push -u origin master
복사끝! 🎉 GitHub에 파일이 올라갔습니다.
4단계: Vercel에 배포하기
1️⃣ Vercel 가입
Sign Up → Continue with GitHub 클릭
GitHub 로그인
“Authorize Vercel” 클릭
Team name 입력 (예:
jayleeproject3)
2️⃣ 프로젝트 배포
Vercel 대시보드에서 Add New → Import Project 클릭
Continue with GitHub 클릭
GitHub 저장소 목록에서
gpters_study선택설정은 그대로 두고 Deploy 클릭
1-2분 기다리면… “Congratulations!” 🎉
3️⃣ 당신의 웹사이트 주소 확인
배포 완료 후 대시보드에서 Continue to Dashboard 클릭
당신의 웹사이트 URL 확인 (예:
gpters-study.vercel.app)
배운 점
1️⃣ 생각보다 훨씬 쉬웠다
남들이 “개인 URL로 사이트 공유한다”고 하는 걸 보면서 “되게 어려운 거 아닌가?” 하고 생각했는데, 실제로 해보니:
GitHub 가입: 3분
파일 업로드: 3분
Vercel 배포: 2분
총 15분
“이게 다야?” 하는 느낌.
2️⃣ 가이드와 AI의 조합이 최고
아루나님의 가이드: 전체 흐름을 알 수 있어서 헷갈리지 않음
Claude의 도움: 가이드에 없는 부분(PowerShell 재시작, 대역폭 개념 등)을 빠르게 해결
처음이라면 둘 중 하나만 있었어도 막혔을 부분이 많았을 텐데, 조합이 완벽했다.
3️⃣ 막혔던 부분과 해결법
문제: GitHub CLI 설치 후 gh 명령어가 안 먹힘
gh: command not found
복사원인: 설치 후 같은 PowerShell 창에서 바로 실행하려고 함
해결: PowerShell을 종료하고 새로 열어서 다시 시도 → 성공!
4️⃣ Vercel 무료 배포의 모든 것
Vercel 무료 요금제로 충분한 이유:
대역폭: 월 100GB 무료
대역폭 = 방문자들이 사이트에서 다운로드하는 데이터양
개인 학습 사이트는 보통 월 1-10GB만 사용
100GB는 수십만 명이 매일 방문해야 넘음 → 개인 사이트로는 걱정 불필요 ✓
빌드 시간: 시간당 45분 무료 → 개인 사이트로는 충분
배포: 무료 & 자동 (GitHub push하면 자동 배포)
5️⃣ GitHub-Vercel 자동 연동의 원리
이제부터의 작업 흐름:
로컬 폴더에서 파일 수정
↓
git add . → git commit → git push
↓
GitHub에 업로드됨
↓
Vercel이 자동 감지 & 빌드 & 배포
↓
당신의 웹사이트 URL이 자동으로 업데이트됨 ✓
복사매번 Vercel 대시보드에 들어갈 필요 없음. GitHub push만 하면 끝!
적용할 점
1️⃣ 앞으로의 사이트 관리
이제 project3 폴더에서:
콘텐츠 추가 (마크다운 파일 작성)
디자인 수정 (CSS 수정)
기능 추가 (코드 수정)
모두 git push 한 번이면 인터넷 사이트에 자동 반영됨.
2️⃣ 다음 학습
GitHub와 Vercel의 관계 이해: 나머 지 “배포” 개념이 쉬워질 기초
앞으로 사이트를 운영하며 자연스럽게 Git 명령어 숙달
3️⃣ 공유할 때
“내 웹사이트: [당신의 URL]“이라고 바로 공유 가능!
