kb

Introduction

Create the workflow file .github/workflows/deploy.yml.

React App workflow

name: Build and Deploy

on:
  push:
    branches: [main]                            # branch name

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout Repository
        uses: actions/checkout@v6

      - name: Install pnpm
        uses: pnpm/action-setup@v4

      - name: Set up Node.js
        uses: actions/setup-node@v6
        with:
          node-version-file: 'package.json'
          cache: 'pnpm'

      - name: Install Dependencies
        run: pnpm install --frozen-lockfile

      - name: Build Project
        run: pnpm run build                     # This generates the dist folder

      - name: Copy Dist to VPS
        uses: appleboy/scp-action@master
        with:
          port: 22                              # SSH port
          source: "dist/*"                      # Path to the dist files
          host: ${{ secrets.VPS_IP }}           # Your VPS IP
          username: ${{ secrets.VPS_USERNAME }} # Your VPS username
          key: ${{ secrets.VPS_PRIVATE_KEY }}   # Your SSH private key
          target: ${{ secrets.VPS_APP_DIR }}    # Destination on your VPS
          strip_components: 1