ci

Author: jonmumm

.github/workflows/cloudflare-pages.yml

@@ -0,0 +1,41 @@
+name: Deploy to Cloudflare Pages
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      deployments: write
+    name: Deploy to Cloudflare Pages
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v3
+        with:
+          version: 8
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 18
+          cache: 'pnpm'
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Build site
+        run: pnpm build
+
+      - name: Deploy to Cloudflare Pages
+        # Make sure to set the correct project-name for your Cloudflare Pages project
+        run: npx wrangler pages deploy dist --project-name=actorkit-dev
+        env:
+          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+          CLOUDFLARE_ACCOUNT_ID: ${{ vars.CLOUDFLARE_ACCOUNT_ID }} 

README.md

@@ -62,7 +62,61 @@ This project is built with:
 
 ## How can I deploy this project?
 
-Simply open [Lovable](https://lovable.dev/projects/7a09674e-4dd6-4c5e-a577-cd08f955ec2f) and click on Share -> Publish.
+This project is configured for deployment to Cloudflare Pages.
+
+### Automatic Deployment with GitHub Actions
+
+A GitHub Actions workflow (`.github/workflows/cloudflare-pages.yml`) is set up to automatically build and deploy the application whenever changes are pushed to the `main` branch. 
+
+The workflow performs the following steps:
+
+1. Checks out the code
+2. Sets up Node.js and pnpm
+3. Installs dependencies
+4. Builds the application (`pnpm build`)
+5. Deploys the `dist` directory to Cloudflare Pages using `wrangler`
+
+To enable automatic deployments, you need to configure secrets and variables in your GitHub repository settings:
+
+1. Go to `Settings` > `Secrets and variables` > `Actions`.
+2. Add a repository secret named `CLOUDFLARE_API_TOKEN` containing your Cloudflare API token with Pages permissions.
+3. Add a repository variable named `CLOUDFLARE_ACCOUNT_ID` containing your Cloudflare account ID.
+
+Also, ensure the `--project-name` in the workflow file matches your Cloudflare Pages project name (`actorkit-dev`).
+
+#### Creating a Cloudflare API Token
+
+1. Go to the [Cloudflare dashboard](https://dash.cloudflare.com)
+2. Navigate to `My Profile` > `API Tokens`
+3. Click "Create Token"
+4. Use the "Edit Cloudflare Workers" template or create a custom token with `Account` > `Cloudflare Pages` > `Edit` permission.
+5. Set the Account Resources to include your account.
+6. Create the token and copy it.
+
+### Manual Deployment
+
+To deploy manually using `wrangler`:
+
+1. Ensure `wrangler` is installed (`pnpm install -D wrangler` or `npm install -D wrangler`).
+2. Log in to Cloudflare: `npx wrangler login`
+3. Build the application: `pnpm build`
+4. Deploy using the script: `pnpm cf:deploy` (Make sure the `--project-name` in `package.json` is set to `actorkit-dev`).
+
+### Setting Up a New Cloudflare Pages Project
+
+If you're setting up a new Cloudflare Pages project:
+
+1. Log in to your Cloudflare dashboard.
+2. Go to `Workers & Pages` > `Create application` > `Pages` > `Connect to Git` or `Upload assets`.
+3. If connecting to Git:
+    - Select your repository.
+    - Choose `Vite` as the framework preset.
+    - Ensure the `Build command` is `pnpm build` (or `npm run build`).
+    - Ensure the `Build output directory` is `dist`.
+    - Set Environment Variables (Production) for `NODE_VERSION` to `18` (or matching your workflow).
+4. If uploading assets:
+    - Build the project locally (`pnpm build`).
+    - Drag and drop the `dist` folder or use `wrangler` (`pnpm cf:deploy`).
 
 ## Can I connect a custom domain to my Lovable project?