한 줄 요약: 코딩을 몰라도, AI에게 "대신 실행해줘"라는 프롬프트 몇 개만 던져서 GitHub 저장소 생성 → 코드 업로드 → Vercel 배포까지 끝냈다.
이런 분께 도움이 돼요: 코딩을 모르는데 내가 만든 사이트나 프로젝트를 진짜 인터넷 주소로 배포하고 싶은 분.
Before — 오늘 아침까지는
지금까지 만든 학습허브 사이트는 내 컴퓨터(로컬) 안에서만 열렸다. npm run dev로 켜야만 나만 볼 수 있는 상태였다. 이직 포트폴리오로 쓰려면 남들도 들어올 수 있는 진짜 웹 주소가 있어야 하는데, "GitHub 가입 → Vercel 가입 → 배포"라는 말만 들어도 막막했다. 명령어 한 줄 쳐본 적이 없어서.
어떻게 했나
1. 계정 먼저 준비
GitHub는 이메일·비밀번호·사용자명으로 직접 가입하고, Vercel은 "Continue with GitHub" 버튼으로 GitHub 계정 그대로 로그인하는 방법을 AI에게 안내받았다. (계정 생성·비밀번호 입력은 AI가 대신 눌러줄 수 없는 부분이라, 이 부분만 직접 진행했다.)
2. 필요한 도구 확인
배포에 Git, GitHub CLI(gh), Node.js, Vercel CLI 네 가지가 필요하다고 해서 확인을 부탁했다. 다행히 이미 다 설치되어 있어서 바로 넘어갔다. (없었다면 AI가 알아서 설치해줬을 것이다.)
3. GitHub에 사이트 통째로 올리기
아래 프롬프트를 그대로 썼다:
지금 이 폴더(GPters_Study, 내 학습허브 사이트)를 통째로 GitHub에 올려줘.Git으로 해줘. 나는 코딩을 몰라서 명령어를 직접 못 쳐, 네가 대신 실행해줘.
- GitHub에 새 저장소(repository)를 하나 만들어서, 이 폴더 내용을 전부 올려줘.
- 처음이라 GitHub 로그인/인증이 필요하면, 뭘 어디서 해야 하는지 알려줘.
- 다 올라가면 GitHub에서 내 사이트 주소(저장소 링크)를 알려줘.
AI가 git init → git add → git commit → gh repo create --public --source=. --remote=origin --push 순서로 실행해서 저장소 생성과 업로드를 한 번에 끝냈다.
4. Vercel로 배포
방금 GitHub에 올린 이 사이트를 Vercel로 배포해줘. Vercel CLI로 해줘.나는 코딩을 몰라서 명령어를 직접 못 쳐, 네가 대신 실행해줘.
- Vercel CLI가 없으면 "깔까요?"라고 되묻지 말고 바로 설치해줘.
- 처음이라 Vercel 로그인이 필요하면, 아까 만든 GitHub 계정으로 로그인하게 안내해줘.
- 방금 올린 그 GitHub 저장소를 배포하는 거야.
- 배포가 끝나면 내 사이트 URL(주소)을 알려줘.
막힘 → 해결
vercel --prod --yes를 실행했더니 이런 오류가 났다:
Error: Project names can be up to 100 characters long and must be lowercase.They can include letters, digits, and the following characters: '.', '_', '-'...
원인은 내 컴퓨터 폴더 경로("민철 포트폴리오")에 들어있는 한글과 띄어쓰기가 그대로 프로젝트 이름으로 쓰이려다 규칙에 걸린 것이었다. AI가 프로젝트 이름을 영문(gpters-study)으로 직접 지정해서 재시도하니 바로 해결됐다.
After — 결과
GitHub 저장소: github.com/raysmc517/gpters-study
배포된 사이트: gpters-study-fawn.vercel.app
로컬에서만 보이던 사이트가 이제 링크 하나로 누구에게나 보여줄 수 있게 됐다.
GitHub와 Vercel이 연결돼서, 앞으로 GitHub에 새 내용을 올릴 때마다 자동으로 다시 배포된다.
배운 것 / 재사용 자산
재사용 프롬프트: 위 3번·4번 프롬프트를 그대로 복사해서 쓰면, 코딩을 몰라도 "GitHub 업로드 → Vercel 배포"를 AI에게 그대로 시킬 수 있다.
알아둘 점: 로컬 폴더 이름에 한글·띄어쓰기가 있으면 배포 도구에서 이름 오류가 날 수 있다. 오류가 나면 "프로젝트 이름을 영문으로 지정해줘"라고 요청하면 된다.
꿀팁: "깔까요?"라고 되묻지 말고 바로 진행해달라고 미리 요청해두면, 도구 설치 확인 절차에서 왔다갔다하는 시간을 아낄 수 있다.
(Tip: 여기에 GitHub 저장소 화면 또는 배포된 사이트 화면 스크린샷을 넣으면 좋아요)
