Before
지금까지 사이트는 localhost:4321, 내 컴퓨터 안에서만 열렸다. 오늘 목표는 이걸 인터넷 주소로 띄워서 누구나 볼 수 있게 만드는 것.
어떻게 — 실제로 한 순서
1. 도구 설치
GitHub CLI가 없어서 먼저 설치했다.
winget install --id GitHub.cli -e
Git, Node.js는 이미 깔려 있어서 넘어갔다.
2. GitHub 로그인 — 코드 붙여넣는 인증
gh auth login을 실행하면 명령어 창이 조용해지면서 이런 게 뜬다.
! First copy your one-time code: 3F4C-9D8A
Open this URL to continue in your web browser: https://github.com/login/device
💡 여기서 “학습메이트가 조용하다” = “내가 브라우저로 넘어갈 차례”였다. github.com/login/device를 직접 열고, 코드를 입력하고, “Authorize” 버튼을 눌렀더니 터미널이 다시 움직였다.
3. 공개로 올릴지 결정
GitHub에 올리기 전에 “공개로 할지 비공개로 할지” 먼저 정했다. 공개로 하기로 했다.
4. 저장소 만들어서 업로드
git init
git branch -m main
git add -A
git commit -m "Initial commit: learning hub site setup (week 1)"
gh repo create home-cli --public --source=. --remote=origin --push
→ 결과: github.com/a01077492882-lab/home-cli
5. Vercel 배포
npm install -g vercel
vercel --prod --yes
이미 이 컴퓨터에서 Vercel에 로그인이 되어 있어서, 로그인 단계 없이 바로 빌드·배포가 진행됐다.
→ 결과: https://homecli.vercel.app
막힘 → 해결
- 학습일지가 공개돼 버릴 뻔함: 저장소를 공개로 올리기 직전에,
src/content/journal/(학습일지) 폴더도 같이 올라간다는 걸 짚어줘서 알았다. 사이트 화면엔 안 보이지만 GitHub 코드로는 누구나 볼 수 있는 거라,.gitignore에src/content/journal/을 추가해서 아예 안 올라가게 막았다. - 커밋 작성자 정보 에러: 커밋하려니 “Author identity unknown” 에러가 남. Git에 내 이름과 이메일을 설정한 적이 없어서였다. 실제 이메일 대신 GitHub이 제공하는 noreply 이메일(
아이디+숫자@users.noreply.github.com)로 이 저장소에만 설정해서 실제 이메일이 드러나지 않게 했다. git push가 응답 없이 멈춤:.gitignore를 한 번 더 수정하고 커밋한 뒤git push를 했는데 계속 멈춰 있었다.gh auth setup-git으로 Git이 GitHub CLI 로그인 정보를 쓰도록 연결해주니 바로 풀렸다.
After
localhost:4321에서만 보이던 사이트가 이제 https://homecli.vercel.app으로 인터넷 어디서든 열린다. 코드는 GitHub 저장소에 공개로 남아 있고, 개인적인 학습일지는 gitignore로 빠져 있다.
배운 것 / 재사용 자산
- 디바이스 코드 로그인 패턴: 터미널이 코드(예:
XXXX-XXXX)와 URL을 보여주면, 그 URL을 열고 코드를 입력 + Authorize 클릭 — 이 패턴은 GitHub 말고 다른 CLI 도구 로그인에서도 똑같이 나온다. - 공개 저장소에 뭘 올릴지는 미리 점검:
.gitignore로 “이건 진짜 비공개로 남길 것”을 커밋 전에 한 번 더 확인하는 습관이 생겼다. gh auth setup-git:git push가 인증 때문에 멈추는 것 같으면 이 명령어로 Git과 GitHub CLI 로그인을 연결해주면 된다.