Cloudflare Free Tier Textbook

This guide explains how to build, deploy, and operate a full site on Cloudflare’s free offerings that do not expire. Use it as a hands-on textbook: every section ties back to a live example on this site.

Cloudflare Pages: static sites

• What it is: Global static hosting for HTML, CSS, JS, and assets.
• How this site uses it: Root files like /index.html, /styles.css, and /assets/ are served statically.
• Redirects: Configure in /_redirects. Try /old-path → /docs.
• Headers: Configure in /_headers for cache/security headers.
• Custom errors: Add /404.html and /500.html.
• Custom domains: Map your domain and manage DNS with Cloudflare (free).

Pages Functions: serverless on the edge

Pages Functions run Cloudflare Workers next to your static site.

• Examples in this repo: /api/time (JSON), /hello/:name (dynamic text).
• Middleware: functions/_middleware.js adds x-request-id to responses.
• Bindings: You can bind services such as KV, D1, R2, Queues, and environment variables to Pages Functions.
• Local dev: npm run dev serves both static content and functions.

DNS and CDN (Free)

• Managed DNS: Host your domain’s DNS at Cloudflare.
• Global CDN: Cache static assets near users worldwide.
• Universal SSL: Automatic TLS certificates for your domains.
• HTTP/2 and HTTP/3: Modern protocols enabled by default.
• Brotli compression: Smaller downloads for text assets.

Security on Free

• DDoS mitigation: Network-layer protection included.
• Rate limiting, firewall rules: Available with varying capabilities across plans; start with basic rules and upgrade as needed.
• Always use HTTPS: Enforce TLS and HSTS at the edge.

Workers Free plan

Pages Functions are powered by Workers. The free plan is generous for learning and prototypes.

• Use cases: APIs, middleware, SSR, request transforms, scheduled tasks.
• Durable Objects: Coordinated state (available with usage-based pricing; evaluate costs before production).
• CRON triggers: Run scheduled jobs at the edge.

Quota details change over time; consult Cloudflare docs for current limits and pricing.

Data services often used with free setups

• KV: Low-latency key-value storage for config and caches.
• D1: SQLite-compatible database for relational needs.
• R2: Object storage; store and serve large files without egress fees to Cloudflare products.
• Queues: Background work and decoupled processing.
• AI Gateway / Vectorize: Edge AI integrations; check free allowances and pricing.

Many of these are pay-as-you-go with generous free allowances. Bindings can be added to Pages Functions for seamless access.

Analytics and Email (Free)

• Web Analytics: Privacy-first site analytics without third-party scripts or cookies.
• Email Routing: Receive mail for your domain and forward to inboxes you control.

Zero Trust (Free plan)

Secure access to internal apps, tunnels, and SaaS with the Zero Trust free plan (suitable for individuals and small teams). Protect admin interfaces, add identity providers, and enforce device/browser checks.

Automation: edit and deploy with one command

1. Edit files in this repo (e.g., update /index.html).
2. Set environment variables: CLOUDFLARE_ACCOUNT_ID, CLOUDFLARE_API_TOKEN, CF_PAGES_PROJECT.
3. Run npm run deploy. This uses direct upload and requires no prompts.
4. Optional: set CF_PAGES_BRANCH for preview deployments.

Alternatively, connect GitHub and use the included action to auto-deploy on push or pull request.

Reference architecture on Free

• Front-end: Pages static assets.
• Edge logic: Pages Functions (Workers) for API, auth, routing, and SSR.
• State: KV for config/cache; D1 for relational data; R2 for files.
• Async: Queues for background jobs.
• Security: Free CDN + TLS + basic firewall; Zero Trust for admin areas.
• Observability: Web Analytics and Worker logs.

Practical checklist

• Point your domain to Cloudflare DNS.
• Attach the domain to your Pages project.
• Set caching/security headers in /_headers.
• Add redirects in /_redirects.
• Create functions in /functions and add middleware.
• Bind KV/D1/R2 as needed; keep secrets in environment variables.
• Automate deploys via direct upload or GitHub Actions.

Note: Capabilities and quotas evolve. For precise, current limits and pricing, consult the official Cloudflare documentation.

← Back to demo