문서 사이트

문서

정적 사이트 게시, 프레임워크 빌드 준비, 커스텀 도메인 연결, 프로젝트 업데이트까지 DeployPages에서 실제로 필요한 절차를 정리한 가이드입니다.

React 배포Next.js exportDNS 조회SSL 확인메타 태그

빠른 시작

이미 정적 파일이 준비되어 있다면 복잡한 서버 설정 없이 바로 업로드해 공개 링크를 만들 수 있습니다.

파일이나 폴더 업로드

정적 프로젝트에 가장 빠른 방법입니다. 사이트가 이미 HTML, CSS, JavaScript 또는 완성된 빌드 폴더라면 그대로 업로드할 수 있습니다.

업로드 기준

브라우저가 읽어야 하는 파일이 모두 같은 결과물 폴더 안에 있어야 합니다.
  • 1
    진입 파일 확인

    업로드할 폴더의 루트에 index.html이 있는지 확인하세요. 하위 폴더 안에 들어 있으면 공개 링크에서 첫 화면을 찾지 못할 수 있습니다.

    예시 폴더 구조
    my-site/├── index.html├── styles.css├── script.js└── images/    ├── logo.png    └── hero.jpg

    index.html만 올리지 마세요

    스타일, 스크립트, 이미지 폴더가 빠지면 화면이 깨지거나 흰 화면만 보일 수 있습니다.
  • 2
    결과물 폴더 전체 업로드

    DeployPages에 파일이나 폴더를 업로드합니다. React, Vue, Vite 프로젝트라면 소스 루트가 아니라 빌드 후 생성된 dist 또는 build 폴더가 기준입니다.

  • 3
    미리보기 확인

    게시 전에 미리보기에서 자산 경로, 내부 링크, 모바일 레이아웃, 폼 또는 버튼 동작을 확인합니다.

  • 4
    공개 링크 공유

    공개 링크가 준비되면 팀, 고객, 채용 담당자, 수업 제출처에 공유하세요. 필요하면 나중에 커스텀 도메인을 연결할 수 있습니다.

CLI로 반복 배포

같은 빌드를 반복해서 게시하거나 배포가 스크립트, CI 작업, 릴리즈 체크리스트에 들어가야 할 때 유용합니다.

반복 작업에 적합

수동 업로드로 시작해도 되고, 배포 주기가 생기면 CLI로 옮기면 됩니다.

CLI 설치

전역 CLI를 설치한 뒤 터미널에서 로그인합니다.

npm install -g @deploypages/cli

로그인

브라우저에서 계정을 확인하고 현재 workspace에 배포할 수 있게 연결합니다.

deploypages login

배포 실행

빌드 결과물 폴더에서 배포 명령을 실행하거나 스크립트에 넣어 릴리즈 절차에 포함합니다.

deploypages deploy

프레임워크 빌드 준비

현대 프런트엔드 프레임워크는 업로드 전에 빌드 단계가 필요합니다. 목표는 항상 같습니다. 브라우저가 직접 열 수 있는 정적 파일을 만드는 것입니다.

빌드 결과물이 배포 단위

빌드는 프레임워크 소스 파일을 배포 가능한 HTML, CSS, JavaScript, 자산으로 변환합니다.

React / Vue / Vite

Command:npm run build
Output:dist/

프로젝트 루트가 아니라 dist 폴더 자체를 업로드하세요.

Next.js 정적 export

Command:npm run build
Output:out/

빌드 전에 next.config.js에서 output: 'export'를 설정하세요.

정적 HTML

Command:빌드 단계가 필요 없습니다
Output:기존 폴더

루트에 index.html만 정확히 두면 됩니다.

Hugo / Hexo

Command:hugo 또는 hexo generate
Output:public/

생성된 public 폴더를 업로드하세요.

Next.js static export 예시

next.config.js
/** @type {import('next').NextConfig} */const nextConfig = {  output: 'export',  images: { unoptimized: true },};
module.exports = nextConfig;

서버 기능 확인

API routes, server-side props, middleware 같은 서버 렌더링 기능은 static export 빌드에서 사용할 수 없습니다.

커스텀 도메인

미리보기 URL로 먼저 게시한 뒤, 준비가 끝나면 내 도메인을 연결해 더 신뢰감 있는 공개 주소로 바꿀 수 있습니다.

도메인 구매는 별도

DeployPages는 이미 보유한 도메인을 연결하는 흐름을 제공합니다. 도메인 등록은 사용 중인 registrar에서 진행하세요.

프로젝트에 도메인 추가

콘솔에서 프로젝트를 열고 커스텀 도메인을 추가합니다. apex 도메인 또는 www/서브도메인 중 운영 방식에 맞는 주소를 선택하세요.

DNS 레코드 설정

DNS 제공업체에서 안내된 CNAME 또는 TXT 레코드를 추가합니다. 전파에는 몇 분에서 더 오래 걸릴 수 있습니다.

HTTPS 확인

도메인 확인이 끝나면 SSL 인증서가 준비되고 HTTPS가 자동 적용됩니다. 브라우저에서 최종 URL을 열어 확인하세요.

TypeHostValue용도
CNAMEwwwcname.deploypages.site트래픽을 플랫폼으로 연결
TXT_deploypages-challengedeploypages-verify=...도메인 소유권 확인

DNS 변경 후 확인할 것

  • 기존 레코드와 충돌하지 않는지 확인하세요.
  • www와 apex domain을 각각 어떻게 처리할지 정하세요.
  • HTTPS가 준비되기 전에는 잠시 경고가 보일 수 있습니다.

사이트 업데이트와 이전 버전 복원

업데이트는 새 배포로 남습니다

파일을 다시 업로드하거나 CLI로 새 빌드를 게시하면 이전 배포 기록을 보존한 채 최신 버전을 공개할 수 있습니다.
  • 1
    새 빌드 준비

    수정한 파일 또는 프레임워크 빌드 결과물을 다시 만듭니다.

  • 2
    새 버전 게시

    업로드 또는 CLI 배포를 실행해 최신 배포를 만듭니다.

  • 3
    공개 링크 확인

    주요 페이지, 자산, 라우트, 도메인, HTTPS 상태를 실제 URL에서 확인합니다.

  • 4
    필요하면 이전 버전으로 복원

    문제가 있으면 배포 기록에서 안정적인 이전 버전을 선택해 되돌릴 수 있습니다.

정적 사이트는 배포 단위가 명확하므로 작은 수정도 추적 가능하게 운영할 수 있습니다.

자주 묻는 질문

개발자가 아니어도 DeployPages를 사용할 수 있나요?
네. 사이트가 이미 정적 파일로 export되어 있다면 파일 업로드만으로도 충분합니다.
배포 후 404가 보이는 이유는 무엇인가요?
가장 흔한 원인은 index.html이 없거나 잘못된 위치에 있는 경우입니다. 배포용 진입 파일이 업로드한 폴더 루트에 있는지 확인하세요.
React나 Vue 라우트가 새로고침에서 깨지면 어떻게 하나요?
DeployPages는 일반적인 정적 프런트엔드 설정을 위한 SPA fallback을 지원하지만, 빌드 결과물은 올바르게 export되어 있어야 합니다.
동영상이나 큰 자산도 올릴 수 있나요?
가능하지만 매우 큰 미디어는 최적화하거나 용도에 맞는 전문 전송 경로를 사용하는 편이 성능에 좋습니다.
사이트에 비밀번호를 걸 수 있나요?
비밀번호 보호가 포함된 요금제에서 가능합니다. preview, 내부 문서, staged launch에 사용할 수 있습니다.
가이드 더 보기