🌐 레슨

Vercel 배포 — 전 세계 공개

① 오늘의 미션

이제 진짜 손님에게 공개

지금까지 '우리동네 반찬가게'는 내 PC(localhost)에서만 돌았어요. 오늘은 Vercel로 가게를 전 세계에 공개해, 진짜 주소를 가진 가게 사장님이 됩니다.

설명을 읽고 오른쪽 터미널에서 직접 쳐보며 한 줄로 가게가 세상에 열리는 순간을 경험해요.

설명을 따라 진행하면, 여기서 직접 쳐보게 돼요 👇

~/my-shop

$ _

📚 「Vercel 배포 — 전 세계 공개」 레슨 내용 전체 텍스트로 훑어보기

이제 진짜 손님에게 공개

설명을 읽고 오른쪽 터미널에서 직접 쳐보며 한 줄로 가게가 세상에 열리는 순간을 경험해요.

내 컴퓨터를 24시간 켜두는 게 답일까요?

맞아요. 그걸 배포(deploy)라고 해요. Vercel 같은 서비스가 내 PC 대신 24시간 켜진 가게 서버를 빌려줘서, 우리 가게를 전 세계에 열어주죠. 👇

우리동네 반찬가게의 두 상태를 눌러 비교해 보세요.

🏠 localhost: 주소가 localhost:3000. 나만 보이고, PC 끄면 가게가 사라져요.

🚀 Vercel 배포: my-shop.vercel.app 같은 진짜 공개 주소가 생겨요. 손님 누구나 접속 가능, 내 PC를 꺼도 가게가 열려있어요.

Vercel CLI로 가게를 공개해요. 먼저 로그인하고, 한 줄로 배포해요.

vercel login — Vercel에 로그인해요 (처음 한 번)

vercel deploy --prod — 우리 가게를 전 세계에 배포해요

한 줄로 진짜 공개 주소(my-shop.vercel.app)가 생겼어요! 친구에게 보내보세요.

이제 내 PC를 꺼도 가게가 살아있을까요? 다른 곳에서 curl -I https://my-shop.vercel.app 로 확인하면?

맞아요. 이제 가게는 Vercel 서버에서 돌아요. 내 PC를 꺼도 24시간 열려 있죠. 확인해볼까요? 👇

localhost가 아닌 진짜 공개 주소에 요청을 보내봐요. 손님이 인터넷으로 접속하는 것과 같아요.

curl -I https://my-shop.vercel.app — 공개된 가게가 응답하는지 확인해요

localhost(나만) → vercel.app(전 세계). 우리 가게가 드디어 세상에 나왔어요.

다음 코스에서 배울 GitHub와 관련이 있어요.

맞아요. 보통 GitHub에 가게 코드를 올리면(push) Vercel이 자동으로 새 버전을 공개해요. 상품을 추가해 push만 하면 몇 초 뒤 가게가 갱신되죠.

Vercel CLI로 가게를 공개할 때 쓰는 명령을 채워보세요.

맞아요. vercel deploy --prod예요. --prod는 '진짜 손님용(프로덕션) 주소로 공개'라는 뜻이에요.

가게는 계속 자라요. 신상품을 추가하고 다시 배포하면, 같은 주소로 갱신된 가게가 열려요.

들기름막국수 상품 카드를 첫 페이지에 추가해줘 — Claude로 신상품을 추가해요

vercel deploy --prod — 갱신된 가게를 다시 배포해요

고치고 → 다시 배포 → 같은 주소로 갱신. 손님은 늘 최신 가게를 봐요.

가게를 공개하고 갱신하는 순서를 맞춰보세요. (↑↓로 정렬)

정확해요! 로컬 완성 → 배포 → 공개 URL → 고쳐서 재배포. 이제 전 세계 손님이 우리 가게를 봐요.

한 줄로

배포는 내 PC 속 가게를 항상 켜진 공개 서버로 옮기는 일. Vercel이 한 줄로 그걸 대신 해줘요.

흐름 한눈에

localhost 완성 → vercel deploy → 공개 URL → (고치면) 재배포. GitHub과 연결하면 push만으로 자동 배포도 가능해요.

다음 레슨에서

그런데 주소가 아직 my-shop.vercel.app이죠. 마지막으로 내 이름의 진짜 주소(도메인)를 붙여 가게를 완성해요. 🌱