はじめに

クイックスタート

サインアップからプライベート プレビュー URL にアクセスするまで 5 分。

このページでは、新規サインアップからプライベート プレビュー URL に移動します。ステップ 2 には 2 つのパスがあります。手持ちのパスと一致する方を選択してください。

1. ワークスペースを作成する

/login でサインインします。メールアドレスとパスワード、GitHub、Google の 3 つの方法を利用できます。初回サインイン時に、アカウント名を使ったワークスペースが作成されます。名前は後から ワークスペース設定 で変更できます。

新しいワークスペースは Free プランで始まり、公開サイト数とエージェント接続数は無制限です。このクイックスタートを最後まで実行できます。現在のクレジット、ドメイン、機能の違いは料金ページを参照してください。

2. サイトを導入する — 1 つ選択する

テンプレートから開始することも (リポジトリは必要ありません)、既存の GitHub リポジトリに接続することもできます。

A. テンプレートから開始します (より速い、GitHub ではありません)

/onboarding/from-template を開きます。現在、5 つのスターターを利用できます。

  • SaaS ランディング — シングルページのマーケティング サイト (Next.js)
  • ドキュメント サイト — マークダウン駆動のドキュメント ページ (Next.js)
  • ポートフォリオ — 「プロジェクトについて」セクションを含む個人サイト (Next.js)
  • Astro docs — コンテンツファーストのドキュメント スターター (Astro)
  • Vite + React のランディング — シングルページのアプリ シェル (Vite + React)

1 つを選択し、変数フォーム (site_slug、プロジェクト、およびテンプレート固有のノブ) に記入して送信します。 Showly はサイトを作成し、テンプレート ファイルを具体化して、最初のビルドを開始します。新しいサイトの詳細ページが表示され、ビルド ステータスが表示されます。

このパスはプレビュー URL への最速の方法です。GitHub OAuth、インストール、Webhook での待機は不要です。

B. リポジトリを接続する

ワークスペースのホームで サイトを接続 をクリックし、GitHub リポジトリを登録します。初回接続時は Showly GitHub App の認可を求められます。権限の内容は最初のサイトを参照してください。認可後、Showly は必要に応じて package.json、ロックファイル、フレームワーク情報などのリポジトリメタデータを読み取り、次の処理を行います。

  • フレームワーク (Astro、Vite、Next.js エクスポート、または静的 HTML) を検出します。
  • ビルド コマンドと出力ディレクトリを提案する

提案されたマニフェストを確認します。続行する前に、任意のフィールドをオーバーライドできます。

両方のパスはステップ 3 で収束します。

3. エージェントを接続します (オプションですが推奨)

Showly MCP サーバーをエージェントに登録します。

npx @showly/mcp-server install --to claude-code   # or --to codex

これでセットアップは完了です。トークンをコピーする必要はありません。Showly ツールを初めて呼び出すと、エージェントがブラウザーを開き、サインインとアクセス許可を求めます。その後、Showly がスコープ付きトークンをエージェントへ直接発行します。認可フローとブラウザーを使えない場合の手順はスキルのインストールを参照してください。

エージェントに本番環境の資格情報を与えることなく、Claude Code または Codex にサイトのコンテキストの読み取り、変更計画の提案、プレビューの作成を依頼できるようになりました。

4. 最初の変更を加えます

Showly チャット パネルで、またはエージェントから次のように言います。

ホームページのヒーロー見出しを「儀式なしで出荷」に変更

エージェントは次のことを行います:

  1. get_site_context を呼び出して関連ファイルを読み取ります。
  2. create_change_plan 提案書を作成します。
  3. apply_site_patch を呼び出して、Showly が管理するワークスペースで編集をステージングします。
  4. create_preview を呼び出してプレビュー URL を構築および生成します。

ビルドが完了すると (通常は 90 秒未満)、チャットにプレビュー URL が表示されます。

5. 承認して公開する

プレビュー URL を開きます。差分を確認してください。準備ができたら、[公開をリクエスト] をクリックします。これにより、プレビューが運用環境に昇格される前に、所有者または管理者が承認する必要がある保留中の承認リクエストが作成されます。

承認後、Showly はプレビュー アーティファクトを運用環境にプロモートします。 [リリース] パネルに新しいライブ URL が表示されます。

次は何ですか