#HTML5, #OpenUI5, #SAPUI5 and #SAPFiori… How are they working together?
It started from a question by a customer:
“What should we implement SAPUI5 or SAP Fiori or HTML applications?”
I was thinking that this question was just an isolated misunderstanding caused on the low experience on web development technologies, but after few weeks presenting SAP Fiori across several customers this question was popular; in each presentation there was at least a similar one.
“Why we should implement UI5, we want SAP Fiori?”
“Should we use OpenUI5 or SAPUI5?”
“We do not want any SAP proprietary technology, we would like to use commercial standard HTML5 and jQuery”
The doubt was raising time by time and I tweeted this and some of my followers engaged with me on this topic.
Do you know the relationship between the UI terms used nowadays in SAP?
Let’s try to have a recap and clarify…
UI5 vs SAP Fiori
An easy way to clarify the difference between the two can be resumed in this easy comparison when you build an house.
The house is the final product built following the architecture best practice (SAP Fiori application), the tools are the instruments and materials that you used to build it (SAPUI5).
“SAP Fiori is the new user experience (UX) for SAP software. It applies modern design principles for a completely reimagined user experience. SAP Fiori UX represents a personalized, responsive and simple user experience across devices and deployment options.” (https://experience.sap.com/fiori/)
SAP Fiori is the paradigm that drives the development of new SAP UX. SAP Fiori can also refer to the set of application (600+) that have been build using the SAP Fiori paradigm. You can find the list of all the SAP Fiori apps at Fiori Apps Library.
SAPUI5 is the framework that you use to build SAP Fiori applications, so it is the collection of tools.
SAPUI5 comes into two main flavors:
- Main (formerly Mobile) (sap.m) that collects a set of components that are mobile ready and are auto adaptive to the device that is used (e.g. Smartphone, Tablet, Desktop) delivering the same user experience. SAP Fiori applications are based on this library. This library has to be preferred for new applications.
- Desktop (sap.ui) has been used as the “Desktop” experience for UI5 applications. The components are designed for being used on big screen (i.e. Desktop) and they are not adapting based on the device used. SAP UI add-on for SRM is based on this library.
Now it is time to understand better the tools. Which is the relationship between SAPUI5 and other technologies such as HTML5, OpenUI5 and jQuery?
SAPUI5 is a library built on top of other libraries, mostly open source, and industry standard languages.
Lets start from the bottom…
These are the most common languages used for web application development.
- HTML5 (HyperText Markup Language) is a markup language used for structuring and presenting content on a web page.
- CCS3 (Cascading Style Sheets) is a style sheet language used for representing a content defined in a markup language.
jQuery also provides a set of features that allows developers to create animations and handle events easily.
sapmentors played a great role on this accomplishment suggesting and promoting the cause, 13 reasons why SAP should open-source SAPUI5 by Jan Penninkhof, and finally at SAP TechEd Bangalore in December 2013 it was announced.
openUI5 vs SAPUI5
openUI5 and SAPUI5 are basically the same framework, the only difference between the two is that SAPUI5 contains some other extra libraries such as API for Analysis Path Framework (APF), SAP Collaboration for Social Media Integration and viz charting library, that are not open source so cannot be included in the open source version.
This blog wanted to be an easy overview on the differences and relations between the terminologies used in these days for SAP UI applications.
Please share your thoughts in order to improve it and share the knowledge across SAP Community.