About

This guide assumes that you're already familiar with using Cloudflare Pages and the Wrangler CLI. Please refer the official Cloudflare Pages documentation for more info.

Getting Started

To get started you will need to first create a new Cloudflare Pages project.

shell

$ wrangler pages project create PROJECT_NAME

This will create a new Cloudflare Pages project that you can deploy to, which can be done in two different ways.

2. Use GitHub Actions

This method uses GitHub Actions to build the site and then uploads the output to Cloudflare Pages (instead of GitHub Pages).

This section assumes that you're already familiar with GitHub Actions. Please refer the official GitHub Actions documentation for more info.

GitHub Actions runner have an inherent overhead and, since Zine is a collection of tools that gets compiled on-demand, your runner will need to do some work that wounldn't be necessary with a single-executable tool.

Luckly, the build will be cached automatically by using mlugg/setup-zig.

This site currently builds in 25-35 seconds, of which 12 are spent setting up Zig, and 2 for the actual site build (the rest is GitHub Pages overhead).

Once we have created our Cloudflare Pages project, we will need a few things from Cloudflare:

• Your Cloudflare Account ID
• An API Token
• The project name created in the previous command

Replace ACCOUNT_ID with your Cloudflare Account ID and add your API key as a GitHub Actions secret. In the example below, this would be set to CLOUDFLARE_API_TOKEN.

.github/workflows/cf-pages.yml

name: cloudflare pages

on:
  push:
    branches:
      - main  # Set a branch to deploy
jobs:
  deploy:
    runs-on: ubuntu-20.04
    steps:
      - uses: actions/checkout@v4
        with:
          fetch-depth: 0  # Change if you need git info

      - name: Setup Zig
        uses: mlugg/setup-zig@v1
        with:
          version: 0.13.0
          
      - name: Build
        run: zig build --summary new
          
      - name: Deploy
        uses: cloudflare/pages-action@v1
        with:
          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
          accountId: ACCOUNT_ID
          projectName: PROJECT_NAME
          directory: ./zig-out
          # Optional: Adds GitHub deployments support
          githubToken: ${{ secrets.GITHUB_TOKEN }}
          

2. Build locally and deploy directly with wrangler

To publish from your computer you will need fist to build your Zine site, and then upload the output to Cloudflare Pages using wrangler.

shell

$ zig build 
$ wrangler pages deploy ./zig-out --project-name PROJECT_NAME