Run UI5 Apps on Apache Tomcat

tomcatLet’s use Apache Tomcat to run UI5 Apps! Tomcat is a very light-weight, but a full blown Java based app and web server. It can be well integrated into Eclipse IDE and therefore a perfect counterpart in development. It is much more light-weight and faster in startup than any SAP Java Server. It also enables you to write server-side components (like servlet’s, JSP’s,…), which then can be consumed by our UI5 App. And like OpenUI5 it is Open Source and free!

This article assumes you already have read the following articles, which define some off the prerequisites:

Installation of Apache Tomcat

This step is quite straight forward, so I only list the necessary steps here, without much details (based on Tomcat Version 7.0):

  1. check prerequisites (JDK installed, JAVA_HOME Path system variable set)
  2. Download Apache Tomcat 7 from http://tomcat.apache.org/download-70.cgi (Download the core binary distribution for your platform, I do not recommend the windows service installer for developing scenario)
  3. Extract the zip/tar archive to the file system
  4. That’s it!

Integrate Tomcat into Eclipse 4.3.x

This will allow as to use Tomcat as App Server while we developing our UI5 app. To do so, start Eclipse and do the following steps to integrate Tomcat into Eclipse:

  • Open Eclipse Preferences and goto Server -> Runtime Environments and press Add (as you can see, I also work with SAP HANA Cloud, which is similar):
  • Tomcat1
  • Now select Apache -> Apache Tomcat v7.0 and press Next:
  • Tomcat2
  • Define the location of Tomcat Root Installation Directory (where you extract the tomcat zip file) and press Finish:Tomcat3
  • Now we have created a new Server Runtime environment „Apache Tomcat v7.0“ , please confirm this by pressing OK,:
  • Tomcat4
  • Now we add this new Runtime Environment to the Server Tab of Eclipse, so that we can administrate the Tomcat (start, stop, …) and also define which Web App should be deployed. Therefore: Select the „Server Tab“ and right-click in the list and select New -> Server:
  • Tomcat5
  • Select Apache -> Tomcat v7.0 Server and press Finish:
  • Tomcat6
  • Tomcat is available within Eclipse now and we can stop and start this server via the Server Tab

Deploy and Run UI5 App on Tomcat

Deploy and run the UI5 App (here UI5 SplitApp Boilerplate) on the Tomcat Server is the final step:

  • Simply right-click the corresponding Web App Project and select Run As -> Run on Server:
  • Tomcat7
  • Choose from existing server, Tomcat v7.0 Server at localhost and press Next:
  • Tomcat8
  • The UI5SplitApp-Boilerplate App is now configured, press Finish:
  • Tomcat9
  • Result is shown in the Server Tab. Tomcat is Started and the UI5SplitApp-Boilerplate is Synchronized:
  • Tomcat11

You can call the UI5 App with Chrome or any other Browser with the following URL:

http://localhost:8080/UI5SplitApp-Boilerplate/

Tomcat12

Have fun! Any change you now make to the UI5 App is already reflected after a reload of the browser. Fantastic 🙂