Deploy to Cloudflare

This guide will show you how to deploy a React application to Cloudflare Pages and a Cloudflare Worker using FluentCI.

Before you begin

• Have your React project ready.
• Have a Cloudflare account.
• Have a Cloudflare Pages project set up.
• Have a Cloudflare Worker set up.

Using the Cloudflare Plugin

You can use FluentCI to deploy your React application to Cloudflare Pages and a Cloudflare Worker using the cloudflare plugin, no need to install Cloudflare Wrangler CLI or Node.js on your machine, FluentCI will handle everything for you.

The following commands can be used to deploy your React application to Cloudflare Pages:

 fluentci run --wasm bun run build
 fluentci run --wasm cloudflare pages_deploy dist --project-name $PROJECT_NAME
 # to deploy a Cloudflare Worker, set CLOUDFLARE_API_TOKEN and CLOUDFLARE_ACCOUNT_ID
 # in your environment variables and run:
 fluentci run --wasm cloudflare deploy

CI/CD pipeline integrations

The following examples show how to integrate FluentCI with popular CI providers to deploy your applications to Cloudflare Pages and a Cloudflare Worker:

Github Actions

ci.yml

name: ci
on:
  push:
    branches:
      - main
jobs:
  tasks:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Setup Fluent CI
        uses: fluentci-io/setup-fluentci@v5
      - name: deploy
        run: fluentci run --wasm cloudflare deploy
        env:
          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
      

GitLab CI

.gitlab-ci.yml

.docker:
  image: denoland/deno:debian-1.42.4
  services:
    - docker:${DOCKER_VERSION}-dind
  variables:
    DOCKER_HOST: tcp://docker:2376
    DOCKER_TLS_VERIFY: "1"
    DOCKER_TLS_CERTDIR: /certs
    DOCKER_CERT_PATH: /certs/client
    DOCKER_DRIVER: overlay2
    DOCKER_VERSION: 20.10.16
    GITLAB_ACCESS_TOKEN: $GITLAB_ACCESS_TOKEN
    CLOUDFLARE_API_TOKEN: $CLOUDFLARE_API_TOKEN
    CLOUDFLARE_ACCOUNT_ID: $CLOUDFLARE_ACCOUNT_ID
.fluentci:
  extends: .docker
  before_script:
    - apt-get update
    - apt-get install -y curl tar gzip ca-certificates openssl git unzip libncursesw6
    - deno install -A -r https://cli.fluentci.io -n fluentci
    - fluentci --version
    - curl -L https://dl.dagger.io/dagger/install.sh | DAGGER_VERSION=0.12.3 sh
    - mv bin/dagger /usr/local/bin
    - dagger version
deploy:
  extends: .fluentci
  script:
    - fluentci run --wasm cloudflare deploy

Circle CI

.circleci/config.yml

version: 2.1
jobs:
  job:
    steps:
      - checkout
      - run: |
          sudo apt-get update && sudo apt-get install -y curl unzip
          curl -fsSL https://cli.fluentci.io | bash
          fluentci --version
        name: Setup FluentCI
      - run: fluentci run --wasm cloudflare deploy
        name: deploy
    machine:
      image: ubuntu-2004:2023.07.1
workflows:
  fluentci:
    jobs:
      - job
      

Azure Pipelines

azure-pipelines.yml

trigger:
  - main
pool:
  vmImage: ubuntu-latest
steps:
  - script: |
      curl -fsSL https://cli.fluentci.io | bash
      fluentci --version
      echo "##vso[task.prependpath]${HOME}/.deno/bin
    displayName: Setup FluentCI
  - script: fluentci run --wasm cloudflare deploy
    displayName: deploy
    

AWS CodePipeline

buildspec.yml

version: 0.2
phases:
  install:
    commands:
      - curl -fsSL https://cli.fluentci.io | bash
      - fluentci --version
  build:
    commands:
      - fluentci run --wasm cloudflare deploy
  post_build:
    commands:
      - echo Build completed on `date`