Course Description

What is SAPUI5?

SAPUI5 is a set of libraries to build responsive web applications that run on multiple devices like Desktop, Mobile, and Tablet. SAPUI5 works on MVC concept to accelerate the development cycle by creating data, business logic, and representation of data separately on the view. So the development of view and controller can take place independently to create models (data containers).

SAPUI5 is the latest in the series of SAP UI development technologies. In order to provide web integration for the underlying SAP ERP system, SAP came up with multiple UI development technologies like BSP (Business server pages), PDK (Portal development kit), Web Dynpro Java, Web Dynpro ABAP. And the successor of Web Dynpro ABAP is SAPUI5.

In this SAP UI5 tutorial for beginners, you will learn SAP UI5 basics like:

   ->.   What is SAPUI5?
   ->.   SAPUI5 Architecture
   ->.   SAPUI5 Component
   ->.   SAPUI5 Setup
   ->.   Part 1) Create Child Application
   ->.   Part 2) Creating a Parent Component

SAPUI Architecture Diagram

In the above Architecture, first box, i.e. 'Devices' indicate the devices on which UI5 applications run. UI5 applications can be accessed via a Mobile app or any browser on these devices. This layer of the architecture is called 'Presentation Layer.'

SAPUI5 applications and oData services reside on SAP NetWeaver Gateway Server. This layer of the architecture is called 'Application Layer.'

Actual business logic is implemented in SAP core systems like ECC, CRM, and BW, etc.… Business logic can be implemented using SAP programs and function modules. SAP transactional and Master Data reside on SAP systems. This layer of the architecture is called 'Database Layer' or 'Persistence Layer.'

SAPUI5 Component

A Component is a piece of working code that is reused wherever required. There are 2 types of components provided by SAPUI5

   ->.   UI Components – These represent a user interface containing UI
           elements. These are based on SPAUI5 Class called
           sap.ui.core.UIComponent
   ->.   Faceless Components – These do not have a user interface. These
           are based on SAPUI5 class called sap.ui.core.Component