홈페이지 서비스 기술 스택 안내

# 홈페이지 서비스 기술 스택 안내

Canonical URL: https://duolabs.co.kr/docs/%ED%99%88%ED%8E%98%EC%9D%B4%EC%A7%80-%EC%84%9C%EB%B9%84%EC%8A%A4-%EA%B8%B0%EC%88%A0-%EC%8A%A4%ED%83%9D-%EC%95%88%EB%82%B4
Author: Duolabs (https://duolabs.co.kr)
License: Creative Commons Attribution 4.0 International (https://creativecommons.org/licenses/by/4.0/)
Last modified: 2026-07-31T21:57:59.480Z
Tags: docs, public-doc, serverless, web-infrastructure, website

# 홈페이지 서비스 기술 스택 안내

## 개요

DUOLABS 홈페이지 서비스는 한 페이지 랜딩부터 콘텐츠 관리가 필요한 기업 홈페이지, 관리자 기능을 포함한 웹서비스까지 범위에 맞춰 구성합니다.

인프라는 개발 금액만으로 결정하지 않습니다. 실제로 필요한 데이터 저장, 콘텐츠 관리, 회원 기능, 비동기 처리 여부를 기준으로 필요한 서비스만 선택합니다. 개발 비용은 1회성이고 유지보수와 외부 인프라 사용료는 별도로 산정합니다.

## 규모별 예상 범위와 기본 구성

| 구분 | 개발 비용 예상 범위 | 적합한 프로젝트 | 기본 인프라 |
|---|---:|---|---|
| 작게 시작 | 150~370만원 | 랜딩 페이지, 소형 소개 홈페이지 | Cloudflare DNS + Vercel Pro + 필요 시 Resend |
| 표준 | 290~560만원 | 여러 페이지와 콘텐츠 관리가 필요한 기업 홈페이지 | 기본 구성 + Supabase Pro |
| 크게 | 450~700만원 | 관리자 화면과 서비스 기능을 포함한 복합 웹서비스 | 표준 구성 + 필요한 경우 Upstash Redis·QStash |

위 금액은 기본 범위의 예시입니다. 디자인 신규 제작, 다국어, 기존 시스템 연동, 관리자 대시보드 등 선택 사항에 따라 달라지며 요구사항을 확정한 후 고정 견적을 제공합니다.

쇼핑몰처럼 결제·주문·배송·재고 관리가 포함되는 서비스는 일반 홈페이지보다 업무 규칙과 운영 책임이 크므로 별도 범위로 산정합니다.

## 전체 구조

```text
사용자
↓
Cloudflare DNS
↓
Vercel
├─ Next.js 화면
├─ API 및 서버 함수
└─ Git 기반 자동 배포
↓
Supabase ── 데이터베이스·인증·파일

선택 서비스
├─ Resend ── 문의·알림 이메일
├─ Upstash Redis ── 요청 제한·캐시·중복 처리 방지
└─ QStash ── 비동기 작업 전달·실패 재시도
```

Cloudflare는 도메인의 DNS를 관리하고 Vercel은 애플리케이션 실행과 배포를 담당합니다. Vercel 자체에 CDN과 보안 기능이 있으므로 Cloudflare는 기본적으로 DNS only 구성을 권장합니다.

## 1. 랜딩 페이지와 소형 홈페이지

다음과 같은 프로젝트에 적합합니다.

- 한 페이지 또는 소수의 소개 페이지
- 회사·제품·행사 소개
- 검색 노출을 위한 기본 SEO
- 문의 폼과 이메일 알림
- 관리자가 직접 수정할 필요가 없는 콘텐츠

권장 구성은 다음과 같습니다.

- Next.js
- Vercel Pro
- Git 저장소와 Vercel Git 자동 배포
- Cloudflare DNS
- 문의 이메일이 필요할 때 Resend

콘텐츠와 이미지 변경을 코드 배포로 관리한다면 데이터베이스가 필요하지 않습니다. 문의 내용을 별도로 저장하지 않고 담당자에게 이메일로만 전달하는 경우에도 Supabase를 생략할 수 있습니다.

## 2. 콘텐츠 관리형 기업 홈페이지

고객이 직접 공지, 사례, 포트폴리오, 배너 또는 이미지를 수정해야 한다면 데이터 저장과 관리자 기능이 필요합니다.

이 경우 기본 구성에 Supabase를 추가합니다.

- PostgreSQL: 게시물·문의·설정 데이터 저장
- Supabase Auth: 관리자 로그인
- Supabase Storage: 이미지와 첨부 파일 저장
- Vercel Functions: 관리자 API와 공개 API 실행
- Resend: 문의 접수와 상태 알림 이메일

콘텐츠 변경을 DUOLABS가 유지보수 계약으로 대신 수행하고 코드로 배포한다면 Supabase 없이도 운영할 수 있습니다. 반대로 고객이 직접 수정해야 한다면 관리자 화면과 데이터베이스를 견적 범위에 포함합니다.

## 3. 관리자 기능을 포함한 복합 웹서비스

회원, 신청, 예약, 상태 관리, 외부 API 연동처럼 데이터가 계속 변경되는 서비스는 Vercel과 Supabase를 기본으로 사용합니다.

Redis와 QStash는 기능이 있을 때만 추가합니다.

- Upstash Redis: IP별 요청 제한, 짧은 캐시, 일회성 코드, 중복 실행 방지
- QStash: 이메일·웹훅·후처리 작업 전달, 예약 실행, 실패 시 재시도
- Vercel Functions: 사용자 API와 QStash가 호출하는 작업 처리 API 실행

단순 홈페이지에 Redis와 QStash를 미리 추가하면 비용보다 관리 지점이 먼저 늘어납니다. 실제 요구사항이 생긴 시점에 추가하는 것이 원칙입니다.

## 각 서비스의 역할

| 서비스 | 담당 역할 | 도입 시점 |
|---|---|---|
| Cloudflare DNS | 도메인과 DNS 레코드 관리 | 모든 홈페이지 |
| Vercel | 화면, API, CDN, 자동 배포 | 모든 홈페이지 |
| Supabase | 데이터베이스, 인증, 파일 저장 | 콘텐츠 관리나 데이터 저장이 필요할 때 |
| Resend | 문의·인증·상태 알림 이메일 발송 | 이메일 알림이 필요할 때 |
| Upstash Redis | 빠른 공유 상태, 캐시, 요청 제한 | 트래픽 제어와 중복 방지가 필요할 때 |
| QStash | 비동기 작업 전달과 재시도 | 즉시 끝낼 필요가 없는 후처리가 있을 때 |

## 운영 계정과 비용 원칙

고객 서비스의 도메인과 클라우드 계정은 고객 명의로 개설하는 것을 기본으로 합니다. DUOLABS는 필요한 권한을 위임받아 구축하고 운영합니다. 이렇게 하면 비용이 투명하고 계약 종료 후에도 서비스 이관이 쉽습니다.

상업용 고객 홈페이지는 Vercel Pro를 기본 운영 플랜으로 사용합니다. Supabase와 Upstash 등은 실제 기능과 사용량에 맞춰 선택하며, 외부 서비스의 구독료와 사용량 요금은 개발비 및 유지보수 작업비와 분리합니다.

무료 플랜은 시안, 개발, 기능 검증과 개인 프로젝트에는 유용하지만 고객의 업무에 사용하는 운영 환경에서는 일시 정지, 지원, 사용량 제한과 서비스 수준을 함께 검토해야 합니다.

## 선택 기준 요약

```text
소개와 문의만 필요
→ Vercel + Cloudflare DNS + Resend

고객이 콘텐츠를 직접 관리
→ 위 구성 + Supabase

회원·예약·신청·관리자 기능 필요
→ Vercel + Supabase

요청 제한이나 짧은 캐시 필요
→ Upstash Redis 추가

후처리 전달과 실패 재시도 필요
→ QStash 추가
```

## 참고

- [Vercel 요금제](https://vercel.com/pricing)
- [Vercel 이용약관](https://vercel.com/legal/terms)
- [Supabase 요금제](https://supabase.com/pricing)
- [Resend 요금제](https://resend.com/pricing)
- [Upstash Redis 요금제](https://upstash.com/pricing/redis)
- [QStash 요금제](https://upstash.com/pricing/qstash)
- [Cloudflare DNS 문서](https://developers.cloudflare.com/dns/)

서비스별 요금과 제공 한도는 변경될 수 있으므로 계약과 배포 시점의 공식 안내를 기준으로 확인합니다.