Create an Automated Web Development environment, integrating Jenkins, Git/Github, Docker and httpd Web Server

In this article, I want to show you how you can integrate Jenkins, Git/Github, Docker, and httpd webserver to create a fully automated environment to test, build and deploy the web pages. This whole setup makes a Continuous Integration (CI) model for testing and deploying web pages.

--> I am assuming that you have installed Git Bash, Jenkins, and Docker in your system. You also need a VM (here I am using RHEL version 8 running via virtualization on my Windows 8.1 as a host OS to run docker and Jenkins services).

--> Also, I assumed that you know the basic commands used in Linux (RHEL 8) and Git Bash.

--> You need to have a GitHub account for remote access of your repository.

Step -1 Run the Jenkins service from RHEL version 8 (Red Hat) and open its web UI in browser to interact with it (by default it uses port number 8080).

Step - 2 Developer needs to launch the development environment to write codes. (here, I am using windows 8.1)

Step – 3 Open Git Bash and make a local repo to upload on GitHub. (Here, I am using GitHub as a remote repository where I can upload my local repo files)

Step - 4 Make a testing branch (here, I created test) along with a master branch (by default).

Step - 5 Write your codes in the master branch and save in a file (here, I created index.html). It will automatically share with the test branch.

Step -6 Create a repository in the GitHub. (here, I am creating repo Deploy_Project) unchecking initializing readme.md and add it remotely to your local repo on Git Bash. 

Step - 7 After that modify some codes in the test branch file (index.html) and push this file on GitHub for testing by the Quality Assurance Team (QAT).

Step - 8 Open the file named .git/hooks/post-commit in Git Bash and write these 2 lines of code to automatically push the code to GitHub when a commit is done.

Step -9 Open Jenkins UI in the web browser (here, using chrome), create a job to test the code written by the developer (here, I created Test_Job).

>> Go to configure section

• choose git in Source Code Management
•  Put the URL of your GitHub repository, choose the testing branch (here test branch)
• Tick the GitHub hook trigger for GITScm polling (it automatically clone/download the files from GitHub whenever a new push is done).
• Write these commands in 2 different Execute shell

This test job clone the file when a commit is done in the local repo( in test branch) to /testing directory in Red Hat system and automatically runs a docker container (here test_environment ) from httpd image. Port 8081 of base OS Red Hat is PAT (Port Address Translation) or port forwarding with port 80 of docker container to access it through internet/from another system.

The /testing directory links with /usr/local/apache2/htdocs/ of docker container to get rid of copying files (it simply updates both directories at the same time when new files come).

>> Run this command in Red Hat terminal. It gives access to Jenkins for copying the code.

setfacl -m u:Jenkins:rwx /directory_name

>> Run this command to change password access of Jenkins and do the following changes.

gedit /etc/sudoers

Step – 10 Add webhook in GitHub

•  Get the public IP from ngrok (software that converts the private IP into a public IP/URL). We can’t access Private IP from remote system/on the internet. 
• Copy the public URL of Jenkins in the payload URL box and use https if you are using a tunnel
• In content type select application/jason
• Disable SSL verification
• Select just the push event
• Check the Active box and Update Webhook

Step – 11 Now, go to Jenkins and create a new job (here Build After Test). Fill the repository URL and select Merge Before Build from Additional Behaviours, input all the fields and fill the branch name accordingly.

>> This job is Build/run by the QAT team after successful testing of Test branch code and merge Test branch code with the master (main) branch to deploy it on a production site for client usage.

Step – 12 Again go to Jenkins and create a new job (here, I created Deploy_Job) to deploy the final tested code/web page on an isolated environment other than the testing environment.

>> All the commands are similar to that of Test_Job, the only difference is that this job clone/download code from the master branch and docker container (here, named final_environment)  running on port 8082 of base OS linked with port 80 of the container to provide isolation between environments.

If You follow these steps properly, then you can make an end to end automated continuous integration model by integrating Jenkins, Git/GitHub, Docker to test and deploy the web pages.