ChatGPTやClaudeで作ったホームページを公開する方法
ChatGPTやClaudeで作ったホームページを公開する方法は2つあります。AIが書いたコードをファイルとして保存し、NetlifyやGitHub Pagesなどのホスティングサービスにアップロードする方法。もう1つは、MCPでアシスタントをホームページ作成サービスにつなぎ、アシスタント自身に本物のアドレスで公開してもらう方法です。こちらなら、あとで頼めば修正もしてくれます。1つ目は無料で、手作業が必要。2つ目は設定に2分かかりますが、コピーは一切要りません。
私たちが作っているGintaは、2つ目の方法を提供しています。以下で両方を説明し、それぞれ何が自分の作業として残るかも書きます。
チャットのあとに手元にあるもの
ホスティングにつながっていない状態でChatGPTやClaudeにホームページを頼むと、手に入るのはコードです。HTMLファイルで、CSSや少しのJavaScriptがついていることが多く、すべてが1つのファイルにまとまっていることもあります。チャットの中でプレビューが見られることもありますが、プレビューは、ほかの人があなたのアドレスで訪問できるホームページではありません。
コードをホームページにするには、3つのものが必要です。ファイルを置くホスティング、アドレス(ホスティングの無料アドレスか独自ドメイン)、そして修正の段取りです。来週にはきっと何か変えたくなるからです。
方法1:コードを保存して、自分でホスティングする
ステップ1:ファイルを保存する
コードをテキストエディタにコピーし、新しいフォルダにindex.htmlという名前で保存します。アシスタントがCSSやJavaScriptを別に出してくれた場合は、同じフォルダにアシスタントが使った名前(たとえばstyle.css)で保存します。画像もそのフォルダに入れます。index.htmlをダブルクリックして、ブラウザで正しく表示されるか確かめましょう。
ステップ2:ホスティングを選ぶ
よく使われるものを、各社のページから:
- Netlify Drop:
app.netlify.com/dropを開いてフォルダをページにドラッグすると、netlify.appで終わるアドレスでサイトが表示されます。Netlifyのドキュメントでは、サイトを残して更新できるようにサインインを勧めています(Netlify Drop quickstart、2026年10月19日に確認)。Netlifyの無料プランでは独自ドメインも使えます(料金ページ、2026年10月12日に確認)。 - GitHub Pages:GitHubのリポジトリから無料でホスティングできます。ただしGitHub自身のルールでは、オンラインビジネスを運営するための無料ホスティングとして使うことは想定も許可もされていません(GitHub Pagesの制限、2026年10月19日に確認)。ポートフォリオや趣味ならよいですが、ショップには向きません。
- Vercel:開発者に人気ですが、無料のHobbyプランは非商用・個人利用に限られます(Vercelのドキュメント、2026年10月12日に確認)。
ステップ3:ホスティングがしてくれないことに対応する
AIで作ったサイトの多くがつまずくのはここです。普通のホスティングはファイルを配信するだけなので:
- 問い合わせフォームは何も送信しません。HTMLのフォームには、メッセージを受け取るサービスが必要です。オプションで提供しているホスティングもありますが、なければフォームサービスを追加するか、フォームをメールのリンクに置き換えます。
- 画像が表示されないことがあります。アシスタントは、存在しない画像のアドレスにリンクすることがあります。すべての画像を確認し、フォルダに保存した自分の写真へのリンクに差し替えましょう。
- 修正のたびに往復作業。アシスタントに頼み、新しいコードをコピーし、古いファイルに上書き保存して、フォルダをもう一度アップロードします。うまくいきますが、どの版が公開されているのか分からなくなりがちです。
- 独自ドメインを使うには、レジストラで自分でDNSレコードを追加します(独自ドメインのつなぎ方)。
ファイルやフォルダの扱いに慣れているなら、これは十分よい、安い方法です。
方法2:アシスタントに公開してもらう
ChatGPTもClaudeも、MCP(Model Context Protocol)を通して外部のツールを使えます。MCPは、アプリをAIアシスタントにつなぐための標準的な仕組みです。MCPサーバーのあるホームページ作成サービスをつなげば、アシスタントがページをデザインし、公開し、あとから修正するところまで、すべてチャットの中でできます。コピーするファイルはありません。
Gintaの場合はこうなります。
- アシスタントにGintaを追加する:アドレスは
https://ginta.app/mcpです。ClaudeではGintaがコネクタのディレクトリにあるので、「Connect」を押します(または「Customize → Connectors → Add custom connector」で、このアドレスをカスタムコネクタとして追加)。Web版のChatGPTでは「Plugins → + → Add custom MCP server」(カスタムMCPサーバーの追加)から追加します。 - サインインして「Allow」(許可)を押す。アシスタントに何を許すかはあなたが選び、アシスタントが見られるのはあなたのGintaアカウントにあるホームページだけです。

- ホームページを頼む。あなたしか知らない情報を伝えましょう:名前、仕事の内容、場所、営業時間、電話番号。アシスタントは
yourbakery.ginta.pageのようなアドレスで公開し、リンクを教えてくれます。

