Cloudflare

Switch to the Cloudflare Branch

Clone the repository and switch to the cloudflare branch:

git clone <your-repository-url>
cd <your-project-name>
git checkout cloudflare

Do not use the main branch, it is not compatible with Cloudflare Workers platform.

Install Dependencies

Install all required dependencies including Wrangler CLI:

pnpm install

This will install all dependencies including the Wrangler CLI tool needed for Cloudflare Workers deployment.

Set up PostgreSQL Database

If you're using the default PostgreSQL database configuration, you'll need to set up a PostgreSQL database.

• For production, you can use the Hosted PostgreSQL Database, like Neon or Supabase.
• For local development, refer to the Database Guide for creating a local PostgreSQL instance.

Once you have your PostgreSQL database ready, note down the connection string in this format:

postgres://user:password@HOSTNAME_OR_IP_ADDRESS:PORT/database_name

Configure Hyperdrive Binding

Hyperdrive accelerates database queries by pooling connections and caching requests. Create a Hyperdrive configuration for your production database:

npx wrangler hyperdrive create <NAME_OF_HYPERDRIVE_CONFIG> --connection-string="postgres://user:password@HOSTNAME_OR_IP_ADDRESS:PORT/database_name"

Replace the connection string with your actual PostgreSQL connection details. After successful creation, you'll receive a Hyperdrive ID that you can also view in your Cloudflare Dashboard.

Update the wrangler.jsonc file with your Hyperdrive ID:

{
  "hyperdrive": [
    {
      "binding": "HYPERDRIVE",
      "id": "YOUR_HYPERDRIVE_ID_HERE"
    }
  ]
}

Configure Local Development Database

For local development, update the wrangler.jsonc file with your local PostgreSQL connection string:

{
  "hyperdrive": [
    {
      "binding": "HYPERDRIVE",
      "id": "YOUR_HYPERDRIVE_ID_HERE",
      "localConnectionString": "postgres://user:password@localhost:5432/your_local_database"
    }
  ]
}

Replace the localConnectionString with your actual local database connection string.

Configure Environment Variables

Set up your environment variables for both development and production:

1. For development: Copy the example files and configure them

   cp .env.example .env
   cp dev.vars.example .dev.vars

2. Configure variables: Follow the Environment Setup Guide to set up all required environment variables in .env files, and leave .dev.vars as it is for now.

Generate types

After configuring .env and wrangler.jsonc files, generate Cloudflare-specific types:

pnpm run cf-types

This command will automatically generate the cloudflare-env.d.ts file containing type definitions for the Cloudflare Worker runtime environment.

Create a Cloudflare Worker Project

1. Go to the Cloudflare Dashboard
2. Navigate to Compute(Workers) → Workers and Pages → Create → Import a repository
3. Select your repository and choose the cloudflare branch
4. Configure the build settings:
   • Name: keep the name the same as the name in wrangler.jsonc file
   • Build command: Leave empty
   • Deploy command: pnpm run deploy
   • Root directory: Leave as default

Configure Environment Variables in Cloudflare

In your Cloudflare Worker project settings, configure environment variables:

1. Build Environment Variables: Add all variables from your .env file
2. Runtime Environment Variables: Add all variables from your .env file again

Deploy Your Application

You can deploy your application in two ways:

Option 1: Automatic Deployment

• Push your changes to the cloudflare branch
• Cloudflare will automatically trigger a build and deployment

Option 2: Manual Deployment

• Deploy directly from your local machine:

  pnpm run deploy

Set up custom domains

After successful deployment, your application will be available at auto-generated domain. You can:

• Set up custom domains, and Cloudflare will automatically create the DNS records for you
• Monitor your application in the Cloudflare Dashboard, like the Traffic and Logs