Practical Guide to SAP OpenUI5

Part of:

Language

English

Pages

146

Edition

Level

Expert

ISBN

9783960126775

ISBN Print

9783960120995

E-Books

or access all content

Flat rate

$19 per month

Single license
1000+ eBooks and video tutorials
Instant access
12 months($228per year)
Automatic renewal

More options

Already have an account? Sign in here!

More Details

This book offers a comprehensive introduction to SAP Open UI5. The authors expertly bring readers up to speed on SAP UI5 technology utilizing Java Script, HTML, and CSS, and they explain, step by step, how to transition from traditional systems to handheld and mobile devices. Learn more about key OpenUI5 concepts including bootstrapping, controls, views, models, and data binding. Review your library options including JavaScript and CSS, and learn how to use them to increase available functionality. Walk through how to install the UI development toolkit library and set up the development environment. Learn how to leverage controls and evaluate when to use native JavaScript or the OpenUI5 library. Dive into SAP Fiori for SAP applications and walk through five key design principles. See practical examples of how to create applications using UI5. By using practical examples, tips, and screenshots, the author brings readers who are new to SAP Open UI5 up to speed on the fundamentals.

Fundamental OpenUI5 concepts
How to define controls for an application
SAP Fiori applications and design principles
Real-world examples of how to create applications using UI5

Reading Example

2.3 Eclipse installation

An easier way of developing UI5 is by using Eclipse IDE (http://www.eclipse.org/downloads/) in addition to the SAP development toolkit (https://tools.hana.ondemand.com/) and Apache Server. Before Installing Eclipse, we need to install the latest Java JDK version. Eclipse Luna and Kepler are the versions currently supported for SAP tools, with Luna being the well-revised version.

For Eclipse installation, follow the steps below:

Download Eclipse IDE for java developers—Luna version. Extract all the files from the zip folder and run the eclipse.exe file. A window pops up, asking you to provide your workspace folder path. Workspace is where all your programs, servers and metadata are stored.
After Eclipse, we need to install the SAPUI5 toolkit. On the Eclipse main window (menu bar) click on Help followed by Install New Software, as can be seen in Figure 2.4. This opens a pop-up window where you create a repository for storing SAPUI5 toolkit contents and provide appropriate Name and Location (provide URL https://tools.hana.ondemand.com/luna/ in the location field).

Open-UI5

Figure 2.4: Install new software

A list of items appears that are available under that URL. To develop SAPUI5 applications we only require ABAP Development Tools and the UI5 development toolkit for HTML5. If you wish to use UI5 with HANA, you can select SAP HANA tools and the HANA cloud platform. Click on Next and accept the terms. This initiates installation—ignore all the warnings you get.
Figure 2.5 shows how available software can be selected.

Open-UI5

Figure 2.5: Select available software

Now we will use the Eclipse wizard to create the application. On the Eclipse main window (menu bar) select File • New • Other. Scroll down and look for SAPUI5 Application Development underneath that, select Application Project and click on Next (See Figure 2.6). Provide any Project Name and select a Library you would like to use (it is recommended to start your program name with a Z if you wish to upload in the ABAP server). If you prefer to have a view, check Create an Initial View.

Open-UI5

Figure 2.6: Application project selection wizard

As seen in Figure 2.7, you need to provide a name for your view and the type of development paradigm. Then, select JavaScript and click on Finish.

Open-UI5

Figure 2.7: Create a new view—application project

You will be presented with all your resources and contents which include view.js, controller.js and html files. Under these files, we have to write code to build the application.
In later chapters, we will learn more about views, controllers and models, and their respective types. The example above is created using a view based on the MVC (Model-View-Controller) concept. We can also create an application without a view, but it is not recommended because it makes code management difficult and messy.
A server is required to deploy or run your application. There are various options for this such as the SAP NetWeaver Application Server (if you have access to SAP), which is recommended. In addition, local servers such as Apache can be used. For this example, let’s use a local server on Eclipse.
See Figure 2.8 for the working syntax of Eclipse.

Open-UI5

Figure 2.8: Working syntax of Eclipse

It is very easy to configure a server on Eclipse. In the menu bar click on Windows • Show View • Servers. In the bottom window click on the No servers are available link. A window pops up which consists of a list of servers. Next, select Apache and then select the Tomcat v7.0 server and click on Next. Provide the directory path and click on Download and Install. This creates a new folder under the Project Explorer tab, named Servers.

“Could not load Tomcat…” error solution

If you encounter the error “Could not load the Tomcat…”, close Eclipse. Copy all the files from Tomcat/conf folder and paste them in the Workspace/Servers/Tomcat v7.0 Server at localhost-config. Start Eclipse. On the left side, under Project Explorer, right-click on the Server folder and select Refresh.

With this, we have completed our installation. Now it’s time to run the application. Under Project Explorer, right-click on Program Name and select Run As • Run on Server. (OR) Click on the Run icon () shown on the menu bar. Finally select Run on Server.
Figure 2.9 shows the output in Eclipse.

Open-UI5

Figure 2.9 : Eclipse working output

Authors

Ratings

F. Zimniak
25.06.2019

Frequentlyasked questions

General questions and answers about our learning content.

Who is the learning content suitable for?

The learning content is designed for anyone who wants to gain SAP knowledge in a simple, compact, and practical way. Our learning platform offers content for beginners, advanced learners, and experts. This enables you to expand your knowledge step by step and continuously develop your skills toward becoming an SAP expert.

What makes the learning content special?

Our products—whether books, videos, or online training—deliver SAP knowledge concisely and practically, so you can apply it directly in your daily work, even if you have limited time. You benefit from a broad coverage of relevant SAP topics, high-quality content in four languages, and learning formats designed to fit your individual needs. This ensures that you can stay up to date and continuously develop your expertise.

What distinguishes our books from those of other providers?

Our books are characterized by a clear practical focus and a compact, easy-to-understand presentation. We explain complex SAP topics concisely—without unnecessary marketing buzzwords—so readers can quickly grasp the essentials and apply the new knowledge directly.

Can the product be exchanged?

Our print books can be returned within 14 days, in original condition. Return shipping is at your own cost.

How can I order a book outside of Germany?

We currently only ship books directly within Germany. If you are ordering from outside Germany, we recommend purchasing via Amazon. You can find the link by selecting “Buy eBook” on any product in our webshop and Amazon will then show you both the eBook and print versions available for purchase.

Alternatively, you can access all our content with a digital subscription, starting at $19 per month.

Who can I contact if I have questions?

Our team is always happy to help and will respond to your questions as quickly as possible (usually within 1–2 days). You can also contact us if you have questions for one of the authors. Email: contact@espresso-tutorials.com