はじめに

この方法を使うと、サーバー契約もドメイン取得も無しで、ホームページを無料でインターネット上に公開できます。

使っているのは「Cloudflare Workers」という仕組みです。アクセスが来た時だけ動く方式のため、サーバーを24時間借りておく必要がなく、無料枠だけで実用に足りる速度・安定性が出ます。よくある無料ホスティング（Streamlitなど）でありがちな「しばらくアクセスが無いと眠ってしまい、次に開くと1分くらい待たされる」という問題も、この方式では原理的に起きません。

向いている人：

• お店・個人の紹介ページを、コストゼロでまず形にしたい人
• 既存のホームページ（HTML/CSS/画像）を、今より速くて無料の場所に移したい人
• 自分でコードを書ける・ChatGPTやClaudeに手伝ってもらえる人（プログラミング未経験でも、AIと一緒に進める前提でこのガイドを書いています）

事前準備

必要なものは全部無料です。

もの	用途	入手方法
Node.js	コマンドを実行するための基盤	nodejs.orgから無料ダウンロード
npm	パッケージ管理ツール	Node.jsに同梱済み（別途不要）
Cloudflareアカウント	公開先のプラットフォーム	dash.cloudflare.comでメールアドレスだけで作成。クレジットカード登録不要
ターミナル操作の基本	コマンドを打つため	Macなら「ターミナル」アプリを開くだけ

ドメインやサーバーの契約は一切不要。Cloudflareが無料で与えてくれる*.workers.devというサブドメインで公開されます（自分のドメインをすでに持っていれば、あとで紐づけることも可能。手順4で後述）。

手順1：土台となるプロジェクトを作る

ターミナルで次の1行を実行します。

npm create hono@latest プロジェクト名 --template cloudflare-workers --pm npm --install

これだけで、ホームページの土台（フォルダ構成・必要なプログラム一式）が自動でできあがります。プロジェクト名の部分は自分で決めた名前（例：my-homepage）に置き換えてください。

実行後にできる主なフォルダ：

• src/index.ts — ページの中身を制御するプログラム
• public/ — 画像や静的なファイルを置く場所
• wrangler.jsonc — 公開設定ファイル（プロジェクト名や公開方法を指定）

初回のみnpx wrangler loginでCloudflareアカウントとの連携（ブラウザが開いて認証）が必要です。

手順2：中身（コンテンツ）を用意する

やり方は2通りあります。

A. 既存のホームページをそのまま移設する場合（コード不要）

すでにHTML/CSS/画像などのファイル一式があるなら、そのままpublic/フォルダにコピーするだけです。wrangler.jsoncに次の設定があれば、public/下のファイルがそのまま配信されます（コードを一行も書かず、静的なサイトをそのまま移設できる方法）。

"assets": {
  "directory": "./public",
  "binding": "ASSETS"
}

B. 新しく中身を作る場合

src/index.tsに、ページの構造と文字をTypeScriptで書きます（Honoというフレームワークの書き方に従う）。プログラミングに慣れていない場合は、ClaudeやChatGPTに「この内容のHTMLをHonoで作って」と頼むのが一番早いです。

どちらの場合も、画像などの素材ファイルはpublic/に置けば、assetsバインディング経由で自動的に配信されます。

手順3：無料で公開する（デプロイ）

ターミナルで次の1行だけ。

npx wrangler deploy

数秒〜数十秒でデプロイが完了し、https://プロジェクト名.あなたのCloudflareアカウント名.workers.dev というURLで即日アクセスできるようになります。

この方式の利点：

• 月額サーバー代がかからない（無料枠内）
• アクセスがない時間が続いても「眠ってしまう」ことがない（常に即座に応答）
• コードを直して再度npx wrangler deployすれば、同じURLに即反映される（更新も簡単）

手順4（任意）：独自ドメインをつける

*.workers.devのままでも問題なく使えますが、すでに自分のドメイン（例：example.com）を持っていて、そのドメインのDNSをCloudflareで管理していれば、無料で紐づけられます。

やり方の一例：

1. Cloudflareの管理画面で、対象のWorkerに「Custom Domains」を追加
2. または、サブドメイン（例：site.example.com）をDNSのCNAMEレコードでWorkersに向けてリダイレクトすることも可能（Redirect Rulesを使う方法もあり）

この部分だけはドメインの取得自体（年間数百円〜の費用）が別途かかりますが、ホームページの公開自体はあくまで無料のままです。

つまずきやすいポイントと対処

症状	原因	対処
初回デプロイ時に認証を求められる	Cloudflareアカウントと未連携	npx wrangler login を先に実行してブラウザで認証
画像が表示されない	<img loading="lazy"> が環境によっては読み込まれないことがある	少数の画像ならloading="lazy"を外して即時読み込みにする
APIキーなどの秘密情報をコードに直書きしたくない	ソースコードが公開・共有される可能性	npx wrangler secret put キー名 でCloudflare側にだけ安全に保存する
定期的な自動更新をしたい	cronはMac側の環境変数を引き継がない	cron用のスクリプト内で必要な環境変数を明示的に読み込む・exportする

このガイドの手順で作った実際の例：楽天の商品紹介ページをこの方式で公開しています（rakuten-hono-demo.namiwodasu.workers.dev）。応答速度は毎回0.4秒前後で安定しています。

PR ではありません。実際に自分で使っている無料の方法を、そのまま共有しています。