배포 / 클라우드
버셀(Vercel)
버셀은 웹 프로젝트를 빌드하고 배포해, 웹 주소로 접속할 수 있게 해 주는 플랫폼입니다.
쉬운 설명
AI로 만든 웹사이트를 다른 사람도 열어 보게 하려면, 내 컴퓨터 밖에서도 사이트가 실행되도록 배포해야 해요. 버셀(Vercel)은 이 작업을 도와주는 서비스예요. 프로젝트 코드를 가져와 배포에 필요한 파일을 만들고 접속할 주소를 제공해요. 수정안을 먼저 확인하는 미리보기 배포와 실제 이용자가 사용하는 운영 배포를 구분해서 관리할 수 있어요.
이런 상황에서 만나요
스터디 신청 페이지를 만들고 Git 저장소를 버셀에 연결했어요. 신청 버튼을 고친 뒤 “미리보기에서 먼저 확인하고 운영 사이트에 반영해 주세요”라는 안내를 받았어요. 배포 목록에서는 어떤 수정본인지와 어디에 배포됐는지를 함께 확인합니다.
수정안을 확인할 주소와 운영 주소를 구분해요
변경: 신청 버튼 문구 수정
preview.example.com상태: 배포 준비 완료
현재 운영 중인 버전
study.example.com미리보기 보호 설정: 접근 권한 필요
- 1Preview는 수정안을 먼저 확인하는 배포입니다. 검토할 변경 내용이 맞는지 함께 봅니다.
- 2Production은 실제 운영에 사용하는 배포입니다. 미리보기 배포가 생겼다고 이 버전도 바뀌지는 않습니다.
- 3검토할 사람이 주소를 열 수 있는지 확인합니다. 주소만 전달하면 항상 접속할 수 있는 것은 아닙니다.
미리보기 주소를 열어 신청 버튼과 제출 결과를 확인해 보세요. 스터디원에게 검토를 부탁할 때는 그 사람도 주소를 열 수 있는지 확인합니다. 수정본이 괜찮다면 프로젝트에서 정한 방식으로 운영 환경에 반영하고, 운영 주소에서도 같은 기능을 확인하세요.
헷갈리기 쉬운 점
배포가 완료되면 기존 사이트도 바로 바뀌나요?
미리보기인 Preview 배포는 수정안을 별도로 확인하는 용도입니다. 운영용 Production 배포와 구분해야 합니다. 어떤 브랜치의 변경을 운영에 반영하는지, 자동으로 운영 주소에 연결하는지는 프로젝트 설정에 따라 달라집니다.
주소가 만들어졌다고 누구나 열 수 있거나 모든 기능이 정상이라는 뜻은 아닙니다. 배포 보호 설정으로 접속이 제한될 수 있고, 화면은 열려도 로그인이나 저장이 실패할 수 있습니다. 환경변수는 필요한 환경에 맞는 값으로 설정하며, 테스트용과 운영용 비밀값을 무조건 똑같이 복사하지 않습니다.
왜 알아야 할까요?
미리보기와 운영 배포를 구분하면 아직 확인하지 않은 수정본을 이용자에게 노출하는 실수를 줄일 수 있습니다. “안 돼요” 대신 배포 환경, 실패한 기능, 오류 로그를 AI에게 알려 주면 문제를 찾을 범위도 좁아집니다.
조금 더 자세히
Git 저장소를 연결해 자동 배포를 설정하면, 코드 변경이 올라왔을 때 새 배포를 만들 수 있습니다. 저장소는 코드를 보관하는 곳이고, 버셀은 그 코드로 웹사이트를 실행할 배포를 만드는 곳입니다. 명령줄 도구로 배포하는 방법도 있으므로 GitHub 연결이 유일한 방법은 아닙니다.
빌드는 코드를 실행하거나 배포할 수 있는 형태로 준비하는 작업입니다. 빌드가 실패했다면 해당 배포의 로그에서 오류를 확인합니다. 배포 후 기능이 실패했다면 실행 중의 오류, 외부 서비스 연결, 환경변수도 확인해야 합니다.
배포 주소와 직접 연결한 도메인은 구분합니다. 배포마다 확인할 주소가 생길 수 있고, 운영 도메인은 이용자가 계속 방문할 주소로 사용합니다. 어떤 배포를 보고 있는지 헷갈리면 주소만 추측하지 말고 배포 환경과 연결된 코드 변경을 함께 확인합니다.
직접 사용할 때 확인해 보세요
- 검토할 수정본의 Preview 배포인지 확인한다
- 공유받는 사람의 접속 권한과 핵심 기능을 확인한다
- 운영 반영 뒤 Production 주소에서도 확인한다