Automate your React/Vite app deployment to FTP (cPanel)

Manually deploying your React/Vite app to the cPanel every time involves following a set of 7 steps shown in the section below. This is a real pain if it needs to be done repeatedly. But it can be automated. This automation can be done if your code resides on GitHub and can be done using GitHub Actions by setting a new action. It is shown in the 2nd section.

This is the first of the many articles coming every week on automating your repetitive tasks. Follow so that you do not miss any.

Deploying React/Vite app to FTP (manually)

To deploy a React/Vite app to FTP manually, you need to follow the following steps:

1. Install the dependencies

npm i

2. Specify your site’s URL in Vite Config (if made using Vite)

export default defineConfig({
  base: 'https://example.com/',
  // ... other config settings
})

3. Build your code

npm run build

4. Zip the “dist” folder to a .zip extension.

Zip/ Compress your dist folder, and use any compressor tool to zip your dist folder. You may…