Claude Code で作ったランディングページを、そのまま公開する方法

Claude Code にランディングページを頼むと、よくできた index.html が手元に残ります。そこから先が、意外と手間です。リポジトリ、公開先、フォームの受け口、アクセス解析のタグ、DNS。このガイドでは、よくあるやり方と、Convika の MCP サーバーを Claude Code につないで、それぞれを一言で頼むやり方を比べます。コマンドを使わずに、ダッシュボードからファイルを公開する方法も説明します。

Claude Code から公開する 4 つの方法

Claude Code は、自分のパソコンで動いてファイルを編集するツールです。作ったページは、アーティファクトとして claude.ai に公開できます。ただ、アーティファクトはバックエンドのない 1 枚のページで、アドレスも claude.ai のままです。申し込みを受けたい、自分のドメインで出したいなら、ほかの公開先に置きます。

すでに公開しているアプリの一部なら、そのリポジトリに置くのが自然です。ローンチの告知、事前登録、広告の受け皿のような単独のページなら、Convika のほうが手入れが少なく済みます。Vercel の無料の Hobby プランで公開するつもりなら、商用に使えるかを「Vercel の Hobby プランは商用利用できる？」で先に確かめてください。

ホスティングの鍵を Claude Code に渡さずに公開する

Convika につなぐときは、ブラウザで Convika にログインするだけです。鍵をファイルや会話に貼り付けることはありません。サインインの情報は Claude Code が安全に保存して自動で更新し、claude mcp remove convika を実行すれば、保存したトークンも削除されます（Claude Code の MCP のドキュメント）。

もう 1 つの違いは、届く範囲です。つないだあと Claude Code が使えるのは、ページの保存、プレビュー、公開、ロールバック、フォーム、アクセス解析、ドメインの設定といった、Convika のページのためのツールだけです。

公開先ごとに、Claude Code が届く範囲

Vercel の MCP サーバーもブラウザでサインインするので、サインインの方式だけでは差がつきません。違うのは、つないだあとに届く範囲です。各社のドキュメントで、2026 年 10 月 12 日に確かめました。

Claude Code が Convika でできること

つなぐときは、ブラウザで Convika にログインしたあと、「アクセス許可」の画面で、AI クライアントにアカウントへのアクセスを許すかを「許可する」か「拒否する」で選びます。そのあと Claude Code が使えるのは、Convika の 37 のツールです。

• ページ: ページの作成、新しいバージョンの保存、プレビューのリンク、公開、ロールバック、公開停止
• フォーム: フォームの追加、送信内容の読み取りと書き出し
• アクセス解析とゴール: 訪問数、流入元、デバイス、ボタンのクリック、コンバージョンのゴール
• ドメイン: サブドメインの接続と状態の確認。CNAME と TXT のレコードは Convika が示し、DNS 事業者で追加するのは自分です
• 共有: 紹介用のリンクと、作ったページをほかの人に引き渡すリンク

プランや支払いの変更、DNS 事業者へのログイン、ページの削除をするツールはありません。Convika のページは 1 つの HTML なので、触れられる環境変数やデータベースもありません。

公開する前に起きること

変更は保存のたびに新しいバージョンになり、Claude Code は既定で、非公開のプレビューのリンクを作って見せます。リンクにはランダムな 64 文字が入り、検索エンジンには載せないよう指示していて、7 日で開けなくなります。公開中のページが変わるのは Claude Code が公開したときだけで、Convika のツールは、公開は頼まれたときだけにするよう Claude Code に伝えています。

公開、ロールバック、公開停止と、独自ドメインのアドレスでの配信を止めるツールには、公開中のページを変えるツールだという印が付いています。毎回確かめたいなら、Claude Code の権限の設定で、この 4 つを確認ルール（ask）に入れておきます。Claude Code は、使うたびに承認を求めます。

{
  "permissions": {
    "ask": [
      "mcp__convika__publish_site",
      "mcp__convika__rollback_site",
      "mcp__convika__unpublish_site",
      "mcp__convika__disable_domain_route"
    ]
  }
}

元に戻すには

Claude Code に以前のバージョンに戻すよう頼むか、ダッシュボードの「バージョン履歴」で「この版に戻す」を押します。ページを止めたいときは、Claude Code に公開停止を頼むか、「公開停止」を押します。コンテンツは残り、あとで公開し直せます。保存したバージョンは Free で 10 件、Pro で 50 件まで残り、公開中のバージョンと、いまのプレビューのバージョンは消えません。

CLI で公開するなら

