Codexで作ったホームページをロリポップで公開する仕組み

〜ZIPファイル・HTML・FTPサーバーを初心者向けに解説〜

① ホームページを作る

最近では、CodexなどのAIを使って、専門的なプログラミングの知識がなくてもホームページを作れるようになりました。

AIに「こんなホームページを作って」と指示すると、デザインや文章、画像などを組み合わせたホームページのファイルを作成してくれます。

しかし、ここで疑問が生まれます。

「作ったホームページを、どうすればインターネット上に公開できるの？」

実は、ホームページを作ることと、インターネット上に公開することは別の作業なのです。

② HTMLファイルとは何か？

ホームページは、いくつかのファイルを組み合わせて作られています。

例えば、

• HTML：文章やページの構造
• CSS：文字の色や配置などのデザイン
• JavaScript：ボタンや動きなどの機能
• 画像ファイル：写真やイラスト

これらのファイルが集まって、一つのホームページになります。

つまり、私たちが普段見ているホームページの裏側には、さまざまなファイルが存在しているのです。

③ ZIPファイルとは何か？

Codexなどでホームページを作ったら、関連するファイルをまとめてZIPファイルにすることがあります。

ZIPとは、複数のファイルやフォルダを一つにまとめ、持ち運びやすくする仕組みです。

例えるなら、引っ越しの荷物を段ボール箱に詰めるようなものです。

HTMLや画像などをバラバラに運ぶより、一つのZIPファイルにまとめた方が管理しやすくなります。

ただし、一般的なホームページ公開では、ZIPファイルをそのまま置くのではなく、解凍して中のファイルを取り出します。

④ レンタルサーバーとは何か？

ホームページをインターネット上に公開するためには、ファイルを置く場所が必要です。

その場所を提供してくれるのが、ロリポップなどのレンタルサーバーです。

例えるなら、

自分のパソコンは自宅、レンタルサーバーはインターネット上に借りたお店のようなものです。

自宅のパソコンにホームページを保存しただけでは、通常、世界中の人がそのページを見ることはできません。

そこで、レンタルサーバーにホームページのファイルを置くことで、インターネットを通じて公開できるようになります。

⑤ FTPサーバーとは何か？

ここが初心者には少しわかりにくいところです。

FTPとは、パソコンとサーバーの間でファイルを送受信するための仕組みです。

FTPサーバーは、そのファイル転送を受け付ける仕組みだと考えるとわかりやすいでしょう。

例えるなら、

• パソコン：荷物を発送する場所
• ZIPを解凍したファイル：届ける荷物
• FTP：荷物を運ぶための配送方法
• レンタルサーバー：荷物の届け先

という関係になります。

ロリポップには、ブラウザから使える「ロリポップ！FTP」というファイル管理機能があります。

これを使えば、専用のFTPソフトをインストールしなくても、ホームページのファイルをアップロードできます。

⑥ 実際にホームページを公開する手順

作業は大きく6段階です。

STEP 1：Codexでホームページを作成する

AIに指示して、HTMLやCSS、画像などを作成します。

STEP 2：ZIPファイルにまとめる

ホームページに必要なファイルを一つにまとめます。

STEP 3：ZIPファイルを解凍する

パソコンでZIPファイルを右クリックし、「すべて展開」を選択します。

解凍すると、HTMLや画像などが入ったフォルダが現れます。

STEP 4：ロリポップにログインする

ロリポップのユーザー専用ページを開き、「ロリポップ！FTP」に進みます。

STEP 5：ファイルをアップロードする

ホームページを公開するフォルダを開いて、解凍したファイルをアップロードします。

ここで大切なのは、通常、トップページになる「index.html」が公開フォルダの正しい位置にあることです。

※ Reactなどで作ったサイトでは、先にビルドして、公開用に生成されたファイルをアップロードする必要があります。

STEP 6：ホームページを確認する

アップロードが完了したら、自分のホームページのURLをブラウザに入力します。

正しく表示されたら、公開成功です！

⑦ ドメインとは何か？

最後に覚えておきたいのが「ドメイン」です。

ドメインとは、ホームページのインターネット上の住所のようなものです。

例えば、

https://example.com

というURLがある場合、example.comがドメインです。

レンタルサーバーが土地や建物だとすると、ドメインは訪問するための住所です。

ドメインをレンタルサーバーに正しく設定することで、訪問者がホームページを見つけられるようになります。

まとめ

ホームページ公開の流れは、

Codexで作る → ZIPにまとめる → 解凍する → ロリポップにアップロードする → URLで公開する

という順番です。

最初はHTML、ZIP、FTP、サーバー、ドメインなど、聞き慣れない言葉がたくさん出てきます。

しかし、一つひとつの役割がわかれば、それほど複雑な仕組みではありません。

大切なのは、「ホームページを作る場所」と「ホームページを公開する場所」は違うと理解することです。

AIで作ったホームページを、自分で契約したレンタルサーバーに置く。

それができれば、自分のホームページを世界中の人に見てもらえるようになるのです。

ちなみに、FTPサーバーとレンタルサーバーは、必ずしも別々のサーバーではありません。 ロリポップのレンタルサーバーに、FTPという仕組みを利用してファイルを送るイメージです。

また、ロリポップでは公開先のフォルダがドメインの設定によって異なります。必ずしも public_html というフォルダではない点に注意してください。