Serving static content with Cloudflare Pages

How to efficiently serve static web content?

Static Site Generators are an excellent choice if your content is not large and remains static most of the time. I use Zola for this blog, Hugo for my portfolio gallery, and mdBook for books among other things. Serving static content requires a tiny footprint, the page load time is insanely fast, the deployment can't be any easier and hosting is usually free.

Cloudflare Pages is one way to host static content, here is my set up.

• Connect Cloudflare Pages to GitHub repos.
• Configure Cloudflare Pages auto deployment on new GitHub changes.
• Map Cloudflare Pages to my DNS (this only works if that DNS is managed by Cloudflare).

That's it. I make local changes and push to GitHub. A min later or so, a new content is generated, deployed and goes live. Their free tier is more than what I need.

A few things to note:

• Set the right framework if Cloudflare can't detect it.
• Set the build path. Each SSG framework may output build artifacts to a different directory, make sure you set it correctly. Cloudflare Pages will deploy this directory once build succeeds.
• For Zola
  • add ZOLA_VERSION to env variables, and set to the right version
  • choose the old build server, the new one has issue with Zola
• For Hugo
  • add HUGO_VERSION, same as a bove