Vercel Drop — 브라우저에 끌어다 놓기만

Git · CLI · 설치 전부 없이 vercel.com/drop에 파일 · 폴더 · .zip 드래그
프로토타입 · 정적 사이트 · 일회성 배포에 최적

① 배포 순서 — 클릭 4번

• 정적 사이트 = 빌드 없이 그대로 게시
• 프레임워크 프로젝트 = Vercel이 자동 감지 · 빌드

② index.html 없을 때

최상위에 index.html 없으면 첫 화면 페이지를 물음 → Root (/) 메뉴에서 선택
또는 No root page 선택 시 루트(/)는 404, 각 파일은 자기 경로로 접속

③ 배포 방법 비교

방법	Git	CLI	적합
Vercel Drop	✗	✗	일회성 · 정적 · 프로토타입
Git 연동	✓	✗	push마다 자동 배포
CLI	✗	✓	로컬 · CI · 스크립트

⚠️ 한계: 드롭마다 새 프로젝트 생성 (기존 프로젝트 재배포 불가)
• Git 미연결 → push해도 자동 배포 안 됨 (나중에 Git 연결 가능 → 다음 노드)
• 큰 폴더는 브라우저 업로드라 느림

④ 이미 Drop으로 올린 사이트 업데이트하기

⚠️ Vercel Drop엔 기존 프로젝트에 새 파일 드롭하는 기능 없음 (Netlify와 다름) — 드래그앤드롭은 매번 새 프로젝트. 기존 사이트를 같은 URL로 갱신하려면 아래 셋 중 하나.

방법	같은 URL 유지	비고
또 드롭	✗	새 프로젝트·새 URL
CLI vercel --prod	✓	가장 빠름 (노드 02)
Git 연결	✓	push 자동배포 (노드 03)

⑤ Drop 프로젝트에 GitHub 나중에 연결

Drop으로 만든 프로젝트도 나중에 Git 연결 가능 → 그때부터 push 자동배포

⑥ Production 브랜치 바꾸기

연결한 브랜치와 production 브랜치가 다르면 배포 안 됨 (기본값 main). 내 작업 브랜치가 따로면 변경 필수.

💡 또는 작업 브랜치를 main에 머지해서 push (설정 안 건드림)

⑦ 대시보드에서 수동 재배포

코드 변경 없이 다시 빌드만: Deployments 탭 → 최신 배포 ⋯ → Redeploy. ⚠️ 코드 수정분 반영하려면 먼저 push 필요 (Redeploy는 그 커밋 그대로 재빌드)

CLI 배포 — 터미널 명령으로 한 방에

배포 = 내 코드를 인터넷 서버에 올려 누구나 접속하는 URL 받기
가장 빠른 길 = Vercel CLI, 터미널 4줄이면 끝

① 어디서 실행? — 프로젝트 폴더 안에서

• vercel은 실행한 현재 디렉토리를 배포 대상으로 잡음 → 폴더 밖에서 실행하면 엉뚱한 폴더 올라감
• 첫 실행 ? Code directory? → ./의 ./ = "현재 폴더" → 현재 위치가 프로젝트 루트여야 함

② 설치 · 로그인 · 배포

⚠️ 배포하려는 프로젝트 폴더 안에서 실행할 것 (cd my-app 후 package.json 있는 위치) — 아래 명령은 현재 폴더를 배포함

• vercel = preview (매번 새 임시 URL, 실서비스 영향 없음)
• vercel --prod = production (실서비스 도메인 갱신)
• 첫 배포는 production이 없어 자동 승격
• 오타 주의 — --pord(X) / --prod(O)

③ vercel 첫 실행 시 묻는 것

GitHub 연동 — push만 하면 자동 배포

GitHub 저장소를 Vercel에 연결하면 git push 할 때마다 자동 재배포
실무 표준 — 코드만 올리면 배포는 자동

① GitHub에 올리기

② Vercel 웹에서 GitHub 레포 연동 (권장)

노드 02에서 CLI로 만든 프로젝트에 Git을 붙이는 방법. 클릭만으로 끝 — CLI 인증 안 꼬임.

💡 신규 프로젝트면 vercel.com/new → Import Git Repository → 레포 선택 → Deploy 한 번에도 가능.

③ CLI로 연결 (선택 · 파워유저)

• .vercel/ 폴더는 연결 정보 → git에 올리지 말 것
• .gitignore에 node_modules · dist · .vercel 포함 확인
• 모노레포면 Settings → Root Directory로 배포할 하위 폴더 지정

Claude 연동 — "푸시해줘" 한마디로 배포

노드 03에서 GitHub ↔ Vercel 이미 연결됨 → 이제 Claude에게 코드 작업 후
"깃허브에 푸시해줘" 하면 자동으로 Vercel에 반영됨. 터미널·CLI 직접 안 만짐.

① 흐름

① Claude에게 코드 수정 요청
② "깃허브 푸시해줘" 한마디
③ Claude가 git add · commit · push 실행
④ Vercel이 push 감지 → 자동 재배포
⑤ 잠시 뒤 실서비스 URL에 반영

② 예시 대화

💡 핵심: 배포 명령을 따로 안 함. GitHub 연동(노드 03) 덕에 push = 배포. Claude는 push까지만 하면 끝.
⚠️ 커밋 author 이메일이 Vercel 계정과 맞아야 배포됨 — 안 되면 git config user.email 확인.