ClaudeとMCPでホームページを作って公開する

Povilas、Gintaの運営者 · 2026年11月11日 · 8分で読めます

はい、Claudeはホームページを作って公開できます。Claude単体ではコードを書くだけで、それをどこかにホスティングする必要があります。ホームページ作成サービスへのコネクタがあれば、Claudeがチャットの中ですべてを済ませます。ページをデザインし、本物のアドレスで公開し、あとで頼めば修正もします。この記事では、2026年10月12日に時間を計ってGintaのMCPサーバーで実際に試した様子を紹介します。メッセージ1通、168秒、ツールの呼び出し4回で、公開されたホームページができました。

MCPとは（2文で）

MCP（Model Context Protocol）は、ClaudeやChatGPTのようなAIアシスタントが外部のツールを使うための標準的な仕組みです。Gintaはhttps://ginta.app/mcpでMCPサーバーを動かしていて、つないでサインインし「Allow」（許可）を押すと、ClaudeがあなたのGintaアカウントでホームページを作成、公開、更新できるようになります。

ステップ1：ClaudeにGintaを追加する（2分）

GintaはClaudeのコネクタのディレクトリに載っています。claude.ai かClaudeのデスクトップアプリで：

コネクタのディレクトリでGintaを開きます（または「Customize → Connectors」で「Ginta」を検索）。
「Connect」を押します。Gintaの画面が開くので、サインインするか無料アカウントを作り、「Allow」を押します。

カスタムコネクタとして追加する方法も使えます：「Customize → Connectors」、「+」、「Add custom connector」（カスタムコネクタの追加）、名前はGinta、URLはhttps://ginta.app/mcpです。

ClaudeにWebサイトの管理を許可するか尋ねるGintaのサインイン画面 — Claudeに何を許すかはあなたが決めます。Claudeが見られるのは、あなたのGintaアカウントのホームページだけです。

Claudeの無料アカウントでは、カスタムコネクタが1つまでに限られることがあります。チームプランやChatGPTも含めた完全なガイドはGintaをつなぐにあります。

ステップ2：ホームページを頼む

実際に送ったメッセージは次のとおりです（日本語訳。claude.ai がコネクタを使うのと同じ方法で、AnthropicのAPIとMCPコネクタを通し、モデルはClaude Opus 5.5）：

Gintaで、ポルトにある私のヨガスタジオのホームページを作って。名前はSala Luz：少人数のハタヨガとヴィンヤサヨガのクラスで、最大10人、月曜〜土曜の朝と夜。Rua de Cedofeita 120, Porto。電話 +351 22 000 0142。質問用の問い合わせフォームもつけて。

Claudeがしたこと

#	Claudeが呼んだツール	目的
1	`get_guide`	Gintaのデザインガイドを読む：レイアウト、フォント、写真、アイコン、問い合わせフォームのブロック
2	`check_name`	`sala-luz.ginta.page`が空いているか確認
3	`create_site`	私たちのGintaアカウントでページを公開
4	`preview_site`	公開されたページのスクリーンショットを撮ってデザインを確認

合計：メッセージからsala-luz.ginta.pageでホームページが公開されるまで168秒、エラーはありませんでした。

Sala Luzのホームページ：10枚のマットが並ぶ部屋でのポルトのヨガについての大きなセリフ体の見出しと、アーチ形の窓の中の写真 — Claudeが公開したもの：スタジオの「最大10人」が、デザインのアイデアになりました。

同じホームページをスマホで：見出し、電話ボタン、住所 — 同じページをスマホで。

デザイン以上に良かったのは、Claudeの返信でした。何を推測で補ったか、何がまだ足りないかを書き出していたのです。クラスの時間と料金はなし（私たちが伝えていなかったので、ページでは電話で問い合わせるよう案内）、フォームのメッセージを受け取るメールアドレスはまだなし（それまではGintaの受信箱に届く）、本物のスタジオではなくストック写真、プライバシーページにはまだ事業者の正式名が必要。さらに、このAPIテストではpreview_siteが返したスクリーンショットを見られなかったので、代わりにコードを確認したことも伝えていました。お客様にホームページを見せる前に必要なのは、こういう正直さです。

ステップ3：あとから、どのチャットでも修正する

ホームページは1つの会話ではなく、あなたのGintaアカウントにあります。新しいチャットで*「Gintaのサイトsala-luzの営業時間を変えて」* と言えば、Claudeが見つけてくれます。Gintaのツールを通してClaudeができることを、普通の言葉でまとめると：

