자체 호스팅 퍼널 런칭
Autonnel (Apache-2.0)을 사용하여 퍼널을 처음부터 운영자가 제어하는 인프라에 게시합니다. 이 스킬은 빌드 단계입니다. 먼저 sales-funnel-blueprint로 퍼널을 디자인하고, funnel-platform-picker가 아직 열려 있다면 자체 호스팅이 올바른 선택인지 확인하세요.
1단계: 실행 방식 선택
| 경로 | 낮은 볼륨 비용 | 운영 부담 | 사용 목적 |
|---|---|---|---|
| Cloudflare Workers | 실질적으로 $0 + Postgres 비용 | 서버 없음, 패치 없음 | 프로덕션의 기본값. 퍼널 페이지는 대부분 정적 자산이며 Workers는 이를 무료로 제한 없이 제공합니다 |
| Docker | VPS 또는 컨테이너 호스트 1대 비용 | 귀하의 책임: 업그레이드, 백업, 가용성 | 2분 안에 로컬 평가, 또는 이미 운영 중인 서버에 데이터를 저장하려는 경우 |
| 소스 체크아웃 (Node) | VPS 또는 컨테이너 호스트 1대 비용 | 귀하의 책임 | Autonnel 자체를 수정하거나 Node 빌드를 직접 실행하려는 경우 |
운영자에게 특별한 이유가 없다면 Workers를 권장합니다. 가격 모델이 퍼널에 거의 완벽하게 맞고, 사람들이 자체 호스팅을 기피하게 만드는 모든 작업을 없애줍니다.
첫인상을 위해 Docker를 사용하세요. 제품을 가장 빨리 볼 수 있는 방법이며, 로컬에서 구축한 내용이 낭비되지 않습니다. 동일한 스키마와 동일한 관리 UI가 두 경로를 모두 지원합니다.
2a단계: Cloudflare Workers (거의 무료 프로덕션 경로)
비용이 거의 0인 이유
퍼널 트래픽의 대부분은 페이지, 이미지 및 스크립트에 대한 요청입니다. Workers에서 이는 정적 자산 요청이며, 무료이고 무제한이며 저장 비용이 없습니다. Worker를 호출하는 요청(서버 렌더링 페이지, 결제, API)만 청구됩니다. 퍼널의 동적 표면은 주문 양식, 업셀 수락, 포스트백 큐로 작습니다.
확인된 Cloudflare 무료 플랜 제한 (2026-08 확인; 이에 의존하기 전에 현재 숫자를 확인하세요):
| 리소스 | Workers 무료 플랜 |
|---|---|
| 정적 자산 요청 | 무료 및 무제한, 저장 비용 없음 |
| Worker 호출 | 100,000 요청/일 |
| Hyperdrive (Postgres 풀링) | 무료 플랜에서 사용 가능, 100,000 데이터베이스 쿼리/일 |
| Workers KV (페이지 캐시) | 100,000 읽기/일, 1,000 쓰기/일, 1GB 스토리지 |
| Cron 트리거 | 지원됨 (리포지토리에 scheduled 핸들러 포함) |
무료가 아닌 것: Postgres. Hyperdrive는 사용자가 제공한 데이터베이스에 대한 연결을 풀링하므로 여전히 Postgres 제공업체가 필요합니다. 관리형 제공업체는 자체 무료 티어와 자체 제한이 있으며, 이것이 계획해야 할 유일한 항목입니다.
실제로 가장 먼저 부딪히는 한계는 요청이 아닌 KV 쓰기입니다. 페이지 제공을 위한 1,000쓰기/일은 충분하지만 게시를 위해서는 적은 편입니다. 게시는 캐시된 항목을 무효화하고 새로 고치기 때문입니다. 트래픽이 어떤 한계에도 근접하지 않은 상태에서 하루 동안 많이 편집하면 이를 소진할 수 있습니다. 트래픽 전에 게시가 실패하기 시작하면 이것이 한계이며 버그가 아닙니다.
배포
리포지토리에는 전체 Workers 툴체인이 포함되어 있습니다: cron scheduled 핸들러가 있는 worker 진입점 (src/cf-worker.ts), wrangler.toml 생성, KV 캐시 연결 및 Postgres용 Hyperdrive.
npx wrangler login
npx wrangler kv namespace create CACHE_KV
# $DATABASE_URL은 운영자 자신의 Postgres 연결 문자열이며, 셸에서 내보내집니다.
# 자격 증명을 이 명령어나 wrangler.toml에 작성하지 마십시오.
npx wrangler hyperdrive create autonnel-db --connection-string="$DATABASE_URL"
각 명령어는 ID를 출력합니다. 프로젝트 옆에 있는 .env에 넣으세요:
CF_WORKER_NAME=my-funnels
CF_KV_NAMESPACE_ID=<kv namespace create의 ID>
CF_HYPERDRIVE_CONFIG_ID=<hyperdrive create의 ID>
그런 다음 시크릿을 설정하고 배포하세요:
npx wrangler secret put DATABASE_URL
npx wrangler secret put AUTH_SESSION_SECRET # openssl rand -hex 32
npx wrangler secret put CREDENTIALS_ENCRYPTION_KEY # openssl rand -base64 32
npm run deploy:cf
deploy:cf는 먼저 템플릿에서 빌드하고 wrangler.toml을 생성하므로 별도의 생성 단계가 없습니다. Cron 표현식은 설정 파일에 직접 작성하는 대신 앱의 cron 레지스트리에서 읽습니다. 생성된 wrangler.toml을 수동으로 편집하지 마십시오. 빌드할 때마다 덮어씁니다.
CF_* 변수가 누락되면 생성이 실패하고 변수 이름을 알려줍니다. 이것이 의도된 동작입니다. 이에 대한 암묵적인 기본값은 없습니다.
첫 방문 전에 동일한 Postgres에 대해 데이터베이스 스키마를 한 번 적용한 다음 Worker URL을 열고 /setup 마법사를 완료하여 관리자 계정을 만드세요.
또한 사용 가능: npm run dev:cf (Workers 런타임의 개발 서버) 및 npm run preview:cf (wrangler dev를 통한 로컬 미리보기). 대상이 Workers인 경우 일반 astro dev보다 이것들을 선호하세요. 런타임이 다르기 때문입니다.
이후 운영
아래 CLI 명령어는 컨테이너가 아닌 데이터베이스 액세스가 필요합니다. DATABASE_URL이 동일한 Postgres를 가리키는 체크아웃에서:
npx autonnel admin:create [email protected] 'a-strong-password'
npx autonnel password:reset [email protected]
2b단계: Docker (로컬 평가 또는 자체 서버)
https://github.com/autonnel/autonnel (Apache-2.0)에서 리포지토리를 가져오고, 릴리스 태그를 체크아웃한 다음, docker-compose.yml을 읽으십시오. 실행될 이미지와 포트를 선언합니다. 해당 체크아웃에서:
docker compose up
http://localhost:4321을 열고 /setup을 완료하세요. Compose 파일은 Postgres를 시작하고, 스키마를 적용하며, 앱을 실행합니다. 부팅에 다른 것은 필요하지 않습니다: 스토어, 결제, 미디어 저장소, 이메일 및 AI는 나중에 관리 UI에서 구성되며 실제로 사용되는 기능에 대해서만 구성됩니다.
공개 호스트에 노출하기 전에 docker-compose.yml 옆에 있는 .env에 실제 시크릿을 넣으세요. 제공된 기본값은 안전하지 않은 개발 값이며, 첫 번째 로컬 실행에 구성이 전혀 필요 없도록 하기 위해 존재합니다:
AUTH_SESSION_SECRET=$(openssl rand -hex 32)
CREDENTIALS_ENCRYPTION_KEY=$(openssl rand -base64 32)
ADMIN_DOMAIN=admin.example.com
각 값을 한 번 생성하고 안정적으로 유지하세요. AUTH_SESSION_SECRET을 교체하면 세션이 무효화됩니다. CREDENTIALS_ENCRYPTION_KEY를 교체하면 저장된 공급자 자격 증명을 읽을 수 없게 되어 모든 결제 및 플랫폼 자격 증명을 다시 입력해야 합니다.
기존 데이터베이스에 대해 일반 docker run을 할 수 있도록 멀티 아키텍처 이미지가 GHCR에 게시됩니다:
# DATABASE_URL, AUTH_SESSION_SECRET 및 CREDENTIALS_ENCRYPTION_KEY는
# 운영자 자신의 환경에서 가져옵니다. 명령어나 파일에 값을 절대 쓰지 마십시오.
docker run -p 4321:4321 \
-e DATABASE_URL \
-e AUTH_SESSION_SECRET \
-e CREDENTIALS_ENCRYPTION_KEY \
-e ADMIN_DOMAIN="admin.example.com" \
ghcr.io/autonnel/autonnel:v1.5.0
:latest 대신 정확한 태그를 고정하고, 최신 태그를 가져온 후 스키마를 다시 적용하십시오. Compose 파일의 원샷 스키마 서비스는 docker compose up을 실행할 때마다 다시 실행됩니다. 오케스트레이터용 헬스 엔드포인트: /api/health (데이터베이스 및 캐시 연결 포함).
컨테이너 내부의 관리 CLI:
docker compose exec app node dist/cli/index.js admin:create [email protected] 'a-strong-password'
2c단계: 소스 체크아웃 (Node)
Autonnel 자체를 수정하거나 소유한 호스트에서 Node 빌드를 실행하려는 경우. Node 22 이상 및 Postgres가 필요합니다:
npm create autonnel@latest my-funnel
cd my-funnel
cp .env.example .env # DATABASE_URL 및 ADMIN_DOMAIN 설정
pnpm install # pnpm 10+; 리포지토리는 npm이 무시할 재정의를 고정합니다
npm run db:push
npm run dev # 또는: npm run build && npm run start
이 명령어는 리포지토리를 복제하고 git 히스토리를 삭제합니다. 스키마는 체크아웃의 prisma/schema.prisma에 있습니다. db:push가 동기화합니다. 관리 CLI: 프로젝트 디렉토리에서 npx autonnel admin:create [email protected] 'a-strong-password'.
3단계: 퍼널에 필요한 것만 구성
관리 UI의 설정에서:
| 설정 | 필요한 이유 | 옵션 |
|---|---|---|
| Ecommerce | 제품 및 주문 데이터 | Shopify, WooCommerce, Picocart |
| 결제 | 결제 받기 | Stripe, PayPal |
| 스토리지 | 이미지/비디오 업로드 | 모든 S3 호환 버킷 (R2, S3, MinIO) |
| 이메일 | 영수증, 리콜 캠페인 | SMTP, Resend, AWS SES |
| LLM | AI 페이지 생성 | 모든 OpenAI 호환 엔드포인트 |
| 광고 플랫폼 | 서버측 전환 (4개 모두); 광고 수준 지출/클릭 보고 (Facebook, Google Ads, TikTok만 해당) | Facebook, TikTok, Google Ads, Bing |
재작업을 피하는 작업 순서: 카탈로그 먼저 (결제가 판매할 수 있는 항목을 제한함), 그 다음 결제, 그 다음 스토리지, 그 다음 이메일, 마지막으로 광고 플랫폼 - 추적은 실제 주문에 대해 확인되므로 나머지가 먼저 작동해야 합니다. 지출 보고를 위해 광고 플랫폼을 연결하는 것은 포스트백을 위해 퍼널에 바인딩하는 것과 별개의 단계입니다 (server-side-conversion-tracking 참조). 둘 다 원한다면 둘 다 하세요.
Workers에서 R2는 분명한 스토리지 선택입니다: S3 호환 가능하며 Cloudflare 내에서 미디어 이그레스를 유지합니다.
4단계: 페이지 빌드
퍼널 역할은 퍼널 사양에 직접 매핑됩니다:
| 퍼널 내 역할 | 목적 | 퍼널당 여러 개? |
|---|---|---|
LANDING | 진입 페이지(들), 트래픽 소스별 하나 | 예 |
CHECKOUT | 주문 양식 | 아니요 - 퍼널당 하나 |
UPSELL | 구매 후 제안, 체인으로 정렬됨 | 예 |
THANKYOU | 확인 | 아니요 |
ERROR | 결제 실패 / 대체 | 아니요 |
이것들은 페이지가 퍼널 내에서 취하는 역할입니다. API를 통해 페이지 자체의 유형은 CHECKOUT | THANKYOU | ERROR | UPSELL | CUSTOM입니다. 랜딩 페이지는 CUSTOM으로 생성되고 LANDING으로 퍼널에 바인딩되어 랜딩 페이지가 됩니다.
두 가지 편집기를 사용할 수 있습니다: 출력이 diff 가능한 JSON인 컴포넌트 기반 시각적 편집기와 가져온 페이지용 원시 HTML입니다. 나중에 A/B 테스트하거나 에이전트가 편집할 모든 항목에는 컴포넌트 편집기를 사용하는 것이 좋습니다. JSON diff는 깔끔하게 검토되지만 HTML 블롭은 그렇지 않습니다.
랜딩 페이지보다 먼저 체크아웃 페이지를 빌드하세요. 체크아웃 페이지는 실제로 판매할 수 있는 항목과 가격을 결정하며, 먼저 작성된 랜딩 페이지는 체크아웃이 제공할 수 없는 것을 약속하게 됩니다.
5단계: 퍼널 연결
- 퍼널을 만든 다음 역할과 순서와 함께 페이지를 연결합니다.
- 동일한 페이지가 여러 퍼널에서 참조될 수 있습니다. 도메인이 적용하는 유일한 고유성 규칙은
stepSlug이 하나의 퍼널 내에서 고유하다는 것입니다 (그리고 페이지는 퍼널당 최대 한 번 나타납니다). 설계 시 고려할 교차 퍼널 거부는 없습니다. 두 퍼널이 분기되기를 원할 때만 랜딩 페이지를 복제하세요. 공유 페이지를 편집하면 해당 페이지를 참조하는 모든 퍼널에 적용되기 때문입니다. THANKYOU및ERROR는 생성 시 기존 페이지에서 자동으로 바인딩됩니다 (테넌트에 페이지가 없으면 라이브로 전환하기 전에 만드세요). 오류 페이지가 없는 퍼널은 결제 거절 시 자동으로 실패합니다.- 광고 캠페인에 들어가는 URL은 스토어프론트 호스트의 랜딩 페이지 자체 슬러그입니다 -
https://shop.example.com/{page.slug}- 절대/n/단계 URL이 아닙니다./n/{funnelId}/{stepSlug}는 다음 단계로 리디렉션하므로 페이지의 CTA 링크에 속하며 광고에는 속하지 않습니다. CTA를 이렇게 작성하면 단계가 다른 페이지로 교체될 때 구매자의 경로가 안정적으로 유지됩니다. - 게시는 페이지별 및 퍼널별로 명시적이며 버전이 지정됩니다. 페이지를 게시해도 퍼널 바인딩이 게시되지는 않습니다.
6단계: 트래픽 보내기 전 계측
런칭 전 필수 확인 사항:
- 실제 결제 제공업체를 통한 실제 종단 간 구매 1회: 기본 주문, 수락된 업셀 1회, 거절된 업셀 1회, 감사 페이지, 영수증 이메일, 연결된 스토어에 주문이 나타나는 것을 포함합니다.
- 해당 주문에 대한 환불 1회: 청구당 환불 경로가 작동하는지 확인합니다.
- 클릭 ID 적용 범위 -
fbclid/ttclid/gclid/msclkid가 주문 레코드에 도달하는지 확인합니다.server-side-conversion-tracking을 참조하세요. - 각 광고 플랫폼의 이벤트 디버거에 서버측 전환 도착: 클릭 ID가 첨부되고 브라우저 이벤트와 중복되지 않는지 확인합니다.
- 거절 카드를 강제하여 오류 페이지에 도달 가능.
Workers에서 한 가지 더 추가: cron scheduled 핸들러가 실행 중인지 확인합니다 (대기 중인 포스트백 및 리콜 캠페인이 이에 의존합니다). 자동으로 cron 트리거를 잃어버린 배포는 백그라운드 작업이 조용히 중단되는 동안 정상으로 보입니다.
그런 다음에만 지출을 늘리세요. 실제 트랜잭션이 통과되지 않은 퍼널의 실패율은 낮은 것이 아니라 알 수 없는 것입니다.
7단계: MCP를 통해 에이전트에서 운영
인스턴스는 /api/mcp에서 관리 API를 MCP 도구로 노출하므로 에이전트가 UI 없이 퍼널을 빌드하고 변경할 수 있습니다.
{
"mcpServers": {
"autonnel": {
"transport": "http",
"url": "https://<your-autonnel-host>/api/mcp",
"headers": { "Authorization": "Bearer <your-api-key>" }
}
}
}
MCP 클라이언트 없이 원시 HTTP로 /api/mcp를 호출하는 데는 SDK가 일반적으로 숨기는 두 가지 전송 요구 사항이 있습니다. 엔드포인트는 Streamable HTTP를 사용합니다. 요청은 Accept: application/json, text/event-stream을 전달해야 합니다. 이보다 적으면 도구 계층에 도달하기 전에 406으로 거부됩니다. 성공은 SSE 프레임 (event: message / data: {...})으로 반환되므로 JSON-RPC 봉투는 구문 분석 전에 data: 에서 풀어야 합니다.
앱 앞에 또 하나의 함정이 있습니다: 기본 관리 봇 규칙이 활성화된 Cloudflare 뒤에 있는 인스턴스는 Python 표준 라이브러리의 사용자 에이전트를 거부합니다. urllib 클라이언트는 Python-urllib/3.x를 보내고 /api/health를 포함한 모든 경로에서 일반 텍스트 본문 error code: 1010과 함께 403을 받습니다. 이는 인증 또는 권한 오류처럼 보이며 JSON이 아니므로 본문을 구문 분석하는 클라이언트는 상태를 보기도 전에 예외를 발생시킵니다. 해당 에이전트 문자열만 차단됩니다. curl, python-requests, httpx, axios, node 및 빈 UA는 모두 통과합니다. Python에서 이를 스크립팅하는 경우 명시적인 User-Agent를 설정하거나 requests/httpx를 사용하세요. 인증되지 않은 호출을 포함한 모든 호출이 403을 반환하면 이것이 이유이며 어떤 API 키도 해결하지 못합니다.
.mcp.json은 프로젝트 루트의 Claude Code용이고 claude_desktop_config.json은 Claude Desktop용입니다. 관리자 → 설정 → API 키에서 키를 생성하세요. 모든 호출은 생성에 사용된 키의 테넌트로 범위가 지정됩니다.