Skip to content

How to Host Your Static Website for Free with Cloudflare Pages

Cloudflare landing page cover image

TL;DR

This blog post provides a step-by-step guide on how to use Cloudflare Pages to host your static website - React, Vue, Angular, Svelte, Hugo, etc. for free. Cloudflare Pages is a cloud-based service that provides a user-friendly interface to deploy and manage your website. The post also compares Cloudflare Pages with Netlify, another popular static website hosting service, highlighting the differences in pricing, features, and ease of use.

Introduction

If you're looking for a free and easy way to host your static website, Cloudflare Pages is a great option to consider. In this blog post, we'll take a closer look at what Cloudflare Pages has to offer and how to use it to host your website. We'll also compare Cloudflare Pages to Netlify, another popular static website hosting service.

What is Cloudflare Pages?

Cloudflare Pages is a cloud-based service that allows you to easily host your static website on the Cloudflare network. Cloudflare Pages provides a simple, user-friendly interface that makes it easy to deploy and manage your website.

One of the key benefits of using Cloudflare Pages is that it's completely free to use. You can host up to 500 builds per month for free, which should be more than enough for most personal websites or small business websites.

Cloudflare generous pricing

How to Use Cloudflare Pages to Host Your Website

To get started with Cloudflare Pages, you'll first need to create a Cloudflare account if you don't already have one. The following four steps assume you are using a git provider, if not you can always use the direct upload feature. Once you've created an account, follow these steps to host your website:

Step 1: Create a new site To create a new site, click the "Create a site" button on the Cloudflare Pages dashboard. You'll be prompted to choose a Git provider and repository. Cloudflare Pages supports several Git providers, including GitHub, GitLab, and Bitbucket.

Cloudflare setup step #1

Step 2: Configure your build settings Once you've connected your Git repository, you'll need to configure your build settings. This will involve specifying your build command and output directory. If you're using a popular static site generator like Jekyll or Hugo, Cloudflare Pages will automatically detect your build settings and configure them for you.

Cloudflare setup step #1

Step 3: Deploy your site Once you've configured your build settings, you can deploy your site by clicking the "Deploy site" button. Cloudflare Pages will automatically build your site and deploy it to the Cloudflare network.

Step 4: Set up custom domains If you want to use a custom domain for your website, you can set it up in the Cloudflare Pages settings. Cloudflare Pages provides step-by-step instructions for configuring your domain settings.

For advanced setup checkout the official documentation.

Cloudflare Pages vs. Netlify

Netlify is another popular static website hosting service that you may have heard of. Both Cloudflare Pages and Netlify offer similar features and benefits, but there are a few key differences to keep in mind.

Pricing

Both Cloudflare Pages and Netlify offer free plans, but there are some differences in what's included. Cloudflare Pages allows up to 500 builds per month for free, while Netlify allows unlimited builds on their free plan. However, Netlify's free plan only includes basic build minutes and bandwidth, while Cloudflare Pages offers unlimited build minutes and bandwidth on their free plan.

Features

Cloudflare Pages and Netlify offer similar features, such as custom domains, SSL/TLS certificates, and automatic builds and deploys. However, Cloudflare Pages has some unique features that Netlify doesn't offer, such as Workers KV and serverless functions.

Ease of use

Both Cloudflare Pages and Netlify provide a simple and user-friendly interface for managing your website. However, Cloudflare Pages has a slightly more streamlined setup process, making it a bit easier to get started with.

Conclusion

Cloudflare Pages is a great option for anyone looking for a free and easy way to host their static website. With its user-friendly interface and unlimited build minutes and bandwidth on the free plan, Cloudflare Pages provides a compelling alternative to other popular hosting services like Netlify. If you're in the market for a static website hosting service, give Cloudflare Pages a try and see if it's right for you.