> ## 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 でアプリを構築し、ライブプレビューで反復し、本番環境にデプロイします。

## アプリの作成

2 つの方法があります:

* **AI に依頼** - スレッドで作りたいものを説明すると、AI がビルドします
* **新規アプリボタン** - Drive サイドバーの **+** をクリックして **新規アプリ** を選択します

AI は質問内容に基づいて開始テンプレートを選びます:

| テンプレート    | 内容           | 用途                           |
| --------- | ------------ | ---------------------------- |
| `ui`      | React ウェブアプリ | ウェブアプリ、ダッシュボード、ランディングページ     |
| `process` | HTTP サーバー    | API、ウェブフック ハンドラー、スケジュール済みジョブ |

## 1 つのアプリ、1 つのブランチ

各アプリは `main` 上の単一の git チェックアウトです。別のドラフト、ブランチ切り替え、マージステップはありません。すべての編集は `main` にコミットとして反映され、公開は単に「現在の `main` をデプロイ」するだけです。

## ビルドサイクル

1. AI が `main` に直接コードを書き込みます
2. AI が dev サーバーを起動します。ライブプレビューが表示されます
3. チャットで反復します: 「チャートをサイドバーに移動」、「ダークテーマを追加」
4. 各編集後、dev サーバーがホットリロードします
5. 準備ができたら公開します

## 公開

公開すると、現在の `main` コミットがデプロイされます。別の本番ブランチはなく、`main` 上で最後に公開されたコミットが本番環境です。

カタログに公開して他のユーザーがインストールできるようにすると、アプリは起動時にユーザー ID トークン、バックエンド用のインストールキー、インストール/アンインストール ウェブフックを受け取ります。[公開](/apps/publishing) を参照してください。

## キャッシング、更新、オフライン

デスクトップとモバイルは、アプリ URL を通常のブラウザビューで開くだけです。ブラウザキャッシュをクリア、ネットワークのみの読み込みを強制、または公開アプリと非公開アプリで異なるキャッシュポリシーを選択することは **ありません**。

ウェブアプリがキャッシングを管理します:

* ドキュメントとアセット用の HTTP `Cache-Control` ヘッダー
* オプションのサービスワーカー / PWA セットアップ (テンプレートは自動更新機能付きの `vite-plugin-pwa` を搭載)
* 新しいビルドが即座にアクティベートされるか、1 回リロードされるか、次回のオープンまで待つか
* 最後にアクティベートされたビルドのオフラインフォールバック

Kazzle が開いているアプリタブの新しい公開バージョンを検出すると、登録されたサービスワーカーに更新をチェックするよう要求します (`registration.update()`)。サービスワーカーがないアプリはそのチェックを無視し、独自の HTTP キャッシュヘッダーを使い続けます。

公開されたアプリはキャッシュから即座に開き、ハードリフレッシュなしで新しいビルドを取得でき、最新のビルドをオフラインで利用できます。

## デプロイ

公開後、ライブ URL を取得するためにデプロイします:

* **リモートアプリ** は Kazzle のクラウドにデプロイされ、公開 URL を取得します
* **ローカルアプリ** はコンピューターにインストールされます。UI は直接読み込まれ、プロセス部分は dev サーバーを実行します。

## リアルタイムアプリ

ローカルの即座の読み取りとオフラインサポートが必要なアプリの場合、AI は:

1. データベースを作成します
2. リアルタイム同期をオンにします
3. 2 部構成のアプリをビルドします: UI (React + 同期クライアント) と Process (トークンエンドポイント + 同期アップロード)
4. [vault](/work/vault) を通じて認証情報を接続します

詳細は [リアルタイム同期](/apps/sync) を参照してください。

## ランディングページ

ランディングページは UI のみのアプリです。バックエンド、データベースはありません。ページを説明すると、AI がビルド、デプロイし、ライブ URL を提供します。カスタムドメインを使用するには、ドメインまたはサブドメインをデプロイされたアプリ URL にポイントします。
