Hosting Static Content with Cloudflare

I wrote about hosting static sites on various platforms:

  1. Hosting Static Content with
  2. Hosting Static Content with, renamed themself to
  3. Hosting Static Content with

Since end of 2021 Cloudflare greatly enhanced their static site offering: Cloudflare Pages Goes Full Stack.

Start with npm install wrangler. This will install the JavaScript command to control your "Cloudflare Pages" account. The wrangler command has the following options:

$ wrangler help

  wrangler init [name]       📥 Create a wrangler.toml configuration file
  wrangler dev [script]      👂 Start a local server for developing your worker
  wrangler publish [script]  🆙 Publish your Worker to Cloudflare.
  wrangler tail [name]       🦚 Starts a log tailing session for a published Worker.
  wrangler secret            🤫 Generate a secret that can be referenced in a Worker
  wrangler kv:namespace      🗂  Interact with your Workers KV Namespaces
  wrangler kv:key            🔑 Individually manage Workers KV key-value pairs
  wrangler kv:bulk           💪 Interact with multiple Workers KV key-value pairs at once
  wrangler pages             ⚡ Configure Cloudflare Pages
  wrangler r2                📦 Interact with an R2 store
  wrangler worker-namespace  📦 Interact with a worker namespace
  wrangler pubsub            📮 Interact and manage Pub/Sub Brokers
  wrangler login             🔓 Login to Cloudflare
  wrangler logout            🚪 Logout from Cloudflare
  wrangler whoami            🕵  Retrieve your user info and test your auth config

  -c, --config   Path to .toml configuration file  [string]
  -h, --help     Show help  [boolean]
  -v, --version  Show version number  [boolean]

To deploy your current directory to Cloudflare, see Use Direct Upload with continuous integration:

CLOUDFLARE_ACCOUNT_ID=<ACCOUNT_ID> npx wrangler pages publish <DIRECTORY> --project-name=<PROJECT_NAME>

The so called "project name" is your previously specified name for your pages. In my case it is klm. Therefore I run:

$ time CLOUDFARE_ACCOUNT_ID='' wrangler pages publish . --project-name=klm
Attempting to login via OAuth...
Opening a link in your default browser:
Successfully logged in.
🌍  Uploading... (1014/1014)

✨ Success! Uploaded 1014 files (88.23 sec)

✨ Deployment complete! Take a peek over at
        real 118.45s
        user 4.63s
        sys 0
        swapped 0
        total space 0

Deploying more than 1,000 files takes around two minutes. Some time has to substracted from this as I had to log in manually via browser.

If you have already uploaded and just want to change some files, then deployment is much faster.

$ time CLOUDFARE_ACCOUNT_ID='' wrangler pages publish . --project-name=klm
🌎  Uploading... (1023/1023)

✨ Success! Uploaded 9 files (1014 already uploaded) (2.92 sec)

✨ Deployment complete! Take a peek over at
        real 11.29s
        user 1.80s
        sys 0
        swapped 0
        total space 0

My static site on Cloudflare is here: