Automate Your Web App Deployments: A Beginner's Guide to CI/CD with Jenkins (Inspired by Nexascale Mentorship)
Tags: jenkins, beginners, webdev, programming
Published: 2024-05-15 19:34:49


**Introduction:**

Building and deploying web applications can be a repetitive process. But what if you could automate those tasks, freeing yourself to focus on more strategic development work? That's where CI/CD pipelines come in!

This guide leverages my experience in the Nexascale DevOps mentorship program to walk you, a complete beginner, through building your first CI/CD pipeline with Jenkins. We'll break down the process into manageable steps, just like we did in the program, to help you automate key aspects of your web application deployments.

**The Nexascale Challenge: Building a CI/CD Pipeline**

The Nexascale program focused on building a CI/CD pipeline that automates these key tasks:

1. **Building** your web application upon code changes.
2. **Running unit tests** to ensure everything functions as expected.
3. **Deploying** the application to a cloud environment (we'll cover generic steps here, with cloud-specific deployments in a future guide).

By the end of this guide, you'll have a functional CI/CD pipeline in place, ready to automate your web application deployments with confidence!

**What You'll Need:**

Before we dive in, make sure you have the following:

* **Basic Jenkins Understanding:** Familiarize yourself with Jenkins' core features (check out my previous articles on Jenkins).
* **Optional Cloud Environment Access:** Ideally, access to AWS, Azure, or GCP for deployments, although not essential for initial setup.
* **Sample Web Application Project:** Have a web application project ready in a version control system (VCS) like Git for practical implementation.
* **Version Control System (VCS) Knowledge:** While Git is popular, other options include Subversion (SVN) or Mercurial. If you're new to VCS, consider these resources:
    - Git Tutorial: [https://git-scm.com/videos](https://git-scm.com/videos)
    - Choosing a VCS: [https://en.wikipedia.org/wiki/Version_control](https://en.wikipedia.org/wiki/Version_control)

**What You'll Achieve:**

By following this guide, you'll gain:

* **Functional CI/CD Pipeline:** A Jenkins pipeline that automates building, testing, and deploying your web application (or a sample application).
* **Step-by-Step Guide:** Clear instructions to walk you through each stage of setting up your pipeline.

**Let's Build Your First CI/CD Pipeline!**

Now that you're prepared, let's break down the steps involved:

### Step 1: Setting Up Your Jenkins Server

**Installation:**
   Install Jenkins on a server within your cloud environment or locally. Refer to the official Jenkins documentation for specific cloud-based installation guides: [https://www.jenkins.io/download/](https://www.jenkins.io/download/)

   **Pro Tip:** Many cloud providers offer pre-configured Jenkins instances to simplify setup.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/278vqocei6kav5cjtuvb.JPG)
 **Plugin Installation:**
   Install essential Jenkins plugins:
     - **Git Plugin:** Manages code from your chosen VCS.
     - **(Optional) Docker Pipeline Plugin:** Needed if you plan to use Docker containers for deployments (requires basic Docker knowledge).

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v15z9vv1sesr0jlf4ize.png)

**Security Considerations (Recommended):**
   While not covered in detail here (security will be in a future guide), keep in mind the importance of:
     - User Authentication and Authorization: Restrict access to sensitive jobs and configurations.
     - Secure Communication: Use HTTPS for accessing Jenkins to encrypt communication.

### Step 2: Integration with Your Version Control System

**Connecting to Your VCS:**
   Connect Jenkins to your chosen VCS (e.g., GitHub, Bitbucket) where your web application code resides. Refer to your VCS's documentation for setting up a repository.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uhrs7rdv0ijhemvjtsp8.png)

 **Webhook Magic with a Twist (Using ngrok for Local Development)**

Since we're focusing on getting started, we'll assume you're developing your web application locally. To enable Jenkins to listen for code changes in your local environment, we'll leverage a tool called ngrok.

**What is ngrok?**

Ngrok is a handy tool that establishes a secure tunnel between your local machine and the public internet. It provides a temporary public URL that you can use to expose your locally running Jenkins server to the web.

Here's the completed section on how ngrok helps with webhooks:

**Here's how ngrok helps with webhooks:**

**Download and install ngrok:**  Head over to [https://ngrok.com/](https://ngrok.com/) and download the ngrok client for your operating system. Follow the installation instructions.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7zs12rrp1m4xo8gmsrsb.png)

**Start the ngrok tunnel:**  Open a terminal and navigate to the directory where you installed ngrok. Start the ngrok tunnel by running the following command, specifying port 8080 (the default port for Jenkins):

   ```bash
   ngrok http 8080
   ```

   **Note:** This command will establish a secure tunnel and provide you with a temporary public URL (e.g., https://<random-string>.ngrok.io). This URL will be used to configure the webhooks in your VCS.

**Configure the Webhooks:**  With your temporary public URL from ngrok in hand, navigate to your version control system (VCS) settings and locate the webhook configuration section for your repository. Set the "Payload URL" or "Webhook URL" field to the ngrok URL you obtained in step 2.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3f22k505r62efkb878hl.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6khaspnd8jmryvml552h.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sgao4zxus476wtyr8ktd.png)

**Important Note:**

* Remember that ngrok URLs are temporary and expire after a certain period or when you disconnect. You'll need to restart the ngrok tunnel and update the webhook URL if it expires. For production environments, you'll likely use a different approach that doesn't rely on temporary URLs.



### Step 3: Building and Testing with a Jenkins Freestyle Job

**Creating the Job:**
  In Jenkins, create a new "Freestyle project." Give it a clear name reflecting its purpose (e.g., "Build and Test My Web App").

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zrl9i0mlvo9vec9iuknz.png)

**Job Configuration:**
  - Set the project to retrieve code from your VCS.
  - Configure build steps to build your web application using your build tools (e.g., Maven, Gradle).

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/focu4praka15i3rgueop.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o9xkfx6vhwtl9bw1v7lm.png)

  - Add steps to execute unit tests with your testing framework (e.g., JUnit, Jest). Many frameworks offer Jenkins plugins for easier integration.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rjlpc28bk1k29w6j4ryp.png)

**Failing Forward:**
  Ensure the build fails if unit tests don't pass. This prevents potentially broken code from progressing further in the pipeline.


### Step 4: Building the Jenkins Pipeline for Deployment 

**Creating the Pipeline Job:**
In Jenkins, create a new "Pipeline" project. This project will define the overall CI/CD process using a Jenkinsfile.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kjf7b3eylg6cvrumh6u2.png)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ehlttl5ydrmwgwmcxqhi.png)

**Crafting the Jenkinsfile:**
The Jenkinsfile is a script stored in your project's repository that outlines the stages of your CI/CD pipeline. 
 While a complete Jenkinsfile script isn't included here for brevity, the structure typically involves stages for building, testing, and deploying your application. 

**Looking for Sample Jenkinsfiles?**

These resources provide sample Jenkinsfiles demonstrating various functionalities like building, testing, and deploying applications:

* **Jenkins Pipeline Examples:** [https://www.jenkins.io/doc/pipeline/examples/](https://www.jenkins.io/doc/pipeline/examples/)
* **GitHub Jenkinsfile Examples:** [https://github.com/jenkinsci/pipeline-examples](https://github.com/jenkinsci/pipeline-examples)

Once you've familiarized yourself with the Jenkinsfile structure, explore the sample scripts provided to gain inspiration and customize them for your project's requirements.