SAP UI5 & Fiori

 

Introduction:

• Introduction to SAP UI5
• Introduction to SAP Netweaver Gateway
• Introduction to SAP Fiori
• Difference between UI5/Fiori, Webdynpro & other Web Technologies

 

ABAP Basics:

• SE11  ABAP Data dictionary
• SE37  Function Builder , BAPI/RFC. SE24  Class Builder ( OO Principles )
• Visibility ( Public/Protected/Private ) Static/Instance Variables, Constants Static/Instance Methods, Method Parameters
• Inheritance, Abstract Methods, Abstract Classes, Casting
• Interfaces, Interface Methods
• Polymorphism, Method Overriding,

 

SAP Netweaver Gateway – OData Services

• Gateway Architecture Overview & Usage
• Technical Components Involved Introduction to REST, OData OData advantages
• Introduction to OData formats JSON and XML Structure of an OData Service
• Service Document, Service Metadata Document

 

OData in SAP Solutions

• Transaction codes & Tools EDM data types
• SAP NetWeaver Gateway Toolset, Service Builder
• Introduction to OData Service Creation Behavior of Various Runtime Classes Behavior of Various Standard Methods

 

Data Model

• Entity Types Entity Sets
• Properties , Navigation Properties
• Association ( Referential Constraints, Principal Entity, Dependent Entity ) Association Set( Principle Entity Set, Dependent Entity Set )
• Cardinality
• Mappings
• HTTP Status codes, Common Messages and Common Errors
• Debugging oData ABAP Services

 

Runtime Artifacts Model

• Provider Base Model
• Provider Extension
• Data Provider Base
• Data Provider Extension

 

Service Maintenance

• Registration in Hub Systems ( ECC/CRM/SRM/SCM/BI )
• Maintain Error log Gateway Client

 

With & Without Mapping in Odata Services

• BAPI’s with Mapping
• BAPI’s without Mapping
• Multiple BAPI’s with Single EntitySet

 

CRUD Operations in Odata Services

• Create
• Delete
• Update
• GetEntity ( Read ) GetEntitySet( Query )
• Filtering and Projecting ($filter, ?search and $select)
• Sorting ($orderby) , Counting ($count)
• Client-Side Paging ($top, $skip, and $inlinecount)
• Inlining ($expand) , Formatting ($format)

 

Function Imports in Odata Services

• Single function import
• Multiple function imports
• Multiple parameters for function Import

 

File Handling in Odata Services

• File Upload
• File Download

 

MVC Architecture:

• Models
• Views
• Controllers

 

Configuration and Maintenance of Gateway

• SPRO related Configurations
• SICF related Configurations

 

SAP UI5 ( User Interfaces 5 )

Introduction

• Installation of SAPUI5 Plug-ins
• Development Environment & Configuration Setup
• Documentation Toolkit, API Reference & Help Links

 

Types of Models

• Resource Model,
• JSON Model,
• XML Model,
• OData Model

 

Bindings

• One-way Binding, Two way Binding
• Data binding
• Model binding

 

Data Types

• SAPUI5 Data Typing, User types
• Integers, Floating-Point Numbers
• String, Boolean ,Variable, Date and Time,

 

Types of Views

• Html Views,
• JavaScript Views,
• Xml Views,
• Json Views

 

Themes & CSS

• Adapting CSS , Layout Adaption
• SAP Theme Designer Tool
• I18N Resource Model ,Multilingual Applications
• Debugging SAP UI5 Apps

 

Types of SAP UI5 Controls

• Simple Controls,
• Complex Controls,
• UX3 Controls,
• Value Holders,
• Layouts,
• Dialogs

 

Various Libraries and Packages in SAP UI5/Fiori

• sap.m  ,  sap.ui.commons, sap.me, sap.viz, sap.ushell
• sap.ui*  ( layout, table, model, unified, etc…..),

 

SAP UI5 Screen Elements & Controls

• Properties, Aggregations
• Events, Methods
• Application Header, Paginator, Text Field, Text Area, Link To Action
• Image, Image Map, Horizontal Divider
• Panel, Splitter { Vertical, Horizontal }
• Checkbox,  Radiobutton, DropDown
• HTML, Progress Indicator, Slider, Range Slider
• Roadmap, TabStrip, FormattedTextView
• Date Picker, Date Range Scroller, Date Range Slider
• Dialog Box, Message Box

 

Table Complex Screen Element

• Table with various Screen Elements
• Table with Formatter Functions
• Row Repeater

 

Charts/Graphs

• Bar, Column, Line, Area,
• Pie, Donut chart etc.

 

SAP UI5/FIORI Communication with SAP Backend & Non-SAP Backend

• Via oData ABAP Service with CRUD operations
• Via oData ABAP Service with RFC/BOR
• Via oData HANA Service
• Via oData External Services

 

General Functionalities

• Capturing values & Assigning values to Screen Elements
• Enable-Disable screen elements
• Visible-Invisible screen elements

 

Creating FORMs

Navigation between Views

Implementing code in VIEWs and CONTROLLERs Technique

UI5/FIORI Front End methods

• BindElement, BindRows, BindItems,
• Create, Update, Remove methods

File Handling

Deploying SAP UI5 apps to SAP ABAP UI5 repository

 

SAP FIORI

• Introduction
• Types of Fiori Apps
• Architecture
• SAP WEB IDE Tool Configurations Enhancements
• End-to-End scenarios in Fiori
• Import & Export of SAP Fiori Apps
• XML Views
• JS Controllers

 

Mobile Library Screen elements ( sap.m )

• Label, Button, Input, Link, Image,
• Text, Text Area, Check Box, Switch, Slider, Rating Indicator, ProgressIndicator Select, Radio button,
• DateTimeInput, DatePicker,
• Standard Tile, MessageToast, Panel, Carousel, IconTabBar, IconTabFilter
• Forms
• Table, Table Column
• Table with Various Screen Elements
• Functions/Methods Formatter

 

Functions in Fiori Debugging

SAP Fiori Apps Adapting

CSS to SAP Fiori Apps I18N & Resource Model in Fiori Extension Projects & Extensions Layout Editor for XML Views

 

Developing SAP Fiori Like Apps

• Full Screen APP
• Master-Detail App

 

Deploying SAP Fiori apps to SAP ABAP UI5 repository

 

Fiori Launch Pad Configuration

SAP Fiori Mobile Client

HTML5    ( Hyper Text Mark Up Language )

• Creating Web page
• Html Page Structure
• Basic tags
• Formatting tags
• Forms and Input tags
• Frames and Image tags Audio ,
• Video tags
• Links, List tags
• Table tags
• Styles & Semantic Tags
• Programming (Script) tag
• HTTP Status Messages

 

CSS     ( Cascading Style Sheet )

• – CSS Properties
• – Types of Style sheets( Internal, External, Inline )
• – CSS comments
• – Box model, padding, border, margin
• – Classes
• – Div and Span
• – Working with colors- Background images
• – ID’s, child selectors, pseudo classes
• – Styling links, styling lists
• – Rounded corners
• – Linear gradient ,Float and clear
• – New Tags for the layout

Scripting

• – Statements and Comments
• – Finding Errors
• – Variables, Scope of Variables, Data Types
• – Operators
• – Functions, Functions with Parameters
• – Function with Multiple Parameters
• – Statements if, else, nesting if, Complex Conditions, Switch
• – Conditional Ternary Operator
• – while loop, for loop
• – Strings, String Methods
• – Arrays, Array Methods
• – Objects, Properties & Methods
• – Referencing elements in Script