Complete step-by-step guide to hosting this Fumadocs documentation site on Cloudflare Pages with zero server cost

Deploying to Cloudflare Pages

This Fumadocs documentation site is configured with Next.js Static Export (output: 'export'), which generates pure pre-rendered HTML, CSS, JavaScript, and static PDF assets into the ./out directory upon running npm run build.

This is the optimal architecture for Cloudflare Pages:

🚀 Lightning Fast Edge Delivery: Assets are served from Cloudflare's global anycast network across 300+ cities.
💰 100% Free Tier: Unlimited bandwidth and zero server or compute costs.
🔒 Zero Cold Starts: Static files are served immediately with automated HTTP/3 and TLS.

Method 1: Git Integration (Recommended)

When you connect your GitHub repository to Cloudflare Pages, every git push automatically triggers a production build and deployment.

Push Your Code to GitHub

Commit and push your project to a GitHub repository:

git add .
git commit -m "feat: complete fumadocs dbms site"
git push origin main

Create a Cloudflare Pages Project

Log in to the Cloudflare Dashboard.
In the left navigation, select Workers & Pages -> Create application -> Pages.
Click Connect to Git and select your repository.

Configure Build Settings

Enter the following settings in the deployment modal:

Setting	Configuration Value
Framework Preset	`None` (or `Next.js (Static Export)`)
Build Command	`npm run build`
Build Output Directory	`out`
Root Directory	`fumadocs` (if your repo root contains the `fumadocs/` folder)

Set Node.js Version Environment Variable

Next.js 16 requires Node.js version 20 or higher. Under Environment variables (advanced), add:

Variable name: NODE_VERSION
Value: 20.18.0

(Note: The project already includes .node-version set to 20.18.0 which Cloudflare Pages recognizes automatically).

Deploy!

Click Save and Deploy. Cloudflare will build the site in roughly 60 seconds and assign you a free *.pages.dev production URL!

Method 2: Direct CLI Deployment via Wrangler

If you prefer to deploy directly from your local terminal without connecting GitHub:

Build the Production Static Bundle

Inside the fumadocs directory, run:

npm run build

This verifies TypeScript types, compiles all MDX pages, and outputs static files to the ./out directory.

Deploy with Wrangler

Run the Wrangler deployment command:

npx wrangler pages deploy out --project-name=dbms-course-docs

On first run, Wrangler will prompt you to authenticate with your Cloudflare account in the browser, upload your static files and PDFs, and provide an instant live URL.

Verifying PDF Attachments on Cloudflare

All 17 course PDFs are copied into public/materials/ and deployed to out/materials/. Once your site is live on Cloudflare, you can test direct access:

https://<your-project>.pages.dev/materials/lecture01.pdf
https://<your-project>.pages.dev/materials/lab02.pdf

Cloudflare's CDN will automatically cache and serve these PDF files with high-speed HTTP range requests for in-browser viewing.

Deploying to Cloudflare Pages

On this page