Github is the new open source game changer in application development. You can host your code on GitHub and do amazing things including branching, Reviews, PR, Push and Pull. Github also provides a sophisticated set of options to host and maintain code.
In this article, I will make a complete workflow from pushing the code to automatic deployment to live website or application. For the purpose of this tutorial, I have assumed that you have made a website or web app and that you are ready to push it to GitHub.
Table of Contents
The first step of the process is the installation of git on the local machine. Git is a well-know code version control system. Developed by the eminent Linus Torvald, Git is an open-source project that ensures that the complete history of the development of the code is meticulously maintained. Download the git installer and install it on the local machine.
Signup and then login to your GitHub account. Once logged in, click New Repository button to create a new repository.
Insert repository’s name and description, select Public and, finally click Create Repository button.
The repository is now available for further processing.
The next step is to push the code in this repository . For this, navigate to the project saved in your local system and follow the next step.
For the purpose of this tutorial, I have created a simple website. I will push this project in testdemo repository. The following commands are used to push the code to the GitHub repository. I assume that you are already in the test project’s directory. Next, launch the command prompt.
Gitinit initializes an empty .git folder in the project directory
This command adds the code to the index.
This command sends a commit message with new changes in the code.
git commit -m “my first commit”
git remote add origin
The next step is to add the URL of the GitHub repository in which you want to push the code. Since I have created the testdemo repository, I will use the corresponding link.
Copy the URL and run the following command
git remote add origin https://github.com/shahroznawaz/testdemo.git
This will add the remote URL to the git index and the repository is ready for code deployment.
The final step is to push the code to GitHub. You should also specify the branch name in which you want to push the code. Run the following command:
git push -f origin master
A sign-in form for GitHub will be open. Enter your GitHub credentials and hit the login button.
Once the processing finishes, the code has been successfully pushed to the GitHub repository. Open GitHub and check the repository.
At this point, the application has been successfully pushed to GitHub and the initial configuration on local machines has been done.
Now, I need to host the website on a hosting service so that the automatic deployment feature could be tested. . You could use any hosting platform for testing. Personally, I prefer Cloudways because it is a managed hosting solution. I have already created an account and a PHP application is already active on my server.
Open SSH terminal from server settings and clone the app with following command
git clone https://github.com/shahroznawaz/testdemo.git
Check the staging URL, where you will see the website running live.
Here comes the exciting part of the tutorial.
I will now create a github.php file and upload it to the hosted project. Basically I will add a command in the file that will automatically pull the code every time the code is pushed from the local machine. While this looks like magic, the answer lies in a webhook that is added to the GitHub repository.
First, add the following command in github.php file
<?php `git pull`?>
This simple command changes the game. To add the webhook in the github.php, first find the path of the file on the Cloudways server. In my example, the path is: http://phpstack-21306-56790-176024.cloudwaysapps.com/testdemo/github.php
Copy the path and paste it in GitHub webhook settings.
Add the webhook and go to index.html on the local machine. Make changes to the code and then push the code using the following commands:
git add index.html
git commit -m “edit some code”
git push -u origin master
Check the webhook, and it will show how successful deployment of code looks like.
Though the process of pushing code from the local machine to live website appears very tempting, it often has unintended consequences. There is always a chance that someone on the team will push code that might break the live project. I recommend that you to use this process only if you are the only developer and is responsible for development and deployment of the project.