SAP UI5. Installing Eclipse, Apache Tomcat

💡
Версия на русском: SAP UI5. Установка Eclipse, Apache TomCat

Instead of a Preface

The topic of SAP UI5 has long been circulating among SAP consultants and developers. As of today, opinions on this technology are split into two camps: some argue it's unnecessary and stick to the good old Z* and maybe an ALV, while others are convinced that it's essential to move—if not to the cloud — then definitely to the web (without denying the continued relevance of good old Z*). The second group is of interest to us, and therefore so are the technologies used to implement project tasks.

So, SAP UI5

One of these technologies is SAP UI5. I won’t act as a promoter of this technology just yet—that’s better left to the dedicated experts. Instead, I’ll take on the role of a behind-the-scenes enthusiast.

SAP UI5 is a framework used for developing user interfaces (for both mobile devices and workstations), leveraging the synergy between HTML5 and JavaScript. There's plenty of information online about the framework and the mentioned technologies. As for the topic of this note, let me begin by referencing the official documentation on the vendor’s portal:

See SAPUI5 (help.sap.com)
See Documentation

What Will You Be Writing About Here, Blogger?

This note will cover the setup of a consultant's workstation, for those intending to work with SAP UI5. And yes, we won't be needing SAP itself just yet.

In this context, setting up a consultant's workstation means installing an editor that will become your primary tool for a while.

SAP suggests at least two platforms you might consider working with:

As you’ve probably guessed, we’ll be discussing Eclipse further.

Prerequisites

Make sure the following are installed on your machine:

Depending on your operating system, there are several mandatory configurations you need to perform for JAVA.

See FAQ How do I run Eclipse?  (for Windows OS)
See FAQ Does Eclipse run on any Linux distribution?

Installation

Go to the SAP Development Tools website and look for the SAPUI5 section.

Here you'll find information about the Web IDE and Eclipse development environments. Regarding Eclipse, there are two available versions: Oxygen and Photon. A comparison table is also available on SAP Development Tools. I chose the Oxygen version and downloaded the corresponding  Eclipse IDE for Java EE Developers distribution.

After launching the editor, go to the menu: Help → Install New Software…

Install additional plugins/libraries needed to work with SAPUI5 in Eclipse by copying the URL from the SAP Development Tools site.

Mark the following two components for installation:

  • ABAP Development Tools for SAP NetWeaver
  • UI Development Toolkit for HTML5
See: SAPUI5: UI Development Toolkit for HTML5 - SAP Help Portal (PDF)
See: Installing ABAP Development Tools for SAP - SAP Help Portal (PDF)
See UI Development Toolkit for HTML5 (SAPUI5)

After installation, restart Eclipse and check if you can now create a new SAP UI5 project by selecting: File → New → Other

In the Wizards field, type: ui5 → Application Project

First step complete.

Installing Apache Tomcat Web Server

To test SAP UI5 applications locally, a web server is required on the consultant’s/developer’s machine.

See Testing SAPUI5 Applications
See Test Your SAPUI5 Application on a Java Web Server

Apache Tomcat is an excellent fit for this purpose.

See Apache Tomcat

At the time of writing, the current version of the web server was 9.0.12.

Unzip the downloaded archive and perform some basic configuration of the web server.

See Windows service HOW-TO
See Apache Tomcat 9

The result of a successful setup should look like this:

0:00
/0:19

Configuring the Web Server in Eclipse

In Eclipse, select from the context menu: File → New → Other

In the Wizards field, type: Server

From the list, choose your web server version and click the link: Configure runtime environments…

Specify the path to the server distribution.

Done. The web server for the Eclipse development environment on Windows is now configured!

I’ll try to cover how to use all of this in future notes. Shaking your hand.