Experiment No. 5 Title: Applying CI/CD Principles to Web Development Using Jenkins, Git, and Local HTTP Server

 Experiment No. 5

Title: Applying CI/CD Principles to Web Development Using Jenkins, Git, and Local HTTP Server 

Objective:

The objective of this experiment is to set up a CI/CD pipeline for a web development project using Jenkins, Git, and webhooks, without the need for a Jenkinsfile. You will learn how to automatically build and deploy a web application to a local HTTP server whenever changes are pushed to the Git repository, using Jenkins' "Execute Shell" build step.

Introduction:

Continuous Integration and Continuous Deployment (CI/CD) is a critical practice in modern software development, allowing teams to automate the building, testing, and deployment of applications. This process ensures that software updates are consistently and reliably delivered to end-users, leading to improved development efficiency and product quality.

In this context, this introduction sets the stage for an exploration of how to apply CI/CD principles specifically to web development using Jenkins, Git, and a local HTTP server. We will discuss the key components and concepts involved in this process.

Key Components:

• Jenkins: Jenkins is a widely used open-source automation server that helps automate various aspects of the software development process. It is known for its flexibility and extensibility and can be employed to create CI/CD pipelines.

• Git: Git is a distributed version control system used to manage and track changes in source code. It plays a crucial role in CI/CD by allowing developers to collaborate, track changes, and trigger automation processes when code changes are pushed to a repository.

• Local HTTP Server: A local HTTP server is used to host and serve web applications during development. It is where your web application can be tested before being deployed to production servers.

CI/CD Principles:

• Continuous Integration (CI): CI focuses on automating the process of integrating code changes into a shared repository frequently. It involves building and testing the application each time code is pushed to the repository to identify and address issues early in the development cycle.

• Continuous Deployment (CD): CD is the practice of automatically deploying code changes to production or staging environments after successful testing. CD aims to minimize manual intervention and reduce the time between code development and its availability to end-users.

The CI/CD Workflow:

• Code Changes: Developers make changes to the web application's source code locally.

• Git Repository: Developers push their code changes to a Git repository, such as GitHub or Bitbucket.

• Webhook: A webhook is configured in the Git repository to notify Jenkins whenever changes are pushed.

• Jenkins Job: Jenkins is set up to listen for webhook triggers. When a trigger occurs, Jenkins initiates a CI/CD pipeline.

• Build and Test: Jenkins executes a series of predefined steps, which may include building the application, running tests, and generating artifacts.

• Deployment: If all previous steps are successful, Jenkins deploys the application to a local HTTP server for testing.

• Verification: The deployed application is tested locally to ensure it functions as expected.

• Optional Staging: For more complex setups, there might be a staging environment where the application undergoes further testing before reaching production.

• Production Deployment: If the application passes all tests, it can be deployed to the production server.

Benefits of CI/CD in Web Development:

• Rapid Development: CI/CD streamlines development processes, reducing manual tasks and allowing developers to focus on writing code.

• Improved Quality: Automated testing helps catch bugs early, ensuring higher code quality.

• Faster Time to Market: Automated deployments reduce the time it takes to release new features or updates.

• Consistency: The process ensures that code is built, tested, and deployed consistently, reducing the risk of errors.

Materials:

• A computer with administrative privileges

