1. Home
  2. Training Library
  3. Introduction to CI/CD with Jenkins

Building a GitHub Stored Project

Start course
Duration1h 47m


This course introduces you to Jenkins, a popular open-source tool used to perform Continuous Integration and Continuous Delivery.

We spend time early on reviewing the key Jenkins features and associated terminology. We then take you through a deep dive in configuring Jenkins to perform automated builds using the Jenkins web administration console in hands-on demonstrations, ensuring that you become familiarised with Jenkins and how to administer it. We’ll demonstrate features such as:

  • Installing and setting up Jenkins
  • Creating and configuring pipelines manually
  • Creating and configuring pipelines using a Jenkinsfile
  • Triggering build pipelines, manually and automatically
  • Navigating downstream and upstream build projects
  • Connecting to version control repositories such as GitHub
  • Setting up build pipelines for Java-based projects using Gradle
  • Recording artifacts and test results

Learning Objectives

What you'll learn:

  • The basic principles of build automation as implemented within Jenkins and how should be applied to manage and maintain building, testing, and deploying your own enterprise software projects
  • How to install, setup, and configure Jenkins pipelines
  • The key differences between Jenkins declarative and scripted pipelines
  • How to manage build artifacts and test results
  • How to integrate and leverage 3rd party build tools like Gradle, Maven, Yarn, Webpack, and many more within a Jenkins pipeline


This training course provides many hands-on demonstrations where you will observe first hand how to use Jenkins to build and release different types of software projects, for example:

  • Building a front end application which has been developed using the React Javascript framework, using technologies such as Webpack and Yarn
  • Building a back end application developed using Java, Gradle, and Docker, requiring Jenkins to compile the source code, packaging it into a WebArchive file, and then finally releasing it into a Tomcat based Docker image complete with Splunk based instrumentation for logging and monitoring


  • A basic understanding of CICD, or Continuous Integration and Continuous Delivery
  • A basic understanding of software development and the software development life cycle
  • A basic understanding of version control and associated workflows

Intended Audience

  • Software Build and Release Engineers
  • Software Developers
  • DevOps Practitioners

Supporting Documentation

The following supporting Jenkins documentation is available online: 




- [Instructor] Okay, welcome back! In this demonstration, we're going to do our first proper code build. 

We're going to use Jenkins. We're going to use a freestyle project. And what we're going to do is we're going to build the code that's located at this Cloud Academy GitHub repository. Now, this is a good starter project. It's based on React. Those unfamiliar with React, React is a JavaScript library framework provided by Facebook, and it's really great for building component based user interfaces. Now, the reason we're going to use React is twofold. Firstly, it's a good starting point to get introduced to building source code. And secondly, it demonstrates that Jenkins can be used to not only compile source code, in the sense of compiling Java or compiling C sharp or compiling C++, Jenkins can do a lot more. In fact, it can do any arbitrary build task that you require it to do. 

So let's quickly take a look at one of the source files in our React web app project. So, in this case we'll navigate to the App.js file. Now, because we're using React, this isn't pure JavaScript, and the key point of this is that if we send this file as is to the browser, then it's not going to run because browsers are designed to pause JavaScript. And when you're developing with React, you're writing both JavaScript and HTML together. So if you have a look here, we've got a class statement, and within that class statement, we have a render function. So that looks like typical JavaScript, but if you look closer, you'll actually see that there is HTML involved, as well. So, the key point of this, in terms of what we're going to do with Jenkins, is we're going to have to use Jenkins to convert it from JSX into pure JavaScript. 

The technical name for this process is transpilation, and we're going to use Jenkins to actually perform that process. So let's jump into Jenkins and begin our setup. So we log in with our credentials. We click on New Item. We're going to call it BuildJob3. It's going to be a freestyle project again. Click OK. We specify that it's a GitHub project. So, here we copy our GitHub URL. Scroll down. Under Source Code Management, we'll select Git, and again, we specify the repository URL. This time we append .git to the end of it. Then we scroll down to the Build section. Click on Add build step, and we use the Execute shell. And here we're going to run yarn install to install our JavaScript library dependencies, followed by yarn build to do the actual transpilation of our JSX to pure JavaScript. 

We'll do a directory listing, and we'll echo out finished to indicate that we're all done. Click Apply, click Save, and we'll click Build Now. So, this schedules the build. The build is off and running. We can click on it to navigate into the console output. I can see here that our first command is running, yarn install. It's resolving and fetching the third party library dependencies for our JavaScript application. It's now performing the actual transpilation. And we've done our directory listing. And we can see that, indeed, everything has finished as per our finished statement. Now, after the transpilation occurred, a build photo was created for us. So our React web app that we can actually serve up is now contained in this build directory. 

So again, if we jump back into the terminal, let's navigate to var/lib/jenkins. Do a directory listing. We see here that we have a workspace folder. We'll navigate into there. Again, we do a directory listing. We can see here that we've got individual folders for each of our build jobs. So, we'll navigate into BuildJob3, do another directory listing, and here you can see that when the build ran, it did a Git clone of our repository. If we navigate into the build directory, and we do a directory listing, here we can see the files that have been transpiled. These are the outputs. And if we take these files, and we serve them up, and we navigate to index.html, we'll see our React web app. We'll jump back to the Jenkins web console. 

We'll navigate up to the project. And this time we'll click on Workspace. So, the workspace view within Jenkins is the same view that we just had a look at on the file system. If we look in the build directory, again, we see our files that are used at serve time. Now, if we click on the all files in zip, we'll actually download a copy of that to our workstation. So, if we jump over into our terminal again, we'll start another session. And this time if we navigate to our Downloads folder, we'll now unzip the build.zip file that we downloaded, navigate into it and do Control + L. 

If we start up a utility called http-server, this is a simple web server that basically serves up the current directory. If we navigate to the link, you'll see that our web app is up and running. So, this is showing that Jenkins has been used to do the transpilation and the minification of our web files. Okay, so in summary, all we've done is we've created a freestyle project, pointed it at our React sample web app hosted on GitHub, and then we used Jenkins to do the transpilation as well as the minification of our web assets.

About the Author
Learning paths23

Jeremy is the DevOps Content Lead at Cloud Academy where he specializes in developing technical training documentation for DevOps.

He has a strong background in software engineering, and has been coding with various languages, frameworks, and systems for the past 20+ years. In recent times, Jeremy has been focused on DevOps, Cloud, Security, and Machine Learning.

Jeremy holds professional certifications for both the AWS and GCP cloud platforms.