Cloudflare
How to Deploy Astro JS Project to Cloudflare
Cloudflare Pages is the recommended hosting option for the Blacks template — free forever, with unlimited bandwidth and a global CDN.
This guide walks you through deploying your Blacks project to Cloudflare Pages step by step.
Before you begin: Make sure your Blacks project is pushed to GitHub. Read how to push on GitHub →
Create Cloudflare Account
Go to cloudflare.com and create a new account. It’s free.
Workers and Pages
From your Cloudflare dashboard, click the Workers & Pages menu.
Create Application
Click Create application.
Then:
- Select Pages
- Click Connect to Git
Select GitHub Repo
Select your GitHub repository from the list. Click Next.
On the Framework setting, select Astro.
Then click Save and Deploy.
Finish — Your Site Is Live
Your website is now live at:
https://your-project.pages.devEvery future push to your Git repository triggers an automatic build and deploy.
Add Custom Domain
From your Cloudflare project dashboard:
- Click the Custom domains tab
- Click Set up a custom domain
- Enter your domain name
- Follow the DNS setup instructions
HTTPS is enabled automatically.
Build Settings Summary
| Setting | Value |
|---|---|
| Build command | npm run build |
| Build output directory | dist |
| Framework | Astro |
| Node version | 20 or newer |
Troubleshooting
| Problem | Solution |
|---|---|
| Build fails | Check that Node.js version is 20 or newer |
| 404 errors | Verify output directory is dist |
| Images not loading | Check site URL in astro.config.mjs |
| Custom domain not working | Wait for DNS propagation (5–30 minutes) |
Next Step
Explore other hosting options:
👉 Netlify — alternative static host with drag-and-drop deploy