I'm so excited because I was waiting for this a long time: Cloudflare pages. Check it out on https://pages.cloudflare.com/ - In this post I go over on how you are reading this post from Cloudflare pages! (Yes, I instantly moved to Cloudflare!)

A little intro from their website:

Cloudflare Pages is a JAMstack platform for frontend developers to collaborate and deploy websites. With Pages, just install the GitHub app onto your repo. After that, it’s just git push — we’ll build and deploy for you.

Why is this awesome?

Because I do not want to bother with all kinds of configuration stuff for a simple JAMstack website. Yes, I can use S3 at AWS and enable 'web', but that's not the same. I'll be missing SSL. Which is pretty decent to add, but it requires work. I also might want some basic redirect and I also have to actually place it on S3. Again not a big deal, but it's work and I'm lazy.

My 'old' stack consists of a ci/cd job to deploy to S3. Then I had cloudfront set up in order to get cache and deal with some redirects. I also had 2 lambda's to deal with directories that ended in a / to get properly parsed. Then I also had to use cloudflare because my domain provider did not support CNAMES to domains (E.g. 'sysrant.com CNAME -> my-app.cloudfront.com).

It worked, it was fine.. but this is better.

Pricing

I think the pricing standpoint is really strong here. The free tier has:

• 1 build at a time
• 500 builds per month
• Unlimited sites
• Unlimited requests
• Unlimited bandwidth

I think this is awesome because most providers will limit you on both builds per month AND the amount of website you run/host. 500 builds per month is quite a lot. Unless you made 100 mistakes on your release, it means 500 new releases to production. I hardly do that in my professional work.

For 20$ a month you will get 5 concurrent builds with a 5000 build limit. For 200$ a month this is upgraded to 20 concurrent build and 20000 builds per month.

Your github repository

What you need is a GitHub repository. This can be public or private, it does not matter. Next we are placing our application into this repository. Personally I use Hugo: https://github.com/gohugoio/hugo

For reference my setup (and awesome commit messages)

Create a pages project

Now we can go to Cloudflare and add a project. Login with your GitHub account and give access to either a specific repository or all repositories. Now you can select a repository that you want to turn into a website!

And press "Begin setup"

In this stage we can select a project name. This name will also be used as a prefix for the domain pages.dev. For example: my-awesome-project.pages.dev. We can use this domain to preview deployments.

Also you can select the branch name that you want to use as production environment (often your main branch)

Setting up Cloudflare pages framework build command

In the Framework Preset we pick Hugo and this will fill in hugo as build command (which is fine). It also uses /public as the build output directory, which is also fine.

Changing Hugo version on Cloudflare pages

Now comes a little tricky step that is, as the moment I'm writing this, not explained in the documentation: Setting the Hugo version.

If we do not alter the Hugo version, we end up with Hugo 0.54 which is from early 2019. In other words: out of date and BAD.

We can fix this by clicking on Environment variables (advanced) and adding a environment variable: HUGO_VERSION with a value that is equal to any release version. You can find those here: https://github.com/gohugoio/hugo/releases

As I'm not fan of using 'latest', I picked version 0.80.0 - It really has to be exactly that version naming. Using 0.80 won't work!

Almost done

Press save and deploy and you are (almost) good to go!

Next we can add a custom domain

If your domain is already at Cloudflare, it will automatically change your DNS by adding a CNAME. Otherwise you can copy the value and do this yourself at your own domain provider.

Notes

Be aware that Cloudlfare pages is still beta or just out of beta (bit hard to actually find what it is now). Nonetheless I believe even a beta version at Cloudflare wins over a lot of different products/solutions ;)

Personally I'm really happy with this solution. It is really easy, free and it saves me a lot of configuration stuff.