I have been using the following techniques to deploy my (this) website automatically from GitHub to Cloudflare Pages for a few years now. The best part is that you can have all this for free; of course, you still need to pay for a domain, nothing is 100% free in life, right?

Before we start, I’d like to clarify that this will not be a step-by-step guide on creating a pipeline to deploy your website. Instead, I will list the tools I use and explain how they work together to host and deliver the website with impressive speeds in a serverless manner.

Framework

First, let’s talk about the framework. I use Hugo, one of the world’s fastest frameworks for building websites. It’s a static site generator that reads content written in Markdown and generates static HTML files. If you want to learn more about Hugo, check out their documentation.

I’m using HUGO (gohugo.io). It is one of the world’s fastest frameworks for building websites. If you go check their docs you will find all features and possibilities, but for me, it is just a static site generator.

If you want to test: gohugo.io/installation

There are several other static site generators out there, so if Hugo doesn’t suit you, I’m sure you can find one that does.

Versioning

Next up is versioning. I use Github to keep my code in the cloud.

We could stop here because there is a way to host your static website using Github Pages. You can even use your own domain! How cool is that? Follow the link and I bet you that with a small amount of time and a few Google searches, you will get everything working.

But that’s not our case. Using Github Pages your website will load fast. Of course, it is a static website, but we can make it even faster and add a whole layer of security and a lot of cool resources to it.

Hosting

Finally, let’s discuss hosting. I use Cloudflare, a company known for its amazing services. Even with their free plan, you get hosting, fast delivery, SSL certificates, security, protection layers, reports and more.

To use Cloudflare, you need to move or point your domain’s DNS to their infrastructure. Once configured, check out the Cloudflare Pages documentation page and the Git Integration page.

Once your Cloudflare Pages is set up and integrated with your GitHub repository, every time you push new content to your repo, Cloudflare will fetch the new code, build the website using Hugo, and deploy it to their global network.

Mind Blowing right?

I hope you can use this information to bring your website online.

See you on the next one!