ロリポップ！デプロイナウでサイトを無料公開する方法【初心者でもできた】

本記事はアフィリエイト広告（PR）を含みます。掲載しているサービスは実際に使用・検証した上でご紹介しています。

AIでWebサイトを作ってみたけれど、「これ、どうやってネット上に公開するの？」と困っていませんか？

ChatGPTのWorkなどを使えば、HTMLやCSSがわからなくても、かなり本格的なWebサイトを作れるようになりました。

でも、完成したファイルを受け取ったところで次に出てくるのが、「これを他の人に見てもらうにはどうすればいいの？」という問題です。

私はXserverを契約しているので、普段なら自分のサーバーにファイルをアップロードして公開できます。

ただ、「ちょっとLPを公開してみたいだけなのに、そのためにレンタルサーバーを契約するのはちょっと……」という方もいますよね。

そこで今回は、ロリポップ！の「デプロイナウ」を使って、AIで作った架空イベントの告知LPを実際に公開してみました。

途中でいきなり「ビルド失敗！」になったり、せっかくなのでAIエージェントを使ってターミナルから公開してみたりと、初心者らしく少し遠回りもしました。

でも、最後までやってみてわかったのは、普通の静的LPなら、実は簡単に公開できるということ。

この記事では、実際に試した流れと、初心者の私がつまずいたポイントもあわせて紹介します。

↓デモサイトはこちら
https://night-notes-demo.lolipop-now.app

この記事でわかること

AIで作ったLPをDeploy Nowで公開する方法
「ビルド失敗」になった意外と単純な原因
AIエージェントを使って公開した流れ
ターミナルを使わずブラウザから簡単に公開する方法

それでは詳しく見ていきましょう。

AIで作ったイベント告知LPを公開してみる

今回用意したのは、ChatGPTのWorkで作った架空イベントの告知LPです。

イベント当日までの日数が表示されるカウントダウンも入れて、少しスタイリッシュな雰囲気に仕上げてもらいました。

AIにお願いしながらサイトを作るところまでは、かなり簡単です。作り方はChatGPTをつかって美容室サイトを制作した記の作成方法と同じ流れです。カウントダウンは2026年10月24日18:30までリアルタイム表示などの指示をしています。

ロリポップ！Deploy Nowなら静的サイトも公開できる

ロリポップ！Deploy Nowは、WebサイトやWebアプリケーションをデプロイ（公開）できるサービスです。

Next.jsやNuxtだけでなく、HTML・CSS・JavaScriptなどで作られた静的サイト（static）にも対応しています。

今回Workに作ってもらったイベント告知LPも、基本的には次のようなファイルで構成された静的サイトでした。

index.html
style.css
script.js
画像などを入れたassetsフォルダ

つまり、今回のようなLPならDeploy Nowの「静的サイト」として公開できます。

公式ドキュメントでも、HTML・CSS・JavaScriptなどをそのまま配信するサイトは「static」を選択し、アップロードしたフォルダの構成をそのまま公開できると案内されています。

ここは、あとで私が見事につまずいたポイントでもあります。

ロリポップ！デプロイナウでプロジェクトを作成する

まず、ロリポップ！デプロイナウのサイトでアカウントを作成します。

ログイン後、プロジェクトから「＋新規作成」を選択すると、サイトを公開するための方法が表示されます。

今回気になったのが、画面にあった「AIエージェントでデプロイ」という方法。

案内用のプロンプトをコピーしてAIエージェントに渡すことで、デプロイまでの作業をAIに手伝ってもらえます。

その下には、ファイルをアップロードしてデプロイする方法もあります。こちらに作成したサイトをフォルダごとドラッグしてアップロードすれば公開できるはず・・・・

いきなり「ビルド失敗」！原因はフレームワークの選択だった

ところが、最初のデプロイはあっさり成功……とはいきませんでした。

「ビルド失敗」と表示されてしまったんです。

「え、Workからもらったファイルがおかしいの？」

最初はそう思ったのですが、原因を確認してみると、もっと単純なところにありました。

今回作ったLPは、HTML・CSS・JavaScriptで構成された静的サイトです。

ところが、プロジェクト作成時の「フレームワーク」がNext.jsになったままデプロイしていました。

上の画面です。

ちゃんと「静的サイト」という選択肢があります。

ここで最初から「静的サイト」を選択していればよかったんですね。

Deploy Nowではフレームワークを公開するサイトに合ったものを選ぶ必要があります。

今回の失敗ポイント

HTML・CSS・JavaScriptで作った普通のLPなら、フレームワークは「静的サイト」を選択します。

「フレームワーク」と言われても、Web制作初心者だと何を選べばいいのかわからないですよね。

今回の失敗で、私もひとつ覚えました（笑）。

せっかくなのでAIエージェントでデプロイしてみた

静的サイトを選べばブラウザから簡単に公開できることはわかったのですが、今回はもうひとつ試してみたかったことがありました。

それがAIエージェントでデプロイする方法です。

Deploy Nowの画面に表示されたプロンプトをコピーしてWorkに貼り付け、そこからはWorkに案内してもらいながら進めました。

大まかな流れはこんな感じです。

