Bootstrap and WebSphere Liberty

How First Option utilized Bootstrap and WebSphere on our latest project. (Part 1)

Bootstrap is an open source framework for combining development of multiple user interfaces. First Option will be describing how we decided to use Bootstrap in version 4.0 of IBM i Watchdog, a centralized monitoring tool for the IBM i Series. Also we will discuss why we chose WebSphere Liberty profile over our existing application server.

Business Need

As with any project, it starts with a business need(s). In our case that happened to be a client/server application that needed a number of modifications.

First, it was time to update the look and feel of the UI (User Interface) and make it mobile aware. Second, there was additional functionality requested by the customers.

Project Scope

We knew that the architecture of the UI was dated and that there was a better way to update the look and feel. We also had experience with other programming languages that could be useful to provide the new customer functionality. So, in addition to the new functionality, a review of the languages and architecture was in the scope of this project.

Project Organization

We grouped the modifications based on whether they would be implemented on the client or the server. We dug down into the specific tasks and the first pass of the project schedule was completed. Now it was time to step back, take a breath, and talk about languages and frameworks.

Languages and Frameworks

As part of this project we decided to look at all the languages and frameworks we were currently using to build the application. Using our experience from similar projects it was decided the existing architecture was the best option, with the exception of the UI. A lot had changed with web development since we first created the application. Our interface was looking dated and we wanted to support mobile devices. We decided to use the Bootstrap framework to update the UI. Bootstrap gave us the refreshed look we wanted as well as the responsive design that allows the web application to adjust dynamically, depending on the device used (desktop, tablet, mobile phone). Bootstrap not only gave us the responsive design we wanted, it made the UI development easier.

The current server application was Tomcat on the IBM i. We decided to test the application running on the new WebSphere Liberty profile. Our testing showed the Liberty profile server performed better than Tomcat. We deployed the web application to WebSphere Liberty Profile running on the IBM i and using the HTTP Server for i to provide SSL connections for the web clients and web services. The HTTP server runs on an IBM i partition in the DMZ. We will dig deeper into the migration to the Liberty Profile server in Part II.