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
- Log in to Cloudflare Dashboard
- Go to Workers & Pages > Create application
- Select Pages > Connect to Git
- 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:
- Go to your Pages project
- Settings > Environment variables
- 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.