自分で対応しなくてよいこと:
- フォームが動きます。ホームページからのメッセージはGintaの受信箱に届き、メールアドレスを確認すればメールでも届きます。アシスタントに読んでもらうこともできます。
- 写真が壊れません。Gintaはアシスタントに、記憶にある画像のアドレスではなく無料の写真検索を使うよう伝え、公開時に外部の画像をすべて確認して、壊れているものを差し替えます。自分の写真は、スマホから直接ドロップできるリンクをClaudeが出してくれます。
- どのチャットからでも修正できます。ホームページは1つの会話ではなく、あなたのアカウントにあります。修正はすべて元に戻せる新しい版として保存され、Gintaのエディタで編集することもできます。
- 独自ドメイン:アシスタントにつないでと頼めば、あなたのドメインを管理している会社に合わせた正確なDNSの手順を表示します。まだドメインがない場合、有料プランならGintaの中で年€29で買え、接続まで済ませてくれます。
以前のチャットで作ったコードがある場合は? Gintaをつないだチャットに貼り付けて、Gintaで公開してとアシスタントに頼みましょう。Claude Codeを使う開発者なら、プロジェクトのフォルダを丸ごと一度にアップロードできます(Claude Codeガイド)。
アシスタントごとに必要なもの
- Claude:claude.ai とデスクトップアプリで、無料プランも含めて使えます。ClaudeのコネクタのディレクトリからGintaを追加するか、カスタムコネクタとして追加します(無料プランでも1つ追加できます)。手順はClaudeでホームページを作る、実際に時間を計った例はClaudeとMCPでホームページを作って公開するをご覧ください。
- ChatGPT:Plus、Pro、Business、Enterprise、EduではWeb版の開発者モードでGintaを追加でき、ChatGPTがホームページを作って修正できます(2026年10月19日に確認)。無料版では、ChatGPTのプラグインディレクトリにあるGintaのプラグインが承認されしだい使えます。詳細とデモ動画はChatGPTでホームページ作成へ。
設定手順はすべてここにまとめています:Gintaをつなぐ。
同じように使えるほかのサービス
Gintaだけではありません。2026年10月12日と19日に各社のページで確認したところ、WixにはWixのサイトを作るMCPサーバーと、Claudeに組み込まれたコネクタ、ChatGPTのWixアプリがあります。Lovableにはlovable.appにアプリを公開するMCPサーバーがあります(ツールの呼び出しにLovableのクレジットを使います)。NetlifyとVercelには、アシスタントが書いたコードをデプロイするMCPサーバーがあります。こちらはホームページ作成サービスではなく、開発者向けのホスティングです。詳しい比較はMCPサーバーのあるホームページ作成サービスへ。
どちらを選ぶべき?
- 自分で保存してホスティング:ファイルの扱いが好きで、無料にしたく、サイトにフォームがない(または自分でフォームをつなぐ)場合。
- アシスタントに公開してもらう:動くフォーム、受信箱、面倒のない独自ドメイン、頼むだけの修正がほしい場合。あとからオンライン予約やメニューなど、既製のパーツを使いたい小さなお店にも向いています。
Gintaでの費用
ご自身のアシスタントからの公開では、Gintaのクレジットは使いません。AIの作業はアシスタントが行い、Gintaはホスティングを担当します。無料プランではGintaのアドレスで20サイトまで、小さな「Made with Ginta」バッジつきで公開できます。独自ドメインはHostingプラン(月€5、50サイト、1ドメイン、バッジなし)で使えます。ご自身のAIで作る人のためのプランです。料金は税込みで、日本からは同じ金額の米ドルです。すべての料金は料金ページへ。
よくある質問
ChatGPTやClaudeは自分だけでホームページを公開できますか?
コードを書いてプレビューを見せることはできますが、誰でも訪問できるアドレスでサイトを公開するにはホスティングが必要です。自分でファイルをアップロードするか、Gintaのようにつないだ作成サービスにチャットから公開してもらいます。
AIで作ったホームページを無料で公開できる場所は?
Netlifyの無料プランとGitHub Pagesは、静的ファイルを無料でホスティングします(GitHub Pagesはビジネスの運営向けではありません)。Gintaの無料プランでは、アシスタントで作ったホームページをGintaのアドレスで、動くフォームつきで公開できます。
AIで作ったホームページの問い合わせフォームが動かないのはなぜ?
フォームには、メッセージを受け取る側のサービスが必要です。普通のファイルホスティングにはそれがありません。フォームサービスを追加するか、フォームに対応した作成サービスで公開しましょう。
独自ドメインは使えますか?
はい、どの方法でも使えます。普通のホスティングなら自分でDNSレコードを追加します。Gintaでは有料プラン(月€5から)に含まれ、Ginta(またはアシスタント)がレジストラに合わせた正確な手順を表示します。
アシスタントにホームページを修正させても安全ですか?
Gintaでは、アシスタントが見られるのは、あなたが「Allow」を押したあと、サインインしたアカウントにあるホームページだけです。修正はすべて復元できる版として保存され、接続はいつでも外せます。
この記事はAIの手を借りて、Gintaのために書いています。Gintaを運営するPovilasは、ホームページ作りの講座の講師でもあります。スクリーンショットは上記の日付時点の実際のGintaの画面で、料金は料金ページの数字です。