If your website is plain HTML, CSS, and JavaScript, you do not need a web server, a VPS, or a monthly hosting bill. Cloudflare Workers will serve a static site from Cloudflare's edge network, fast everywhere, with a generous free tier that covers most small-business sites entirely. By the end of this guide you will have your site deployed to a live URL, with local preview working and a path to your own custom domain.
Cloudflare's older product for this was called Pages. It still works, but Cloudflare is steering new static projects toward Workers with static assets, so that is what we set up here.
Prerequisites
- A folder containing your finished site, with an
index.htmlat the top level. We will assume it is calledpublic/. - Node.js 18 or newer installed (
node --versionto check). - A free Cloudflare account (sign up at cloudflare.com if you do not have one).
- A terminal and about 20 minutes.
Step 1: Set up the project and install Wrangler
Wrangler is Cloudflare's command-line tool. Everything runs through it. Make a project folder, put your site files in a public subfolder, and install Wrangler locally.
mkdir my-site && cd my-site
npm init -y
npm install wrangler --save-dev
Your folder should look like this:
my-site/
├── package.json
├── node_modules/
└── public/
├── index.html
├── css/
└── js/
The folder name public is just a convention. Any name works as long as the config in the next step matches it.
Step 2: Create wrangler.jsonc
Create a file named wrangler.jsonc in the project root. This is the whole configuration for a static site:
{
"name": "my-site",
"compatibility_date": "2025-01-01",
"assets": {
"directory": "./public"
}
}
Three settings, three jobs. name becomes part of your free workers.dev URL, so pick something you do not mind being public. compatibility_date pins the Workers runtime behavior; setting it to roughly today's date is correct for a new project. assets.directory tells Cloudflare which folder to upload and serve.
One useful option if your site is a single-page app that handles its own routing:
{
"name": "my-site",
"compatibility_date": "2025-01-01",
"assets": {
"directory": "./public",
"not_found_handling": "single-page-application"
}
}
For an ordinary multi-page site, leave not_found_handling out and missing pages return a normal 404.
Step 3: Preview locally with wrangler dev
Before deploying anything, run the site locally exactly as Cloudflare will serve it:
npx wrangler dev
Wrangler starts a local server, usually at http://localhost:8787. Open that in a browser and click around the whole site. Check that images load and internal links work. Broken paths here will be broken in production too, and this is the cheap place to find them. Press x or Ctrl+C to stop it.
Step 4: Deploy
First deployment needs a login. Wrangler opens a browser window and asks you to authorize it against your Cloudflare account:
npx wrangler login
Then ship it:
npx wrangler deploy
Wrangler uploads the contents of public/ and prints your live URL, something like:
Deployed my-site
https://my-site.your-subdomain.workers.dev
That URL is live worldwide within seconds. Future updates are the same one command: edit your files, run npx wrangler deploy again. Wrangler only uploads files that changed, so redeploys are quick.
Step 5: Add your custom domain
The workers.dev URL is fine for testing, but you want your own domain on it. Your domain needs to be on Cloudflare first: in the Cloudflare dashboard, add the domain as a site and update the nameservers at your registrar to the pair Cloudflare gives you. Nameserver changes usually take effect within a few hours.
Once the domain is active in Cloudflare, you can attach it in the config. Add a routes entry to wrangler.jsonc:
{
"name": "my-site",
"compatibility_date": "2025-01-01",
"assets": {
"directory": "./public"
},
"routes": [
{ "pattern": "www.example.com", "custom_domain": true }
]
}
Then run npx wrangler deploy again. Cloudflare creates the DNS record and issues the TLS certificate automatically, so HTTPS works with no extra steps. You can also do the same thing in the dashboard under your Worker's Settings, in the domains and routes section, if you prefer clicking to editing config.
Verify it
Run through this short list and you are done:
https://www.example.comloads your site over HTTPS with a valid certificate (the padlock in the browser).- Internal links, images, and stylesheets all load. Open the browser dev tools Network tab and confirm nothing returns 404.
- A nonsense URL like
/does-not-existreturns a 404 rather than a blank page. - Make a small visible edit, run
npx wrangler deploy, and confirm the change appears live within a minute.
Total ongoing cost for a typical small-business site: nothing. The Workers free tier covers a large number of requests per day, far beyond what most brochure sites ever see, and there is no server for anyone to patch or reboot. If you would rather hand off the setup, the domain move, and the deploys, this is exactly the kind of job we do.
Stuck on this, or want it done for you? That's the job.
Email us →