Why Cloudflare Pages?
Cloudflare Pages offers unlimited bandwidth, free SSL, and a global CDN — a perfect match for a static blog. Combined with Next.js's static export, you get a fast, cost-effective setup.
Setup
Install the adapter:
npm install @cloudflare/next-on-pages
npm install -D wrangler
Add to next.config.mjs:
const nextConfig = {
output: 'export',
images: { unoptimized: true },
trailingSlash: true,
}
export default nextConfig
Project Structure
Keep your Markdown content under /content/{category}/:
content/
tech/
getting-started.md
life/
hello-world.md
Each file has a YAML front matter block for metadata, and the directory name becomes the category.
Front Matter Fields
| Field | Required | Description |
|---|---|---|
title | ✓ | Post title |
date | ✓ | ISO 8601 date |
summary | — | Short description |
tags | — | Array of strings |
draft | — | Hide from listing |
Deploying
npm run pages:build
wrangler pages deploy
That's it. Your blog is live on the edge.
Performance Tips
- Keep images under
/public/or use an external CDN - The search index is pre-built JSON — no backend required
- All pages are statically generated at build time