- 投稿日：2026/04/21
Cloudflare(クラウドフレア)でWebページを公開する方法
こんにちは。よっしーです。
両学長の朝ライブでたまに出てくる「Webページを公開できる"クラウドフレア"」について調べて、実際に公開するところまで実施してみました。
１．実際に公開したWebページ
実際に公開したWebページは以下になります。
今回は公開するまでの手順を画像付きでお伝えします。
２．公開までの手順
①事前準備
公開するhtml形式のファイルを事前に準備します。
今回はNaoさんの持ち物リストを使わせていただきたいと思います。
②Claudflareにアクセス
以下のURLをクリックします。
https://www.cloudflare.com/ja-jp/
③Claudflareのログイン開始
ログインをクリックします。
④Claudflareへのログイン
今回はGoogleでログインします。
⑤トップページの表示
Claudflareのトップページが表示されます。
⑥Worker & Pagesに遷移
Compute内のWorker & Pagesをクリックします。
⑦Cloudflare Pagesの作成開始
Create applicationをクリックします。
⑧Cloudflare Pagesへの遷移
Get startedをクリックします。
⑨HTML形式のファイル取り込みの開始
下段のDrag and drop your files欄のGet startedをクリックします。
⑩公開するURL名を指定
Project nameに任意の文字を入力し、Create Projectをクリックします。
ここでProject nameに入力した内容が公開するWebページのURLでも使用されます。
⑪folderを選択
folderをクリックします。
⑫HTMLファイルが入っているフォルダの選択
htmlファイルが入っているフォルダを選択し、アップロードをクリックします。
↑claudeフォルダの中身のindex.htmlが見えませんが、実際には下図のファイルが入っています。
⑬アップロード実行
画面上部に以下の画面が表示される場合はアップロードをクリックします。
⑭アップロード完了確認
以下の緑ラインのメッセージが表示されればアップロードができています。
Deploy siteをクリックします。
⑮公開完了
赤枠のリンクをクリックします。
⑯公開完了確認
公開したWebページが表示されます。
以上になります。
慣れるまでは大変ですが、何回かやってみるとスムーズにいけると思います。
是非お試しください！！