Claude Code の設定のドキュメントは、.env ファイルを読ませない例として、Read(./.env) と Read(./.env.*) を拒否ルール（deny）に入れる設定を載せています。ただし権限のドキュメントによると、このルールが効くのは Claude Code のファイル操作と、cat のように Claude Code が認識するコマンドまでで、Python や Node のスクリプトが自分でファイルを開く場合は対象外です。そこまで防ぐなら、サンドボックスを有効にします。

トークンは、アカウント全体ではなく 1 つのプロジェクトに絞って作ります。Vercel も、作業に足りるいちばん狭いスコープを選ぶよう勧めています。Claude のアーティファクトを共有したときに誰が見られるかは、「アーティファクトを見られる人と、Google 検索に出るかどうか」で説明しています。

Convika で公開する 5 つの手順

Convika の無料アカウントを作る

app.convika.com で登録します。Free プランはカード登録なしで使えます。

Claude Code に Convika をつなぐ

ターミナルで次のコマンドを実行します。

claude mcp add --transport http convika https://mcp.convika.com

すべてのプロジェクトで使うなら、--scope user を付けます。続けて Claude Code の中で /mcp を開くか、シェルで claude mcp login convika を実行し、ブラウザで Convika にログインして「許可する」を押します。オプションとログインの流れは、Claude Code の MCP のドキュメントにあります。

ページを保存して、プレビューを開く

Claude Code に「landing/index.html を Convika に新しいサイトとして保存して、プレビューのリンクを見せて」と頼みます。Claude Code がファイルを読み、HTML を送ります。Convika は 1 ページを 1 つの HTML として保存し、ツールは Tailwind CSS v3 を CDN から読み込む書き方を求めます。Vite や Next.js などのビルドで作ったページは、先に「ビルドなしで動く 1 つの HTML ファイルにして」と頼みます。画像は公開されている URL にするか、ファイルに埋め込みます。

フォームを付けて公開する

「見出しの下に、名前とメールアドレスの事前登録フォームを付けて。それから公開して」と頼みます。ページは yourproduct.convika.com のようなアドレスで公開されます。プレビューから送ったテストの送信は確認だけで保存されないので、本番の登録者に混ざりません。

独自ドメインをつないで、結果を聞く

「launch.example.com をつないで」と頼むと、Convika が DNS に追加する CNAME と TXT のレコードを返します。ドメインを買ったサービスでそのレコードを追加すれば、SSL 証明書は自動で発行されます。自動設定に対応しているのは launch や www のようなサブドメインで、example.com のようなルートドメインには対応していません。公開から数日たったら、「今週、どこから来た人が登録した？いちばん押されたボタンはどれ？」と聞きます。Claude Code が Convika から、訪問数、UTM の流入元、デバイス、ボタンのクリック、フォームの送信を読んで答えます。

コマンドを使わずに公開する

ターミナルを使わなくても、Claude Code が作った HTML ファイルはダッシュボードから公開できます。管理画面で「HTMLファイルをアップロードする」を押し、「ファイルから」でファイルを選ぶか、「コードから」にコードを貼り付けて、「プレビューをつくる」を押します。プレビューを確かめたら、「公開する」を押します。アップロードに AI クレジットは使いません。フォームは「フォームを追加する」、独自ドメインは「ドメイン管理」から、どちらもダッシュボードで追加できます。

登録する前に見え方だけ確かめたいなら、無料の HTML 公開ツールで、登録なしのプレビューのリンクを作れます。Claude Code で作ったレポートやスライドを、Claude を使っていない人に送る方法は「Claude で作った HTML を、Claude のアカウントがない人にも見せる方法」にあります。

Claude Design から来たとき

Claude Design のガイドによると、デザインは右上の「エクスポート」から「スタンドアロンHTMLとしてエクスポート」で書き出せるほか、「Claude Codeへのハンドオフ」で Claude Code に引き渡せます。引き渡したら、「このデザインを 1 つの HTML ページにして」と頼み、上の「ページを保存して、プレビューを開く」に進みます。公開するだけなら Claude Code はいりません。書き出した HTML ファイルをそのままアップロードする手順は、「Claude で作ったページを、自分のドメインで公開する方法」にあります。

Codex など、ほかの MCP クライアントで使う

リモートの MCP サーバーに対応したクライアントなら、同じサーバーを使えます。クライアントの MCP の設定に https://mcp.convika.com を追加し、ログインを済ませます。このガイドで Claude Code に頼んだことは、同じ言い方で頼めます。Claude の Web 版やデスクトップ版では、コネクタとして追加します（「公開と修正を Claude に任せる」）。

よくある質問

Claude Code だけで Web サイトを公開できますか？

