How to Host a Static Website on Cloudflare for Free
If your site is made of plain HTML, CSS and a little JavaScript, you don't need a server, a database or a monthly hosting plan. Cloudflare can serve static files from its global network, and for a small personal site the cost is effectively nothing. This guide walks through the exact steps I used to publish this very site.
What "static" means and why it fits
A static site is a folder of files that are sent to the browser exactly as they are stored. There is no code running on a server to build each page. That makes it fast, simple to secure and cheap to host. Personal pages, portfolios, documentation and blogs written ahead of time all fit well. If you need user accounts, a database or server-side logic, you would add those later with Workers code, but you don't need them to get started.
What you need before you begin
- A free Cloudflare account.
- Node.js installed on your computer (the current LTS version is a good choice).
- A folder containing your site, with an
index.htmlfile at the top level. - Optionally, a domain name, which I cover below.
Step 1: Put your site in a folder
Create a folder, for example site, and place index.html inside it along with any images or stylesheets. Everything inside this folder is what will be published, so keep private files out of it.
Step 2: Add a small Wrangler config
Wrangler is Cloudflare's command-line tool. In the folder that contains site, create a file named wrangler.jsonc:
{
"name": "my-site",
"compatibility_date": "2026-10-01",
"assets": { "directory": "./site" }
}
The name becomes the name of your project, and assets.directory tells Wrangler which folder to upload.
Step 3: Log in and deploy
Run these two commands in a terminal:
npx wrangler login
npx wrangler deploy
The first opens a browser window where you approve access to your Cloudflare account. The second uploads your files and prints a workers.dev address. Open that address and your site is live. To publish a change later, edit your files and run npx wrangler deploy again.
Step 4: Connect your own domain
To use a name like example.com instead of the workers.dev address, the domain must first be added to your Cloudflare account as a zone, which means pointing its nameservers at Cloudflare. After that, add routes to the config:
"routes": [
{ "pattern": "example.com", "custom_domain": true, "zone_name": "example.com" },
{ "pattern": "www.example.com", "custom_domain": true, "zone_name": "example.com" }
]
Run npx wrangler deploy again. Cloudflare creates the DNS records and the HTTPS certificate for you. If you see an error saying the zone does not exist on your account, the domain has not been added to that Cloudflare account yet, or you are logged in to a different account.
What it costs
Requests for static files on Workers are not billed, so a small site does not generate hosting charges on the free plan. The thing you will pay for is the domain name itself, which renews yearly with whichever company registered it. Always check Cloudflare's current pricing page, since plans and limits can change.
Checking your work
- Load the site on your phone and your computer to check the layout.
- Confirm that
https://works and that both the bare domain and thewwwversion load. - Open the browser's developer tools and look for failed requests or console errors.
That is the whole workflow: a folder, a short config file and two commands. Once it is set up, publishing an update takes seconds.
← Back to home