Tutorial Series: Set Up Automatic Deployment on CPanel with Git (Pull Method)

You are hosting your website or web app on a CPanel Server. Each time you want to update your website(resolve a bug, add a new feature, etc.), you have to upload a copy of your development build into the appropriate directory of your remote server using either the CPanel Web UI or SSH. Both methods can work for you but why not use a better, more convenient way? This is using Git version control system for automatically deploying your version-controlled project only with a few standard Git commands. This practice will speed up your deployment process while allowing you to maintain your codebase with common Git practices (branching, versioning, etc.).

This will be a series of 3 articles that will guide you through the process of implementing Automatic Deployment with 3 basic configurations:

  • Pull Deployment with Public Repositories
  • Pull Deployment with Private Repositories
  • Push Deployment

In this guide, we will talk about the first one. In this case, we will keep the source code of our project in a public Github repository and pull ( this is why we call this “pull deployment”) the changes from there into our CPanel host.

Prerequisites

  • Git (it should be installed)
  • A CPanel hosting. (Any service provider is okay)
  • Github account

Method 1: Pull Deployment(Recommended):

In this method, we will upload our local repository to a remote repository hosted in one of the popular git hosting services like Github or Gitlab. Then we will clone one instance of this repository in our CPanel server. Then we will track one specific branch ('master' in our test case) as our deployment branch to deploy whose changes in our production directory.

I will create a dummy project named "dummy" that represents my website. Inside the project's root folder I have only got an index.html file.

Folder Structure

📁 dummy

|___ 📄 index.html

Initialize a local git repository in your project's root path

cd dummy && git init

Write some simple code inside the index.html.

echo "<h1> Hello world!</h1>" > index.html

Now, I will stage and commit my changes.

git add . && git commit -m "initial commit"

Create a remote Git repository on Github

Log in for your Github account. Then navigate into the "Your repositories" section

Click on the new.

Give a name for your repository. Write a short description. Select "Public" ( "Private" case will be discussed later). Also, DON'T add a README or .gitignore. Then click the "Create repository" button.

Copy the repository URL.

Now, go to your terminal and add this to "remotes list" of your local repository with the following command. Then push your local commits into the remote.

git remote add origin https://github.com/tahameg/dummy_website.git
git push origin master

Write a simple CPanel deployment script

I will use my development.innable.io subdomain address that points to the "<home directory>/public_html/development.innable.io" folder.

Log in for your CPanel account. On the right, you will see your home directory. Note it.

The stages for deploying a git repo inside a CPanel host is as follows:

  1. Introduce a repo by cloning it inside the server.
  2. Pull the latest version of the target branch.
  3. Run a Deployment script that copies all the files that are pulled from the remote repository to a target directory (root folder of the website in our case)

The third stage is performed via a special configuration file named ".cpanel.yml". This file should be inside the root of your project. (in the same directory as the .git folder)

Create the ".cpanel.yml" file and edit it as the following. The new folder structure of the project as follows now:

📁 dummy

|___ 📄 index.html

|___ 📄 .cpanel.yml

---
deployment:
tasks:
- export DEPLOYPATH=<our home directory>/public_html/development.innable.io
- /bin/cp -a * $DEPLOYPATH

I know this is quite a pain but I will explain what is going on in here. When we trigger the "deploy" command, the deployment engine will run the commands that are specified in the "tasks" section in order. In our case, the engine copies everything inside the repository root and paste it inside the "~/public_html/development.io" folder.

NOTE: You should replace the <our home directory> section with your home directory.

But first, we have to stage this new file and push it so the Cpanel can receive it.

git add . && git commit -m ".cpanel.yml has been added"
git push origin master

Introducing the repository inside CPanel

Go to CPanel and find the following section. In the opened page, click on the “create” button.

Fill the fields as following. Then click “Create”.

We are almost done. The next thing is to pull the latest changes and deploy.

Pull and deploy

Now in the Git version control section, our repository should be visible. Click on “Manage”.

In the “Basic Information” tab, click “Update”. You don’t need to do this the next time you want to deploy again. Then go to the “Pull or Deploy” tab.

“Update from Remote” pulls the latest changes from the master branch of the remote. “Deploy HEAD Commit” button runs the latest deployment script. You will have to perform those 2 stages each time when you want to deploy a new version of your website.

Now I will go to development.innable.io website and Walaaa!

Next time I want to update my website the only thing that I have to do is “Pulling and Deploying” in the same page. I hope it is helpful for you. See you in the next post

--

--

--

Electrical engineering graduate and seasoned software engineer. Passionate about XR development, simulation engineering and web technologies.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

ETL with Argo Workflows

Decision makers with poor domain knowledge create red tape

How To Build A Techy Go Kart. Part 5A: Wheel Speed Sensing

A Newbie’s Guide to Scala and Why It’s Used for Distributed Computing

Hello World!!,

【New Coin Listing】Lunr Token(LUNR) to Be Listed on DigiFinex!

Visualizing Twitter trends live: Redpanda, Materialize and dbt

SASS | part 2

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Taha Mert Gokdemir

Taha Mert Gokdemir

Electrical engineering graduate and seasoned software engineer. Passionate about XR development, simulation engineering and web technologies.

More from Medium

Backup your database using cron

Configure private NPM package registry using Yarn 2 and Gitlab CI/CD

Photo by <a href=”https://unsplash.com/@markusspiske?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Markus Spiske</a> on <a href=”https://unsplash.com/s/photos/coding?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>

Create your own NPM private feed with Azure DevOps

Docker volumes Problem onUbuntu on WSL2