Web deployment

Deploying Privatefolio on the web involves hosting the build output of the @privatefolio/frontend package.

Build

Once you setup the project and its prerequisites, you can build the frontend.

yarn build
# output dir: packages/frontend/build

Deploy

with `serve`

npx serve -p 8080 -C packages/frontend/build

with Cloudflare Pages

yarn wrangler pages deploy packages/frontend/build --project-name=privatefolio

Official deployment

We are currently deploying to Cloudflare Pages through a GitHub Actions workflow. This deployment system provides continuous deployment for all branches and pull requests, with Discord notifications for deployment status updates.

Production deployment URL: https://privatefolio.app
Preview deployments URLs: https://<deployment-id>.privatefolio-com.pages.dev
See latest deployments at: github.com/privatefolio/privatefolio/deployments

Workflow file

.github/workflows/publish-web-app.yml

name: Publish web app
 
on:
  push:
    branches: ["*"]
  pull_request:
    branches: ["*"]
 
  workflow_dispatch: # Allows you to run this workflow manually from the Actions tab
 
permissions:
  contents: read
  deployments: write
 
jobs:
  build-and-deploy:
    if: (!startsWith(github.ref_name, 'dependabot/')) && (github.head_ref == '' || !startsWith(github.head_ref, 'dependabot/'))
    runs-on: ubuntu-latest
    steps:
      - name: Checkout code
        uses: actions/checkout@v4
 
      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: 20.x
 
      - name: Cache yarn downloads
        id: cache
        uses: actions/cache@v4
        with:
          path: ~/.cache/yarn/v6
          key: yarn-cache-${{ runner.os }}-${{ hashFiles('./yarn.lock') }}
          restore-keys: yarn-cache-${{ runner.os }}-
 
      - name: Cache node_modules (root)
        uses: actions/cache@v4
        with:
          path: ./node_modules
          key: deps-root-${{ runner.os }}-${{ hashFiles('./yarn.lock') }}
          restore-keys: deps-root-${{ runner.os }}-
 
      - name: Cache node_modules (packages)
        uses: actions/cache@v4
        with:
          path: ./packages/**/node_modules
          key: deps-packages-${{ runner.os }}-${{ hashFiles('./yarn.lock') }}
          restore-keys: deps-packages-${{ runner.os }}-
 
      - name: Setup Bun
        uses: oven-sh/setup-bun@v2
 
      - name: Install dependencies
        run: yarn install --frozen-lockfile
 
      - name: Build
        run: yarn build
 
      - name: Publish to Cloudflare Pages
        id: publish
        uses: cloudflare/wrangler-action@v3
        with:
          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
          accountId: 16ff1fe0e50ed7ac57810a024341b0a3
          command: pages deploy packages/frontend/build --project-name=privatefolio
          gitHubToken: ${{ secrets.GITHUB_TOKEN }}
 
      - name: Notify Discord on success
        if: success()
        uses: sarisia/actions-status-discord@v1
        with:
          webhook: ${{ secrets.DISCORD_DEPLOYMENTS_WEBHOOK }}
          status: "Success"
          title: "Publish web app"
          description: |
            **Branch**: `${{ github.ref_name }}`
            **Commit**: `${{ github.sha }}`
          color: 0x00FF00
 
      - name: Notify Discord on failure
        if: failure()
        uses: sarisia/actions-status-discord@v1
        with:
          webhook: ${{ secrets.DISCORD_DEPLOYMENTS_WEBHOOK }}
          status: "Failure"
          title: "Publish web app"
          description: |
            **Branch**: `${{ github.ref_name }}`
            **Commit**: `${{ github.sha }}`
          color: 0xFF0000