1 枚のページなら公開できます。Claude Code はページをアーティファクトとして claude.ai に公開でき、Claude Code のドキュメントによると、公開リンクはサインインなしで誰でも開けます（Team と Enterprise は、オーナーが公開共有を有効にしてから）。ただし、アーティファクトはバックエンドのない 1 枚のページで、申し込みフォームの送信を受け取れず、アドレスも claude.ai のままです。自分のドメインで出すなら、Vercel や Netlify のコマンドラインツールをインストールしてログインしておき、Claude Code に実行させるか、このガイドのように Convika をつなぎます。Claude Code で作ったレポートやスライドを、Claude を使っていない人に送るなら「Claude で作った HTML を、Claude のアカウントがない人にも見せる方法」を見てください。

Claude Code に .env ファイルを読ませないようにするには？

設定ファイルの拒否ルールに Read(./.env) と Read(./.env.*) を入れます。Claude Code の設定のドキュメントに、そのまま例があります。権限のドキュメントによると、このルールが効くのは Claude Code のファイル操作と、cat などの Claude Code が認識するコマンドまでで、Python や Node のスクリプトが自分でファイルを開く場合は防げません。そこまで防ぐならサンドボックスを使います。Convika で公開する場合は、ブラウザでのログインでつながるので、.env に入れる鍵はありません。

Vercel のトークンを Claude Code に渡しても大丈夫ですか？

トークンでできることは、そのスコープで決まります。Vercel のトークンは、アカウント全体、1 つのチーム、1 つのプロジェクトのどれかに絞れて、Vercel は作業に足りるいちばん狭いスコープを選ぶよう勧めています。Vercel の MCP サーバーはブラウザでサインインしますが、Vercel のドキュメントによると、Vercel のユーザーアカウントと同じアクセスを AI に渡します。Convika の接続で届くのは、Convika のページのためのツールだけです。プランや支払い、環境変数、DNS のレコード、ページの削除には届きません。

Claude Code は Convika で何ができますか？

Convika の 37 のツールでできることです。ページの作成と新しいバージョンの保存、プレビューのリンク、公開、ロールバック、公開停止。フォームの追加と、送信内容の読み取りと書き出し。コンバージョンのゴールの設定と、アクセス解析の読み取り。サブドメインの接続。紹介用のリンクと、作ったページをほかの人に引き渡すリンクの作成。プランや支払いの変更、ページの削除、DNS 事業者へのログインはできません。

Claude Code が勝手に公開することはありますか？

既定ではありません。変更は保存のたびに新しいバージョンになり、Convika のツールは、まず非公開のプレビューを見せるよう Claude Code に伝えています。公開中のページが変わるのは Claude Code が公開したときだけで、ツールは、公開は頼まれたときだけにするよう伝えています。公開のツールには公開中のページを変える印が付いていて、Claude Code の権限の設定で、実行の前に毎回承認を求めるようにもできます。

Claude Code が加えた変更を元に戻すには？

Claude Code に以前のバージョンに戻すよう頼むか、ダッシュボードの「バージョン履歴」で「この版に戻す」を押します。ページを止めたいときは、公開停止を頼むか「公開停止」を押します。コンテンツは残り、あとで公開し直せます。保存したバージョンは Free で 10 件、Pro で 50 件まで残ります。

Git のリポジトリは必要ですか？

いりません。Convika が変更をバージョンとして残すので、Git がなくても、プレビューで確かめて、公開して、元に戻せます。HTML をリポジトリにも置いて、履歴を Git でも残すのはかまいません。

どんなページを公開できますか？

1 つのサイトに 1 枚の HTML ページです。CSS とスクリプトは、ページの中に書くか CDN から読み込みます。Convika はランディングページのための公開先なので、ログインやデータベース、複数のページが必要なアプリは、汎用の公開先に向いています。

Convika の AI クレジットは減りますか？

減りません。ページを書くのは Claude Code なので、クレジットは使いません。クレジットを使うのは、ダッシュボードの「AIで改善」など、Convika に内蔵された AI でページを作ったり直したりするときだけです。

料金はかかりますか？

Free プランはカード登録なしで使えます。10 ページまで、フォームの送信は月 50 件まで一覧に出て（超えた分も保存され、Pro で見られます）、独自ドメインは 1 つ、ページの下部に小さな「Powered by Convika」の表示が入ります。Pro にすると表示が消え、フォームの送信数と独自ドメインの数の上限もなくなります。最初のページを公開すると、Pro をカード登録なしで 14 日間無料で使えます。その後は月 $12 で、続けない場合は Free に戻ります。