From ABAP to SAPUI5

The aim of this article is to show you why the ABAP Developer profile has evolved into a Fullstack Developer profile or, more generally, a SAP Technical Consultant.

This article is a very high-level overview of SAPUI5 and SAP Fiori technologies.

Firstly, what is ABAP?

If you work with SAP, you’ve probably already heard of ABAP, but here’s a quick recap.
ABAP is for “Advanced Business Application Programming”, is a programming language created and used by SAP to develop business applications.

ABAP is a multi-paradigm programming language, developers can use procedural, object-oriented, and other programming concepts.
It’s an easy-to-learn programming language.

ABAP was born in 1983, but over the years, many improvements have been made to the ABAP language, increasing what programmers could do with it. Especially in the last few years with the arrival of S/4HANA and ABAP in the Cloud.

As more and more cloud-based solutions emerged, ABAP developers began to worry about the ABAP’s future. However, today, ABAP remains clearly relevant, thanks to S/4HANA and the ABAP Cloud Platform (SAP BTP).

ABAP is not dead!

But … of course there is a but … The new SAP’s UX direction highlighted new terms such as “SAPUI5”, “SAP Fiori”, (UX means User Experience).
But ABAP is not going to be replaced by “SAPUI5”. In SAP’s current architecture, they are complementary, not enemies.

So, what about SAPUI5?

SAPUI5 means “SAP UI Development Toolkit for HTML5”.

So, it’s a toolkit or a framework that enables developer to easily build web applications.
It’s a client-side tool based on open standards like JavaScript, CSS3 and HTML5.

It allows you to easily decouple the frontend development of your applications from the backend development.

SAPUI5 provides the following features (non-exhaustive list):

• One consistent UX for all your apps.
• Responsive across browsers and devices.
• Full translation support
• Theming support based on CSS3
• Accessibility and Keyboard interaction support
• Rich UI controls for handling complex UI patterns

SAPUI5 Architecture (high-level)

When a user accesses a SAPUI5 application, a request is sent to the appropriate server to load the program into the browser.
The view accesses the relevant libraries. In general, the model is also instantiated, and business data is collected from the database.

SAPUI5 can be used on multiple environments. For example, libraries or applications can be stored on an SAP Netweaver Application Server (AS) or on SAP Business Technology Platform, and business data can be retrieved using the OData model on SAP Gateway.

Model View Controller (MVC)

MVC is a software architectural concept that divides applications into three connected parts: the model, the view, and the controller.

Each part has its own responsibilities: The Model manages the application data.
The View is responsible for defining and rendering the UI.
The Controller reacts to view events and user interaction by modifying the view and the model.

The MVC concept is an integral part of SAPUI5 application development.

This concept has the following advantages:

• Better readability
• Better maintainability
• Better extensibility
• You can change the view without touching the underlying business logic
• Multiple views of the same data can be defined.

OpenUI5

SAP provide two deliveries of its UI development toolkit. Both are very closely related but have their differences.

The main difference is the license, OpenUI5 is free to use, released under the Apache 2.0 license.
For its part, SAPUI5 isn’t really an SAP product with his own license, it’s integrated for example in the following products: SAP HANA, SAP BTP, SAP Netweaver 7.4 or higher, …

There are also a few differences in libraries, but the core containing all central functionality and the most used control is identical in both deliveries.

So OpenUI5 also gives you all the important features needed to build feature-rich web applications.

And SAP Fiori?

To keep it simple, SAP Fiori is the new user experience (UX) for SAP software.
It’s a design paradigm or design language for the new SAP’s UX.

There are five design principles for SAP Fiori

The core of SAP’s UX strategy is people. SAP wants consumers to find its products simple, intelligent, coherent, and interactive.
SAP regularly improves its products and applications in response to customer feedback.

A well-designed user interface is extremely important in terms of both human-value and money-value:

• Increased user satisfaction
• Greater solution adoption
• Greater customer loyalty
• Improved productivity
• Lower training costs
• Fewer change requests
• Decrease errors
• Etc…

These values can have a big influence on a company’s performance and success.
The SAP Fiori goal is keeping things simple and easy to use, It’s a user-centered design.

SAP Fiori uses SAPUI5 technology, and it can run on all devices.
User can work seamlessly on desktop, tablet or smartphone (responsive design).
There are also two native mobile design languages, one for IOS and one for Android.

You can find a lot of information on SAP Fiori design guidelines following this Link

My conclusion

SAP technologies are constantly evolving, and as a technical profile it’s important to stay up to date.
It’s not always easy, and it takes a lot of time, however, if you want to have an attractive profile on the job market, I think it’s essential.

Considering all latest SAP technologies, I think it’s evident that the role of “ABAP Developer” must evolve into a “SAP Fullstack Developer”.

A SAP Fullstack Developer works both the frontend and backend components of an application. This requires some versatility, you have to know various programming languages, you have to use different tools, for example to create the UI, to develop the server-side logic, for the database, …
Additionally, you need to be very familiar with SAP architectures and you should also have some notion of DevOps (Development and Operations).

Becoming a SAP Fullstack developer has been my personal goal for several years now.
Currently I’m focus on improving my frontend skills (SAPUI5) with SAP Trainings (UX400-402-403-410), and in the future, perhaps obtaining a SAP certification about SAPUI5/SAP Fiori.