🟠 Cloudflare Pages とは
Webサイトを世界中に高速・安全に公開できる無料のホスティングサービスです。
※ 無料枠について
| Cloudflare Pages(無料) | Netlify(無料) |
| 転送量 | ✔ 無制限 | 月100GBまで |
| サイト数 | ✔ 無制限 | 無制限 |
| クレジット消費 | ✔ なし | 機能により消費あり |
LPを掲載するだけの用途なら、無料枠を超えることはほぼありません。
① Cloudflareにログイン(または新規登録)する
以下のURLにアクセスしてください。
URLhttps://dash.cloudflare.com/login
▲ GoogleアカウントやAppleアカウントでもログインできます。
初めての方は「Don't have an account? Sign up」から無料登録してください。
② 左メニューの「Compute」→「Workers & Pages」をクリック
ログインすると以下のようなダッシュボードが表示されます。
左側のメニューを見て、「Build」グループの中にある「Compute」をクリックしてください。
⚠️
「Workers & Pages」は左メニューの「Build」→「Compute」の中に隠れています。
直接見えていない場合は「Compute」をクリックして展開してください。
③ Cloudflare Pages の作成画面を開く
① 「Create application」をクリック
Workers & Pages の画面が開いたら、右上の青いボタンをクリックします。
▲ 右上の 「Create application」 ボタンをクリックしてください。
② ダイアログ下部の「Get started」をクリック
ダイアログが開きます。一番下の小さな文字「Looking to deploy Pages? Get started」をクリックします。
▲ 「Upload your static files」ではなく、一番下の「Get started」リンクをクリックしてください。ここがCloudflare Pagesの入口です!
⚠️
「Upload your static files」を選ぶとPagesではなくWorkersとして作成されます。
必ず一番下の小さい「Get started」リンクをクリックしてください。
③ 「Drag and drop your files」の「Get started」をクリック
▲ 下側の 「Drag and drop your files」の「Get started」 をクリックします。
(上の「Import an existing Git repository」は今回使いません)
④ 納品データを準備する
納品されたZIPファイルを用意するだけでOKです。解凍(展開)する必要はありません!
💡 ZIPファイルのままアップロードできます
Cloudflare PagesはZIPファイルを直接受け付けてくれます。受け取ったZIPファイルをそのまま使いましょう。
📦 ○○○.zip ← このままでOK!解凍しなくてよい
⑤ プロジェクト名を入力してファイルをアップロードする
① プロジェクト名を入力して「Create project」をクリック
「Project name」の欄に名前を入力して 「Create project」 をクリックします。
▲ 「Project name」に好きな名前を入力します。
入力すると下に「Your project will be deployed to 〇〇.pages.dev」とURLのプレビューが表示されます。
⚠️
プロジェクト名は英数字とハイフン(-)が使用できます。(日本語・スペースは使用不可)
この名前がURLになるので、わかりやすい名前をつけましょう。
例:yamadakafe、hanakosalon、tokyolp2024
② ファイルをアップロードする
「Create project」をクリックすると、アップロードエリアが表示されます。
▲ ZIPファイルをそのままこの枠の中にドラッグ&ドロップしてください。
解凍せずにZIPのままでOKです!
③ 「Deploy site」をクリック
アップロードが完了したら「Deploy site」ボタンが青くなります。クリックして公開します。
▲ 「All files were successfully uploaded.」が表示されたら成功です。
右下の 「Deploy site」 をクリックしてください。