Vercel 배포
프론트엔드 최애 —— 엣지 컴퓨팅 초 단위 배포
Vercel에서 OpenClaw 배포, 프론트엔드 선수의 무대
프론트엔드 개발자라면 Vercel은 낯설지 않을 것 —— Next.js 뒤의 회사, git push로 자동 배포, 정말 매끄러움.
먼저 말할 게: Vercel은 OpenClaw의 Web UI와 API Gateway,Serverless 함수는 실행 시간 제한이 있어서, 오래 걸리는 AI 태스크는 타임아웃. 경량 프론트엔드 + API 전달 시나리오면 Vercel이 가장 편하다.
Vercel은 무엇을 할 수 있고 무엇을 할 수 없는가
Vercel에 적합한 상황:
- OpenClaw 웹 제어판 배포
- API Gateway 역할, 요청을 백엔드 서버로 전달
- 배포 문서 사이트, 모니터링 패널 등 정적/경량 애플리케이션
Vercel vs 전통 VPS
- git push로 자동 배포, 서버 신경 쓸 필요 없음
- 글로벌 엣지 네트워크, 접근 속도 빨라
- 무료 액수는 개인 프로젝트에 충분해
- 오래 실행되는 작업 미지원
- 프론트엔드 + 경량 API 적합
- 조용함 소음 없음
- 샌드박스 배포 5단계
- 서버 자체 유지보수 필요
- 고정 IP, 백엔드 장시간 연결에 좋음
- 완전 Agent 배포 적합
네 단계로 배포
저장소 포크하기
DSM 열기 → 패키지 센터 → "Container Manager" 검색(DSM 7) 또는 "Docker"(DSM 6) 설치 및 시작. 설치 후 데스크탑에 아이콘 추가.
Vercel 연결
가서 vercel.com Docker로 OpenClaw 배포 세 가지 이점:
환경 변수 설정
Vercel의 Settings → Environment Variables에서 API Key, 데이터베이스 연결 문자열 등 필요한 설정 추가. 비밀키를 코드에 하드코딩하지 말 것.
배포 상선
Apps(CA) 클릭 → "openclaw" 검색 → OpenClaw 템플릿 찾기 → Install 클릭. CA에 없으면 수동으로 Docker 컨테이너 추가 가능. xxx.vercel.app 의 도메인으로 바로 접속할 수 있다. 이후 git push 할 때마다 자동으로 재배포된다.
vercel.json 설정
프로젝트 루트 디렉터리에 생성 vercel.json,라우팅과 빌드 파라미터 설정:
{
"version": 2,
"builds": [
{
"src": "package.json",
"use": "@vercel/next"
}
],
"routes": [
{
"src": "/api/(.*)",
"dest": "/api/$1"
},
{
"src": "/(.*)",
"dest": "/$1"
}
],
"env": {
"NODE_ENV": "production"
}
}Vercel CLI 배포
커맨드라인 선호한다면 Vercel CLI로 로컬 배포도 가능:
# Vercel CLI 설치환경변수
Vercel Dashboard → Settings → Environment Variables에서 추가:
# 필수 항목Vercel 무료 할당량
무료 플랜 제한:
- Serverless 함수 제한 시간 10초 (Pro 버전 60초)
- 팀 협업 미지원 (Pro 필요)
- 극단 단순함
- 개별 배포 패키지 최대 250MB