Publishing Your React.js App on cPanel with GitHub Actions

Please following this step:

  • emove the “dist” and “build” folders from the .gitignore file.
  • You need to create an FTP account from your cPanel host and add it to the secrets of your repository. Add the CPANEL_HOST, CPANEL_USERNAME, and CPANEL_PASSWORD to the secrets of your repository.

  • Create a deploy.yml file in the “.github/workflows” directory and paste the following code into it:
name: Build and Upload to cPanel

on:
   push:
      branches:
         - main

jobs:
   build-and-deploy:
      name: Build and Deploy
      runs-on: ubuntu-latest

   steps:
      - name: Checkout code
        uses: actions/checkout@v2

      - name: Set Node.js Version
        uses: actions/setup-node@v2
        with:
           node-version: 14

      - name: Install dependencies
        run: npm ci

      - name: Build project
        run: npm run build --if-present
        env:
           CI: false

      - name: Copy api-submit.php to dist directory
        run: cp api-submit.php dist/

      - name: Copy sitemap.xml to dist directory
        run: cp sitemap.xml dist/

      - name: Copy robots.txt to dist directory
        run: cp robots.txt dist/

      - name: List output files
        run: find dist/ -print

      - name: Deploy to FTP server
        uses: SamKirkland/FTP-Deploy-Action@v4.3.4
        with:
           server: ${{ secrets.CPANEL_HOST }}
           username: ${{ secrets.CPANEL_USERNAME }}
           password: ${{ secrets.CPANEL_PASSWORD }}
           port: 21
           local-dir: dist/
           server-dir: /
           timeout: 9999999