作成と修正：小さな修正、写真やロゴやファイルのアップロード（またはスマホから直接写真をドロップできるリンクの発行）、以前の版への巻き戻し。
既製のパーツ：あとは自分で管理できます。予約、ショップ、定員つきのイベントやクラス、メニュー、ギャラリー、ブログ、見積もり依頼、お知らせ、口コミ。
独自ドメイン：ドメインを管理している会社に合わせた正確なDNSの手順と、公開されたかどうかの確認。まだドメインがない場合、有料プランならGintaの中で年€29で探して買え、接続も済ませてくれます。
メッセージと訪問者：フォームのメッセージを読み、ページビューや表示速度のスコアを確認。

すべてのツールは、例つきで開発者向けドキュメントに載っています。

Claude Codeから：作ったプロジェクトを公開する

開発者は同じサーバーをClaude Codeに追加できます：

claude mcp add --transport http ginta https://ginta.app/mcp

次に/mcpを実行し、「ginta → Authenticate」を選んでサインインします。そのあとは 「このプロジェクトをビルドして、dist/ を新しいサイトとしてGintaに公開して」 と言えば、Claudeが短時間だけ有効なアップロードリンクを通して、ビルド全体を1つのzipでアップロードします。Gintaはプランの上限内で、ページ、スクリプト、画像、フォント、PDF、動画を配信し、_redirects、クリーンなURL、独自の404.htmlにも対応します。詳細はClaude Codeガイドとファイルとルーティングへ。

かかる費用

ご自身のアシスタントからの公開では、Gintaのクレジットは使いません。AIの作業はアシスタントが行います。無料プランではGintaのアドレスで20サイトまで（独自ドメインなし）、隅に小さな「Made with Ginta」バッジがつきます。Hostingプランは、ClaudeやChatGPTで作る人のためのプランです。Hosting（月€5、または年€50）は50サイト、1ドメイン、「Made with Ginta」バッジなし。Hosting Plus（€15）とHosting Studio（€49）はさらに多く使えます。料金は税込みで、日本からは同じ金額の米ドルです。すべてのプランは料金ページへ。

Claudeから公開するほかの方法

選択肢はGintaだけではなく、Gintaがすべてに向いているわけでもありません。2026年10月12日に各社のページで確認した内容です：

WixにはWixのサイトを作成、更新、公開できるMCPサーバー（Claudeに組み込まれたコネクタもあり）と、ChatGPTのWixアプリがあります。あとでWixのドラッグ＆ドロップのエディタを使いたいなら向いています。独自ドメインにはWixの有料プランが必要です。
Lovableには全プランで使えるMCPサーバーがあり、lovable.appにアプリを作成して公開できます。ログインやデータベースのある本格的なWebアプリに向いています。独自ドメインは有料プランで、ツールの呼び出しにはLovableのクレジットを使います。
NetlifyとVercelには、アシスタントが書いたコードをデプロイするMCPサーバーがあります。これは開発者向けのホスティングで、ホームページ作成サービスではありません。自分で作らない限り、フォームの受信箱、予約、メニューはありません。Vercelの無料のHobbyプランは非商用に限られます。

出典つきの詳しい比較はMCPサーバーのあるホームページ作成サービスを比較へ。

よくある質問

コネクタなしでも、Claudeはホームページを作れますか？

ClaudeはホームページのHTML、CSS、JavaScriptを書いて、チャットの中で見せることはできます。お客様が訪問できるアドレスで公開するにはホスティングが必要で、Gintaのようなコネクタなら同じ会話の中でそれができます。

ChatGPTでも使えますか？

はい。ChatGPTのPlus、Pro、Business、Enterprise、EduではWeb版の開発者モードでGintaを追加でき（「Plugins → + → Add custom MCP server」）、ChatGPTがホームページを作って修正できます（2026年10月19日に確認。10月18日にPlusから実際に1つ公開しました）。無料版では、ChatGPTのプラグインディレクトリにあるGintaのプラグインが承認されしだい使えます。Gintaが修正を公開する前に、ChatGPTから確認を求められます。手順はChatGPTでGintaを使うへ。

Claudeにホームページを修正させても安全ですか？

Claudeが見られるのは、サインインしたGintaアカウントのホームページだけで、それも「Allow」を押したあとだけです。修正のたびに元に戻せる新しい版が作られ、コネクタを外せばいつでも接続を切れます。

MCPが何か知らないと使えませんか？

いいえ。ClaudeのコネクタのディレクトリからGintaを一度追加し（またはアドレスを1つカスタムコネクタとして貼り付け）、サインインしたら、あとはしてほしいことを普通の言葉で頼むだけです。

この記事はAIの手を借りて、Gintaのために書いています。Gintaを運営するPovilasは、ホームページ作りの講座の講師でもあります。スクリーンショットは上記の日付時点の実際のGintaの画面で、料金は料金ページの数字です。