Y Build で構築 このアプリを自分で作る —— プロンプトからデプロイまで、自分のドメインで。 無料で始める
構築公開比較ラボ概要 構築を始める →
公開

AI で作ったアプリを自分のドメインにデプロイする

プレビュー URL は製品ではありません。Cloudflare Pages、Vercel、Netlify における DNS から HTTPS までの道のり —— そして誰も触れないコストの罠。

Marcus Tan創業エンジニア、Y Build
公開 Jun 9, 2026
7
読了
cover · 1200×600

AI ビルダーのデモはどれも *.something.app のプレビュー URL で終わります。それは製品ではなく、クリックできるスクリーンショットです。出荷とは、あなたのドメイン、HTTPS、そして驚かされない請求書を意味します。以下が道のりの全体像と、主要 3 ホストの違いです。

3 つのホスト

AI で作った Web アプリなら、ほぼ間違いなくこのいずれかに行き着きます。3 つとも、カスタムドメインで自動 SSL/TLS を提供し、設定フローはほぼ同じです。

ホスト最適な場面カスタムドメインの向け先料金の形
Cloudflare Pages静的 / コンテンツ / コスト重視your-project.pages.dev定額;帯域無制限
VercelNext.js 中心のアプリcname.vercel-dns.com寛大な無料枠、従量課金
Netlifyフォーム / 認証を内蔵で欲しいyour-site.netlify.appチームあたり $19/mo、1 TB

DNS から HTTPS までのループ

流れはどこでも同じです:

  1. ホストのダッシュボードでドメインを追加する(「保留中(pending)」と表示されます)。
  2. レジストラ(または Cloudflare の DNS)で DNS を向ける:あなたのサブドメインから上記ホストの向け先への CNAME
  3. apex の場合www なしの example.com)、生の CNAME は使えません —— ホストや DNS プロバイダーの CNAME フラット化、または ALIAS/ANAME レコードを使います。Cloudflare は apex のフラット化を自動で行います。
  4. 検証を待つ。 ホストがレコードを確認し、証明書を自動でプロビジョニングします —— たいてい数分です。喜ぶ前に、HTTPS で解決されることを確認しましょう。

nginx も certbot も、伝播の子守りも不要です。人がつまずく点は 2 つ:apex 対 www(両方を設定し、一方を他方へリダイレクトする)、そしてメールとアプリが同じドメインを共有できることを忘れること。

コストの罠

ここはチュートリアルが飛ばす部分です。Vercel の無料枠は寛大ですが、従量課金です —— 一度バズれば、$0 の請求が $500+ の不意打ちに変わりかねません。Cloudflare Pages は正反対です。最初は好きになりにくいものの、トラフィックがどうであれ請求額はほとんど動きません —— 帯域無制限、月 500 ビルドまで無料、プロジェクトあたり最大 100 のカスタムドメイン、そして世界最速の CDN(300+ の拠点)。Netlify はその中間で、定額 $19/mo のチームプランとフォーム/認証を作り込み済みです。

コンテンツサイトや、ほぼ静的なアプリを出荷していて、トラフィックの急増について考えたくないなら、Cloudflare Pages が無難な既定値です。Next.js の機能を深く使っているなら、Vercel が最も抵抗の少ない道です。バックエンドなしで組み込みのフォーム処理が欲しいなら、Netlify がその価値を発揮します。

結論

デプロイはデモと製品を分けるステップであり、2026 年には 10 分の作業です —— ただし、機能一覧だけでなく、アプリに合ったホストを選び、料金モデルに気を配ればの話です。まずはアプリを用意しましょう:30 分で 1 つ作る様子をご覧ください。

この徹底検証は気に入りましたか?
次の実験を公開当日にお届け。週に 1 通、生の数字つき。
執筆
Marcus Tan 創業エンジニア、Y Build

Marcus は AI ツールで 40+ の本番アプリを出荷し、Build Lab の実験 —— すべての Compare および Lab ノートの背後にある、計時され再現可能な直接対決 —— を運営しています。以前は 2 つの YC スタートアップで開発者プラットフォームを構築しました。

40+ 出荷したアプリ 8 年 フルスタック 著者 · ラボ
Marcus の記事をもっと見る → @marcustan github ↗

続きを読む

ラボのすべて →
自分のアプリを構築
無料 · カード不要
無料で始める →