Workers for Platforms Template

Build a website builder platform where users can create and deploy websites with static assets and custom domains using Cloudflare Workers for Platforms.

Features

✅ Visual Website Builder: User-friendly interface for creating websites

✅ Static Asset Upload: Upload HTML, CSS, images, and other static files

✅ Subdomain Routing: Automatic project.yourdomain.com routing

✅ Multi-tenant Isolation: Each project runs in its own isolated worker

✅ D1 Database: Fast project storage and management

✅ Real-time Deployment: Instant website deployment

Setup

1. Clone and Install

git clone https://github.com/dinasaur404/workers-platform-template.git
cd workers-platform-template
npm install

2. Create Database

Create a D1 database to store project data:

npx wrangler d1 create workers-platform-template

Copy the database ID and update wrangler.toml:

database_id = "your-database-id-here"

3. Create Dispatch Namespace

Create a dispatch namespace for deploying user scripts:

npx wrangler dispatch-namespace create workers-platform-template

4. Configure Basic Settings

Update these values in wrangler.toml:

[vars]
DISPATCH_NAMESPACE_NAME = "workers-platform-template"
ACCOUNT_ID = "your-account-id"  # Get from Cloudflare dashboard sidebar

# Optional: For custom domain support, uncomment:
# BUILDER_DOMAIN = "build.yourdomain.com"
# APPS_DOMAIN = "yourdomain.com"

5. Create API Tokens

Dispatch Token — Used to deploy user websites to your Workers for Platforms namespace:

1. Go to Cloudflare API Tokens
2. Create token with permissions: Account:Workers Scripts:Edit
3. Set as secret: echo "your-token" | wrangler secret put DISPATCH_NAMESPACE_API_TOKEN

Custom Hostnames Token (Optional) — Used to automatically setup SSL for user domains via Custom Hostnames:

1. Create token with permissions: Zone:Custom Hostnames:Edit + Zone:Zone:Read
2. Set as secret: echo "your-token" | wrangler secret put CLOUDFLARE_API_TOKEN

6. Deploy

npx wrangler deploy

7. Initialize Database

Visit your worker URL and add /init to setup the database:

https://your-worker.workers.dev/init

This creates the projects table with fields for storing project data and static asset information.

Custom Domain Setup (Optional)

If you want branded URLs like build.yourdomain.com instead of your-worker.workers.dev:

1. Configure Domain

Uncomment and update in wrangler.toml:

[vars]
BUILDER_DOMAIN = "build.yourdomain.com"  # Builder interface
APPS_DOMAIN = "yourdomain.com"           # Base for *.yourdomain.com

# Also uncomment routes section:
routes = [
  { pattern = "build.yourdomain.com", zone_name = "yourdomain.com", custom_domain = true },
  { pattern = "*.yourdomain.com/*", zone_name = "yourdomain.com" }
]

2. Add DNS Records

In your Cloudflare DNS dashboard:

• build.yourdomain.com → Your worker
• *.yourdomain.com → Your worker (wildcard for user subdomains)

3. Custom Hostnames (Optional)

Your users can then connect their own domains which will automatically get SSL certificates via Cloudflare for SaaS Custom Hostnames.

Local Development

Create .dev.vars file:

DISPATCH_NAMESPACE_API_TOKEN=your-dispatch-token
CLOUDFLARE_API_TOKEN=your-cloudflare-token

Run locally:

npx wrangler dev --remote

How It Works

• Builder: Visit the root URL to create websites with static assets
• Asset Upload: Upload folders of HTML, CSS, images, and other static files
• User Sites: Each project gets a subdomain like projectname.yourdomain.com
• Asset Serving: Static files are served via env.ASSETS binding with automatic caching
• Custom Domains: Users can connect their own domains with automatic SSL
• Multi-tenant: Each user's code runs in isolation using Workers for Platforms

Static Assets

The platform supports uploading static assets using Cloudflare's Workers Assets API:

1. Select a folder containing your static files (HTML, CSS, images, etc.)
2. Files are uploaded and deployed with your worker
3. Access assets via env.ASSETS.fetch() in your worker code
4. Asset paths are stored in the database for reference

Admin

Visit /admin to see all projects and debug issues.

⚠️ Security: Protect Admin Access

IMPORTANT: The admin page exposes sensitive database and infrastructure information. For production deployments, protect it with Cloudflare Access:

1. Create Access Application:

   • Go to Cloudflare Zero Trust dashboard → Access → Applications
   • Create Self-hosted application
   • Application domain: yourdomain.com/admin*

2. Configure Access Policy:

   • Policy name: Admin Access
   • Action: Allow
   • Include rule: Emails → Add your email address

This ensures only authorized users can access admin functionality while keeping the rest of your platform public.

Troubleshooting

"Dispatch namespace not found": Check your API token has Workers Scripts:Edit permission and the namespace exists

"Custom domain not working": Verify your Custom Hostnames API token permissions and DNS records

Database errors: Visit /init to reset the database (WARNING: This deletes all projects)

Asset upload issues: Check that files are properly base64-encoded and manifest hashes match

Debug logs: Run npx wrangler tail to see real-time logs and deployment details

License

This project is licensed under CC0 1.0 Universal (CC0 1.0) Public Domain Dedication.

You can copy, modify, distribute and perform the work, even for commercial purposes, all without asking permission.