Jenkins

Install and Use the Bootstrap 5 Jenkins Plugin

Bootstrap is a free front-end framework for faster and easier web development. It includes HTML and CSS-based design templates for typography, forms, buttons, tables, navigation, modals, image carousels, and many other components as well as optional JavaScript plugins.

Jenkins Jelly is a template language used to create user interface elements in Jenkins such as forms, tables, and buttons. It is based on the Jelly script language, an XML-based language used to define dynamic content.

In Jenkins, Jelly scripts are used to create the user interface elements displayed on the Jenkins web page such as the build status, history, and artifacts. They are also used to define the behavior of these elements such as how they should be displayed and what should happen when clicked.

Jelly scripts are typically written in XML and can be used to define the layout and functionality of the user interface elements they create. They often combine with other technologies, such as HTML, CSS, and JavaScript, to create complex and interactive user interfaces.

The Bootstrap 5 plugin for Jenkins provides a suite of Jenkins UI elements that you can use to quickly create and customize the Jenkins UI using the Jelly language.

Installing the Bootstrap 5 Plugin in Jenkins

To use the Jenkins Bootstrap 5 plugin, add it as a dependency in your pom.xml file as shown:

<dependency>
 <groupId>io.jenkins.plugins</groupId>
 <artifactId>bootstrap5-api</artifactId>
 <version>[latest version]</version>
</dependency>

Once added, you can use the provided utility classes to create custom Jenkins UI elements.

For example, below is a simple jelly that shows the total number of builds in a Jenkins server

<j:set var="buildCount" value="${builds.size()}" />

<div class="row row-py-3 build-count">
 <p>Total number of builds: ${buildCount}</p>
</div>

This Jelly script assumes that it is being executed within the context of a Jenkins build and that the builds variable is available. If you are using this script in a different context, you may need to modify it or provide the necessary variables differently.

Conclusion

This tutorial demonstrates the use of the Bootstrap 5 plugin for defining and working with the Bootstrap utility classes to define custom Jenkins UI.

About the author

John Otieno

My name is John and am a fellow geek like you. I am passionate about all things computers from Hardware, Operating systems to Programming. My dream is to share my knowledge with the world and help out fellow geeks. Follow my content by subscribing to LinuxHint mailing list