> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kazzle.com/llms.txt
> Use this file to discover all available pages before exploring further.

# 빌드 및 배포

> AI로 앱을 빌드하고, 라이브 미리보기에서 반복 작업하고, 프로덕션에 배포합니다.

## 앱 만들기

두 가지 방법:

* **AI에 요청** - 스레드에서 원하는 것을 설명하면 AI가 빌드합니다
* **새 앱 버튼** - Drive 사이드바에서 \*\*+\*\*를 클릭하고 **새 앱**을 선택합니다

AI는 요청 내용을 바탕으로 시작 템플릿을 선택합니다:

| 템플릿       | 제공 항목     | 사용 시기                    |
| --------- | --------- | ------------------------ |
| `ui`      | React 웹 앱 | 웹 앱, 대시보드, 랜딩 페이지 필요 시   |
| `process` | HTTP 서버   | API, 웹훅 핸들러, 예약된 작업 필요 시 |

## 하나의 앱, 하나의 브랜치

각 앱은 `main`의 단일 git 체크아웃입니다. 별도의 초안, 브랜치 전환, 병합 단계가 없습니다. 모든 편집은 `main`에 커밋으로 저장되며, 배포는 단순히 "현재 `main` 배포"입니다.

## 빌드 사이클

1. AI가 `main`에 직접 코드를 작성합니다
2. AI가 개발 서버를 시작합니다. 라이브 미리보기가 표시됩니다
3. 채팅으로 반복 작업합니다: "차트를 사이드바로 이동", "다크 테마 추가"
4. 각 편집 후 개발 서버가 핫 리로드됩니다
5. 준비되면 배포합니다

## 배포

배포는 현재 `main` 커밋을 배포합니다. 별도의 프로덕션 브랜치가 없으며, `main`에서 가장 최근에 배포된 커밋이 라이브 상태입니다.

카탈로그에 배포하여 다른 사용자가 설치할 수 있도록 하면, 앱은 시작 시 사용자 ID 토큰, 백엔드용 설치 키, 설치/제거 웹훅을 받습니다. [배포](/apps/publishing)를 참조하세요.

## 캐싱, 업데이트, 오프라인

데스크톱과 모바일은 앱 URL을 일반 브라우저 보기에서만 엽니다. 브라우저 캐시를 지우거나, 네트워크 전용 로드를 강제하거나, 공개 앱과 비공개 앱에 다른 캐시 정책을 적용하지 **않습니다**.

웹 앱이 캐싱을 관리합니다:

* 문서 및 자산용 HTTP `Cache-Control` 헤더
* 선택적 서비스 워커 / PWA 설정 (템플릿에는 자동 업데이트가 포함된 `vite-plugin-pwa` 포함)
* 새 빌드가 즉시 활성화되는지, 한 번 리로드되는지, 다음 열기를 기다리는지 여부
* 최신 활성화된 빌드의 오프라인 폴백

Kazzle이 열린 앱 탭의 새로운 배포 버전을 감지하면, 등록된 서비스 워커에 업데이트를 확인하도록 요청합니다 (`registration.update()`). 서비스 워커가 없는 앱은 해당 확인을 무시하고 자신의 HTTP 캐시 헤더를 계속 사용합니다.

따라서 배포된 앱은 캐시에서 즉시 열 수 있고, 하드 새로고침 없이 새 빌드를 적용할 수 있으며, 최신 빌드를 오프라인에서 사용할 수 있습니다.

## 배포

배포 후 라이브 URL을 얻으려면 배포합니다:

* **원격 앱** - Kazzle 클라우드에 배포되고 공개 URL을 받습니다
* **로컬 앱** - 컴퓨터에 설치됩니다. UI는 직접 로드되고, 프로세스 부분은 개발 서버를 실행합니다.

## 실시간 앱

즉시 로컬 읽기 및 오프라인 지원이 필요한 앱의 경우 AI는:

1. 데이터베이스를 만듭니다
2. 실시간 동기화를 켭니다
3. 두 부분 앱을 빌드합니다: UI (React + 동기화 클라이언트) 및 프로세스 (토큰 엔드포인트 + 동기화 업로드)
4. [vault](/work/vault)를 통해 자격 증명을 연결합니다

작동 방식은 [실시간 동기화](/apps/sync)를 참조하세요.

## 랜딩 페이지

랜딩 페이지는 UI 전용 앱입니다. 백엔드 없음, 데이터베이스 없음. 페이지를 설명하면 AI가 빌드하고, 배포하고, 라이브 URL을 제공합니다. 사용자 정의 도메인을 사용하려면 도메인 또는 서브도메인을 배포된 앱 URL로 지정합니다.
