【初心者向け】バイブコーディングで作ったWebアプリをネット上に公開（アップロード）する方法！【収益化・レンタルサーバー利用前提】

2026年8月8日2026年8月20日

URLをコピーしました！

こんにちは、にゃあこです！

先日Antigravityを使ったバイブコーディングで1時間でWebアプリを作成したレポを公開しました！

こちらの記事

【バイブコーディング】Google Antigravityを使って1時間でWebアプリを作成した話こんにちは、にゃあこです！突然ですが、みなさん、AI使ってますか？！私は毎日使わない日はないほど使っています！！私がよく使っているのは、ChatGPT、ClaudeCode…

「運用・ドメイン取得はどのように行っておりますか？」とご質問をいただきました！

上のバイブコーディングレポ記事だとさらっと手順の中にいれてしまっていたんですが、今回はこの辺の工程を記事にいたしました。

「バイブコーディングで作ったwebアプリを、レンタルサーバーを借りてネット上に公開してみたい！」
「自分の作ったWebアプリで収益化してみたいけど、ドメイン・サーバーって何？」

そんな方のお役に立つかもしれない記事です！

開発したWebアプリは、Cloudflare、Vercelというプラットフォームでアップロードする方法もありますが、これらは無料で利用できる代わりに独自ドメインが取得できません＝収益化が難しいです。

そのため、本記事は「作ったWebアプリをアップロードして収益化してみたい」「独自ドメインで運営したい」ということが前提になっています。

収益化を特に意識していない場合は、Cloudflare、Vercelを利用する方が楽ちんかもしれないです。
（コスト的にはサーバー代・ドメイン代かかりませんし、技術的にはNext.js使えるし、GitHub連携できますからね）こちらの方法についても、いずれ記事が書ければと思います…

Webアプリ(サイト)公開までの全体の流れ

全体の大まかな流れはこちらです！

ドメインを取得

公開したいWebアプリのURLを設定します

レンタルサーバーを借りて、①で取得したドメインと紐づけする

Webアプリをアップロードする「箱」と、URLの紐づけ作業をおこないます

レンタルサーバーに開発ファイルをアップロードする

「箱」に開発したWebアプリをアップロードして、URLにアクセスすると表示されるようにします

ドメインサービスやレンタルサーバーのサービスは様々あるのですが、
今回は私がよく利用している「XServer(エックスサーバー)」を例に解説させていただきます！
エックスサーバーがおすすめの理由として、ドメインサービスも提供しているため、エックスサーバー内で作業が完結するからです！

多少画面の表示などは異なりますが、他のサービスでもおおまかな設定は共通しているため、他サービスを使う場合でもご参考にはなるかと思います！

Xserverのお友達紹介特典（初回利用料金最大20%OFF)を受ける！

運用コスト

利用プラットフォームやプランにもよりますが、おおむね下記のようなコスト感です。（すべて年額）

ドメイン代：800円～2,000円
サーバー代：8,000円～12,000円

年額おおむね10,000円見積もっておけばOKだと思います

さらにざっくり計算ですが、運営費年額10,000円は、月3,000PV～5,000PVあれば、GoogleAdsenseなどの広告収入で回収可能な見込みです。

多くの人に役立ちそうなサービスや、繰り返し使ってもらえそうなサービスは、このように自分でコストをかけて運営してしまっても、収益化したらサーバー代を賄えると思います。

ちなみに、サーバーを1つ借りてしまえば、他に別のWebアプリやサービスをアップロードしたくなった時に流用できるので(容量が許す限り)、ドメインだけ新しく取得すればOKです。
姉妹サービスみたいなものであれば、同ドメインの別ディレクトリにアップロードしてドメイン代すら節約しちゃってもいいかもしれません。SEO流入にも大した影響はないと思われます（個人の見解です）。

①ドメインを取得する

まずは、サイトのURLとなるドメインを取得します。
今回はエックスサーバーのドメインサービス「XServer Domain」を利用します。

1:取得したいドメインを入力

「取得したいドメインを入力」のところに、サービス名のURLにしたいドメインを自由に入力し、「検索する」を押します。

「～.com」「～.jp」まで入力してしまっても大丈夫ですが、後から決めたい場合は自動で提案してくれるので入力しなくてもOKです。

ちなみに、収益化にあたって検索流入を狙う場合は、できるだけサービス名がわかるようなURLにした方がいいです¹。
例えば、英語学習のWebアプリだったら「english」を入れる、お料理関係のWebアプリだったら「cooking」などなど。

まあこのブログのURL、「nekofairy-log.com」なんですけどね！ハハッ！

2:検索結果ページの一番上でプランを選択

「お申込内容の選択」から、ドメイン＋サーバーか、ドメインのみか、申し込みプランを選択します。

サーバーとセットの方は左を選択してください。サーバーを他で借りる方は、「ドメインのみ申し込み」を選択ください。

サーバーはどのプランにしたらいい？というお悩みは、こちらの補足をご参照下さい～。

3:検索結果から取得するドメインを選択

検索結果を下にスクロールし、提案されたドメインのうち、一つにチェックをいれて右下の「取得手続きに進む」を選択します。

ちなみに、一番左のように×がついているドメインは取得できません。（すでに使われているドメインだからです）

（補足）ドメインの違いについて

初めてこの作業をされる方は、「どのドメイン選んだらいいの？」と迷われると思います。
結論として、検索流入を気にするのであれば「人気ドメイン」の「.com」「.net」などのメジャーなドメインの利用を推奨します。

コスト重視であれば、「.xyz」など格安のドメインもありますが、あまりお勧めはしません。
これらが安い理由はブランド力（信頼性）があまりないからです。
特に「.xyz」は、ドメインとしての歴史が浅く、普及のために格安で提供した結果、スパムなどに大量利用されてしまった……という経緯があります。関連は断定できないですが、SEOでも不利だったり、いまだにサイトがスパム判定されたりするようです。

自分の作ったWebアプリを検索流入で見つけてもらいたいと思っている場合には、「.com」などの安定したドメインを利用しましょう！