JSFoo 2018

JSFoo 2018

On JavaScript and Security

Ashish Anand


Developing responsive UIs with no coding

Submitted Aug 29, 2018

SAP Fiori elements provide designs for UI patterns and predefined templates for commonly used application patterns. You can use SAP Fiori elements to create SAP Fiori applications based on OData services and annotations requiring no JavaScript UI coding. The resulting app uses predefined views and controllers that are provided centrally, so no application-specific view instances are required. The SAPUI5 runtime interprets the metadata and annotations of the underlying OData service and uses the corresponding views while starting the SAP Fiori application.

The predefined views and controllers ensure UI design consistency across similar apps. The metadata-driven development model also significantly reduces the amount of front-end code for each app. This means that the developer can focus on the business logic.

By using the wizard for creating projects in SAP Web IDE, you can generate an SAP Fiori app based on SAP Fiori elements. The following SAP Fiori elements are available:


oData Introduction
OData (Open Data Protocol) is an ISO/IEC approved, OASIS standard that defines a set of best practices for building and consuming RESTful APIs. OData helps you focus on your business logic while building RESTful APIs without having to worry about the various approaches to define request and response headers, status codes, HTTP methods, URL conventions, media types, payload formats, query options, etc. OData also provides guidance for tracking changes, defining functions/actions for reusable procedures, and sending asynchronous/batch requests.

List Report
You can use the list report template to work with a large list of items. It combines powerful functions for filtering large lists with different ways of displaying the resulting item list.

Object Page
On the object page you can display, edit, and create objects, as well as save drafts. It is suitable for both simple objects and more complex, multi-faceted objects. The object page view offers the best possible support for multiple devices.

Overview Page
An Overview Page is a data-driven SAP Fiori app based on SAPUI5 technology for organizing large amounts of information. Information is visualized in a card format, different cards for different types of content, in an attractive and efficient way. The user-friendly experience makes viewing, filtering, and acting upon data quick and simple. While simultaneously presenting the big picture at a glance, business users can focus on the most important tasks enabling faster decision making as well as immediate action.

Speaker bio

Have a total experience of 7+ years in software development at SAP Labs, Bengaluru, my key technical skills are software design, SAP UI5, SAP HANA MEAN Full Stack development. Have a strong knowledge about software design and OOPs based development.




{{ gettext('Login to leave a comment') }}

{{ gettext('Post a comment…') }}
{{ gettext('New comment') }}
{{ formTitle }}

{{ errorMsg }}

{{ gettext('No comments posted yet') }}

Hosted by

JSFoo is a forum for discussing UI engineering; fullstack development; web applications engineering, performance, security and design; accessibility; and latest developments in #JavaScript. Follow JSFoo on Twitter more