• Jenkins installed and running (https://www.jenkins.io/download/)

• Git installed (https://git-scm.com/downloads)

• A local HTTP server for hosting web content (e.g., Apache, Nginx)

• A Git repository (e.g., on GitHub or Bitbucket)

Experiment Steps:

Step 1: Set Up the Web Application and Local HTTP Server

• Create a simple web application or use an existing one. Ensure it can be hosted by a local HTTP server.

• Set up a local HTTP server (e.g., Apache or Nginx) to serve the web application.

   

Update the package list to ensure you have the latest information about available packages. Run the following command:

sudo apt update

Install Apache by running the following command:


sudo apt install apache2

This command will download and install Apache along with its dependencies.

 

During the installation process, you may be prompted to confirm the installation by typing 'Y' and pressing Enter. Go ahead and do that.

Once the installation is complete, Apache should be up and running. You can check its status by running:


sudo systemctl status apache2

You should see a message indicating that Apache is active and running.

 

 

Step 2: Set Up a Git Repository

Create a Git repository for your web application. Initialize it with the following commands:

git init

git add .

git commit -m "Initial commit"

• Create a remote Git repository (e.g., on GitHub or Bitbucket) to push your code to later.

Step 3: Install and Configure Jenkins

• Download and install Jenkins following the instructions for your operating system (https://www.jenkins.io/download/).

• Open Jenkins in your web browser (usually at http://localhost:8080) and complete the initial setup.

• Install the necessary plugins for Git integration, job scheduling, and webhook support.

• Configure Jenkins to work with Git by setting up your Git credentials in the Jenkins Credential Manager.

   

  To install Jenkins on Ubuntu, you can follow these steps:
  
  Note: Jenkins requires Java to be installed on your system. You can check if Java is already installed by running java -version. If not, you can install it using the following command:
  

  •  sudo apt update
    sudo apt install default-jre
    
    Now, let's proceed with the Jenkins installation:
    
    Add Jenkins Repository: You'll need to add the Jenkins repository to your package sources. To do this, first, add the Jenkins Debian repository key to your system:

sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys 5BA31D57EF5975CA

wget -q -O - https://pkg.jenkins.io/debian/jenkins.io.key | sudo apt-key add -

Next, create a sources list file for Jenkins:

sudo sh -c 'echo deb http://pkg.jenkins.io/debian-stable binary/ > /etc/apt/sources.list.d/jenkins.list'

Update Package List:

sudo apt update

Install Jenkins:

sudo apt install jenkins

Start Jenkins Service:

sudo systemctl start jenkins

Enable Jenkins to Start on Boot:

sudo systemctl enable jenkins

Check Jenkins Status:

You can check if Jenkins is running by running:

sudo systemctl status jenkins

You should see a message indicating that Jenkins is active and running.

Configure Jenkins:

Open a web browser and go to http://your_server_ip_or_domain:8080. You will be prompted to unlock Jenkins by retrieving the initial administrative password. Run the following command to display the password:

sudo cat /var/lib/jenkins/secrets/initialAdminPassword

Copy the password and paste it into the Jenkins web setup wizard. Follow the on-screen instructions to complete the setup. 

•  

Step 4: Create a Jenkins Job

• Create a new Jenkins job using the "Freestyle project" type.

• Configure the job to use a webhook trigger. You can do this by selecting the "GitHub hook trigger for GITScm polling" option in the job's settings.

Step 5: Set Up the Jenkins Job (Using Execute Shell)

• In the job configuration, go to the "Build" section.

• Add a build step of type "Execute shell."

• In the "Command" field, define the build and deployment steps using shell commands. For example:

# Checkout code from Git

# Build your web application (e.g., npm install, npm run build)

# Copy the build artefacts to the local HTTP server directory

rm -rf /var/www/html/webdirectory/*

cp -r * /var/www/html/webdirectory/

Step 6: Set Up a Webhook in Git Repository

• In your Git repository (e.g., on GitHub), go to "Settings" and then "Webhooks."

• Create a new webhook, and configure it to send a payload to the Jenkins webhook URL (usually http://jenkins-server/github-webhook/). Make sure to set the content type to "application/json."

• OR use “GitHub hook trigger for GITScm polling?” Under Build Trigger

Step 7: Trigger the CI/CD Pipeline

• Push changes to your Git repository. The webhook should trigger the Jenkins job automatically, executing the build and deployment steps defined in the "Execute Shell" build step.

• Monitor the Jenkins job's progress in the Jenkins web interface.

Step 8: Verify the CI/CD Pipeline

Visit the URL of your local HTTP server to verify that the web application has been updated with the latest changes.

Conclusion:

This experiment demonstrates how to set up a CI/CD pipeline for web development using Jenkins, Git, a local HTTP server, and webhooks, without the need for a Jenkinsfile. By defining and executing the build and deployment steps using the "Execute Shell" build step, you can automate your development workflow and ensure that your web application is continuously updated with the latest changes.

Exercises /Questions :

1. Explain the significance of CI/CD in the context of web development. How does it benefit the development process and end-users?

2. Describe the key components of a typical CI/CD pipeline for web development. How do Jenkins, Git, and a local HTTP server fit into this pipeline?

3. Discuss the role of version control in CI/CD. How does Git facilitate collaborative web development and CI/CD automation?

4. What is the purpose of a local HTTP server in a CI/CD workflow for web development? How does it contribute to testing and deployment?

5. Explain the concept of webhooks and their role in automating CI/CD processes. How are webhooks used to trigger Jenkins jobs in response to Git events?

6. Outline the steps involved in setting up a Jenkins job to automate CI/CD for a web application.

7. Describe the differences between Continuous Integration (CI) and Continuous Deployment (CD) in the context of web development. When might you use one without the other?

8. Discuss the advantages and challenges of using Jenkins as the automation server in a CI/CD pipeline for web development.

9. Explain how a Jenkinsfile is typically used in a Jenkins-based CI/CD pipeline. What are the benefits of defining pipeline stages in code?

10. Provide examples of test cases that can be automated as part of a CI/CD process for web development. How does automated testing contribute to code quality and reliability in web applications?