Cloudflare Pages Deployment Guide

Summary

Deploy your Astro project to Cloudflare Pages for global edge performance

Content

Cloudflare Pages Deployment Guide

Cloudflare Pages offers instant deployments with global edge caching, making it an excellent choice for hosting Astro projects. In this guide, we’ll walk through the deployment process.

Prerequisites

Before deploying, ensure you have:

  • An Astro project ready to build
  • A Cloudflare account (free tier works perfectly)
  • Git repository (GitHub, GitLab, or Bitbucket)

Deployment Steps

1. Connect Your Repository

  1. Log in to Cloudflare Dashboard
  2. Go to Workers & Pages > Create application
  3. Select Pages > Connect to Git
  4. Choose your Git provider and repository

2. Configure Build Settings

In the build configuration:

  • Framework preset: Astro
  • Build command: npm run build
  • Build output directory: dist

3. Deploy

Click Save and Deploy. Cloudflare will:

  • Install dependencies
  • Run the build command
  • Deploy to global edge network

Benefits of Cloudflare Pages

  • Global CDN: Your site is served from 300+ locations
  • Automatic HTTPS: Free SSL certificates
  • Instant rollbacks: Quick deployment rollback
  • Preview deployments: Test changes before production
  • Free tier: 500 builds/month, unlimited bandwidth

Environment Variables

You can add environment variables in Cloudflare dashboard:

  1. Go to your Pages project
  2. Settings > Environment variables
  3. Add your variables

Conclusion

Deploying to Cloudflare Pages is straightforward and provides excellent performance for your Astro site. The free tier is generous, making it perfect for personal projects and small sites.