Skip to main content

Moving to Cloudflare Pages

At work there's a cool product for deploying websites that has great integration with GitHub, it's called Cloudflare Pages. I use and pay for a lot of Cloudflare products but hadn't got around to using Pages. The nudge came when an old friend from university who has been managing for 24 years(!) told me she'd like to decommission the server.

The actual content on was originally generated by a Perl script that output static HTML. From time to time I'd modify the Perl, run it, and deploy the HTML using FTP. Really old school. Over time I moved to just running everything on the server without the FTP mess.

And, in reality, most of the content on is on this blog, and that uses Blogger. So I decided to try Cloudflare Pages for the home page and go for the simplest possible page. It's all text and a single page and it looks like this:

It's a single HTML file containing a small amount of CSS for the colours and a small amount of JavaScript to make the function keys work. The amber colour is based on an actual amber terminal I used to use. It used the P3 phosphor which emits light at 602nm (which is close to #ffb700 in RGB using this converter).
The entire page is 3,451 bytes long and there are no images.

From never used Cloudflare Pages to a deployed HTML page in 8 minutes

Since I'd never used Cloudflare Pages before the first step was to create a project after signing into the Cloudflare dashboard:
The first step in that process was to connect my project to a GitHub account.

Since I have my account and the Cloudflare corporate account I was presented with a choice. 

And then had to authorize access on GitHub:

Followed by choosing a repository to use. Since I hadn't actually set one up it was off to GitHub to create one. I chose to use a private repository to see if that worked. It did.

A nice touch was that the Cloudflare Pages screen asking me to choose a repository automatically noticed that I'd created a new one.

I went with the default settings (which use the main branch).

I hopped over to the command-line, cloned the new repository I'd made, created a simple index.html page, committed it and pushed to main. 

Cloudflare Pages immediately started the process of deploying the page.

The entire process going from visiting Cloudflare Pages to set it up to having a deployed working page took a total of eight minutes! And of these I spent about three minutes creating the temporary HTML.

From there I was able to iterate on the page and just push to GitHub and let Cloudflare take care of the rest. 

Connecting it to

But that still left the page on and I want it deployed on and Since I already use Cloudflare for this was a matter of clicking on Custom Domains and choosing Cloudflare updated my DNS records automatically to point to Cloudflare Pages (after asking for confirmation):

I did the same for and within seconds the new site was live.

All in all a very smooth experience and now I can simply use GitHub to manage the site (and spend my actual time adding more than just a single HTML page).


I've barely scratched the surface of Cloudflare Pages. My site is a single piece of HTML and doesn't use any cool parts of Jamstack. But with these smooth infrastructure I'm now free to work on the content without worrying about builds and deployment. I can even work locally and iterate on my machine, use Cloudflare Access to allow any collaborators to securely work with me, and I get privacy-preserving analytics. More about all that here.

If you're interested in reading more "Cloudflare's CTO tries out the company's own products" you might enjoy my journey deploying our "SSH terminal inside a browser" to connect to a Raspberry Pi 400.


Dennis Jackson said…
Please check out your copyright date: COPYRIGHT (C) 1997-19121 JGC

Popular posts from this blog

Making an old USB printer support Apple AirPrint using a Raspberry Pi

There are longer tutorials on how to connect a USB printer to a Raspberry Pi and make it accessible via AirPrint but here's the minimal one that's just a list of commands and simple instructions. 1. Install Raspbian on a SD card 2. Mount SD card on some machine and navigate to / . Add a file called ssh and set up wpa_supplicant.conf for WiFi access. Now you have headless and don't need a keyboard or monitor. 3. Boot. Login. sudo raspi-config . Change password. 4. Connect printer via USB cable 5. Then execute the following sequence of commands to set up CUPS and make it accessible on the network. sudo apt-get update sudo apt-get full-upgrade sudo apt-get install cups sudo usermod -a -G lpadmin pi sudo cupsctl --remote-any sudo systemctl restart cups 6. Visit http://raspberrypi:631/admin and add the local printer. Make sure "sharing" is enabled on the printer. 7. Then make sure AirPrint is set up sudo apt-get install avahi-daemon sudo reboot Printer should work

How to write a successful blog post

First, a quick clarification of 'successful'. In this instance, I mean a blog post that receives a large number of page views. For my, little blog the most successful post ever got almost 57,000 page views. Not a lot by some other standards, but I was pretty happy about it. Looking at the top 10 blog posts (by page views) on my site, I've tried to distill some wisdom about what made them successful. Your blog posting mileage may vary. 1. Avoid using the passive voice The Microsoft Word grammar checker has probably been telling you this for years, but the passive voice excludes the people involved in your blog post. And that includes you, the author, and the reader. By using personal pronouns like I, you and we, you will include the reader in your blog post. When I first started this blog I avoid using "I" because I thought I was being narcissistic. But we all like to read about other people, people help anchor a story in reality. Without people your bl

Your last name contains invalid characters

My last name is "Graham-Cumming". But here's a typical form response when I enter it: Does the web site have any idea how rude it is to claim that my last name contains invalid characters? Clearly not. What they actually meant is: our web site will not accept that hyphen in your last name. But do they say that? No, of course not. They decide to shove in my face the claim that there's something wrong with my name. There's nothing wrong with my name, just as there's nothing wrong with someone whose first name is Jean-Marie, or someone whose last name is O'Reilly. What is wrong is that way this is being handled. If the system can't cope with non-letters and spaces it needs to say that. How about the following error message: Our system is unable to process last names that contain non-letters, please replace them with spaces. Don't blame me for having a last name that your system doesn't like, whose fault is that? Saying "Your