Deploy Nowに表示されたプロンプトをコピーする
Workに貼り付けて公開方法を案内してもらう
必要に応じてNode.jsをインストールする
ターミナルを開く
公開したいサイトのフォルダへ移動する
Workに指示されたコマンドを実行する
Deploy Nowに接続してデプロイする

Deploy NowのCLI（コマンドラインツール）を利用する場合はNode.jsが必要です。

私はターミナルの操作にも慣れていないので、「次はこれを入力してください」とWorkに言われたものを、基本的にはコピペしながら進めました。

途中で自分がファイルの場所を間違えて、少し手間取った場面もありました。

それでも、わからない表示が出るたびにWorkへ聞けるので、ターミナル初心者でも何をしているのか確認しながら進められます。

Windowsなら何を開けばいい？

Macでは「ターミナル」を使いますが、WindowsならPowerShellやWindows Terminal、コマンドプロンプトなどからコマンドを実行できます。

「黒い画面に文字を入力する」というだけで、最初はちょっと身構えてしまいますよね。

でも今回はAIに教えてもらったコマンドを入力していくだけだったので、思ったより進められました。

黒い画面にコマンドを打ち込んで、自分でWebサイトを公開していると、なんだか少しプロっぽいことをしている気分になります。

これはこれで、なかなか楽しかったです（笑）。

でも実は、ブラウザからアップロードするだけでも公開できる

ここまでAIエージェントを使って、Node.jsをインストールしたり、ターミナルを開いたりしてきました。

ところが、普通の静的LPを公開するだけなら、ここまでやらなくても大丈夫です。

Deploy Nowはブラウザからサイトのフォルダをアップロードして公開できます。

基本的な流れはシンプルです。

Deploy Nowで「＋新規作成」を開く
公開したいサイトのフォルダをアップロードする
フレームワークで「静的サイト」を選択する
プロジェクト名などを設定する
「デプロイ」をクリックする

今回のようにフォルダ直下にindex.htmlがあるサイトなら、トップページとしてそのまま表示できます。

つまり、AIエージェントを使った方法を試して散々ターミナルと格闘したのですが、最初から「静的サイト」を選んでアップロードすれば、もっと簡単に公開できたというわけです。

……最初からそれでよかったんですね（笑）。

Workには「Deploy Nowで公開できる静的サイト」と伝えておくと安心

今回の経験から、次にWorkなどのAIへLP制作を頼むなら、公開方法まで最初に伝えておくとわかりやすいと感じました。

たとえば、こんな感じです。

ロリポップ！Deploy Nowで「静的サイト」として公開できる形式で作成してください。HTML・CSS・JavaScriptで構成し、index.htmlをフォルダ直下に配置してください。ブラウザからフォルダをアップロードして、そのまま公開できる構成にしてください。

これなら、今回のようなイベント告知LPには十分です。

逆にNext.jsなどを使って作られたWebアプリの場合は設定が異なるので、何でも「静的サイト」を選べばよいわけではありません。

自分が作ってもらったサイトが何で作られているかわからなければ、AIに「これはDeploy Nowではどのフレームワークを選べばいい？」と確認してから公開するのが一番簡単だと思います。

レンタルサーバーがある人とデプロイナウはどう使い分ける？

私は普段Xserverを使っているので、自分のWebサイト内にLPを置きたい場合は、そちらへファイルをアップロードして公開することもできます。

すでにレンタルサーバーと独自ドメインを持っているなら、その方法でも問題ありません。

一方でDeploy Nowは、こんなときに便利だと感じました。

レンタルサーバーをまだ契約していない
AIで作ったWebサイトをとりあえず公開してみたい
イベント告知LPなどを公開してURLで共有したい
Web制作やデプロイを実際に体験してみたい

「AIでサイトを作れたけれど、サーバーのことは全然わからない」という初心者にとって、作ったものを実際にインターネット上へ出してみる方法のひとつになります。

前回作成した玉ねぎ劇場のゲームなんかもデプロイナウで簡単に公開することができますね！

なお、サービス内容や利用条件は変更される可能性があります。実際に利用するときは公式サイトで最新情報を確認してください。

まとめ

今回は、AIで作ったイベント告知LPをロリポップ！デプロイナウで公開した流れを紹介しました。

この記事のポイント

HTML・CSS・JavaScriptで作ったLPは「静的サイト」として公開できる
今回のビルド失敗は、フレームワークでNext.jsを選んでいたことが原因
AIエージェントを使えば、AIに聞きながらCLIでデプロイすることもできる
CLIを使う場合はNode.jsやターミナル操作が必要になる
普通の静的LPならブラウザからフォルダをアップロードする方法が簡単

AIでWebサイトを作れるようになっても、「作る」と「公開する」の間には、初心者にとってもうひとつ壁があります。

私も今回は「ビルド失敗！」から始まり、Node.jsを入れたり、ターミナルを触ったりと少し遠回りしました。

でも、実際にやってみるとAIでLPを作るところから、URLを発行してネット上に公開するところまで進めることができました。

しかも、普通の静的サイトなら、フレームワークで「静的サイト」を選んでブラウザからアップロードするだけでも公開できます。

「AIでサイトを作ってみたけど、その先どうするの？」という方は、デプロイナウを使って実際に公開するところまで試してみると、Web制作がさらに面白くなると思います。

今回作成したサイトはこちら↓

https://night-notes.lolipop-now.app