SAP UI5 FIORI OData
SURYA
15 modules
English
Certificate of completion
Access for 365 daysor Max Viewing Time 240 hours
Learn SAP UI5, FIORI & OData for web app development
Overview
In this course, you will learn SAP UI5 FIORI OData, an essential framework for developing intuitive and user-friendly web applications. Discover how to design and develop stunning UIs using SAP UI5, leverage the power of FIORI for enhanced end-user experience, and effectively interact with data using OData services.
Key Highlights
Master SAP UI5 framework for web application development
Create visually appealing and responsive user interfaces
Enhance user experience with SAP FIORI design principles
Efficiently consume and expose data through OData services
What you will learn
Understand SAP UI5 Framework
Explore the fundamental concepts and architecture of SAP UI5, and learn how to build robust web applications.
Develop Stunning User Interfaces
Discover techniques to design visually appealing and responsive user interfaces using SAP UI5 technology.
Leverage SAP FIORI Design Principles
Gain insights into SAP FIORI design principles and learn to create engaging user experiences with ease.
Efficient Data Interaction with OData
Master the usage of OData services to effectively consume and expose data within your SAP UI5 applications.
Modules
Important link & materials
11 attachments • 5 mins
PPT - SAP UI5 FIORI OData - updated on 14 Nov 2023
271 pages
Notes on ERP, SAP, SAP Architecture, HTML & CSS
24 pages
Notes on JavaScript
26 pages
Notes on jQuery and Ajax
14 pages
Notes on NodeJS, NPM
8 pages
Notes on SAP UI5
31 pages
SAP UI5 FIORI OData - code snippets
SAP FIORI Community
SAP FIORI App library
SAP UI5 SDK website
Sample OData service by OData.org
ERP, frontend, backend, FIORI - Introduction
1 attachment • 51.42 mins
01 - SAP UI5 FIORI OData - Introduction session
SAP UI5 FIORI - pre-requisites
1 attachment • 52.58 mins
02 - Pre-requisites for SAPUI5 | Basics of HTML
HTML, CSS, JS, jQuery, Node JS, NPM
13 attachments • 10 hrs
03 - Basics of HTML
04 - HTML part - 2 & CSS Basics
05 - CSS part 2
06 - JS Basics
JS - examples with output
07 - Java Script part 2
JS - examples - 2
08 - Java script - 3
09 - JS & jQuery
10 - jQuery - Asynchronous, call back functions, client and serve architecture
11 - Ajax calls, Node JS
12 - Node JS, NPM - 2
Assignment - 1 - Load API data using AJAX call - display data in table format
Introduction to SAP UI5 FIORI OData
1 attachment • 55.63 mins
13 - SAP UI5 FIORI OData Introduction | What is FIORI ? | What is UI5 ? | What is OData ?
Getting Started with SAP UI5
16 attachments • 9 hrs
14 - UI5 Development tools
15 - Understanding UI5 Architecture, load and initialize application
16 - Load, initialize, controller - Building your first UI5 Application
16 - first sapui5 app code
Assignment - 2 - Input screen elements using SAPUI5 SDK
17 - View initialization - JS view, API Key points, Controller syntax, Webapp folder structure, MVC Pattern
18 - UI5 Execution flow, UI5 app with JS - view & controller with one example
18 - jsview app code
19 - XML Views & JS Controller
19 - XML View, JS controller - example code
3 - Assignment - XML View with buttons and input fields
20 - Basics of OO concept, controls hierarchy & view layouts
4 - Assignment - In view work with horizontal layout and vertical layout
20 - Basics of OO concept, controls hierarchy & view layouts - example code
21 - Base controller, model basics
21 - Global variable, controller hook methods, and base controller example code
Data Binding in SAP UI5
24 attachments • 8 hrs
22 - Understanding models and data binding - json model
22 JSON Model example code
05 - Assignment - JSON Model data with different radio buttons
23 - Implementing two way binding
23 - JSON Model, Implementing two way binding - example code
24 - Binding modes, getProperty, setProperty, Expression binding (simple validation), switch models
24 - example code
06 - Assignment - Try examples in sap.m.tables
07 - Assignment - switch between models on pressing button
25 - Table controls (table, column, rows), aggregation & element binding, model switch
25 - Model switch - example code
25 - table, aggregation & element binding example
8 - Assignment - Display gender image on table based on data (Use expression binding)
9 - Assignment - In table - display - amount with currency, rating indicator (Add 2 new columns)
26 - Part - 1 - Screen elements, formatting input data
26 - Part - 2 - formatting input data
26 - Screen elements, formatter - example code
Handling data validation and formatting
Coming Soon
27 - Resource model, XML Model, UX Design principles
27 - Resource model useful links
27 - Resource model example code
27 - xml model example code
10 - Assignment - Resource model Table heading with naming convention, Field label with general text
11 - Assignment - XML Model with multiple employee data
Advanced UI Techniques
24 attachments • 12 hrs
28 - FIORI Intro, FIORI Like app preparation, FIORI App Guidelines
Using UI elements and controls
Coming Soon
Creating responsive and adaptive UI
Coming Soon
29 - FIORI App like creation process with - Component.js, FIORI App Structure, simple app
29 - FIORI App like code
30 - Pages, Navigation, List items
30 - FIORI App Like - Template
30 - FIORI App with pages, navigation, list items
12 - Assignment - Prepare data model with three entity sets
31 - manifest.json, list item binding
31 - example code Manifest.json, List item binding, filter operations on items data
32 - list item operations, master detail app, split app
32 - example code for worklist application, page navigation with object header
32 - example code for split app
33 - Tab control, populate sub item data using aggregation binding
33 - Example code for SplitApp, Icon tool bar, sap.m.Table, simple form
33 - Example code for fragments
13 - Assignment - Add Tooltip on placing icon tool bar
34 - Dynamic fragments
34 - Example code - static fragment and dynamic fragment
14 - Assignment - Icon tab bar name, default one icon tab bar, pop up for table filter
35 - Dynamic fragments, load data to fragment
35 - Example code - Dynamic fragment, dynamic binding, pop screen with values, return back selected value to screen
15 - On Supplier filter, select multiple values, filter data accordingly with data in table
Working with OData Services
24 attachments • 10 hrs
Consuming OData services in SAP UI5
Coming Soon
36 - Introduction of OData
36 - Dynamic fragment popup & Introduction of OData
37 - Basics of ODATA CRUD operations in backend
37 - OData service test URL operation specific
38 - OData associations, navigation, $expand, testing, browser extensions, EPM data model generation
39 - OData - Project, entity, entity set, artifacts, - creation, publish service & testing
39 - UI5 - Table filter with selected values in POPUP
16 - GWSAMPLE - Products, Supplier - Test will all OData operations with detailed descriptive document
40 - OData - get, select, filter, search, create, update, delete operations
40 - Products - Get entity set - code
40 - Products - Get entity - code, with exception handling
41 - ODATA Post, Update, Delete, Association
41 - Create entity code for Product
41 - Update entity - Product
41 - Delete entity - Product
41 - Get entity set - Supplier
41 - Get entity - supplier ( for both normal & association with navigation )
42 - OData - Function import, working with images
42 - Function import - Max price, minimum price, category wise highest price
43 - OData Image & service generation
43 - Stream pre-requisites - MPC Extension
43 - DPC Extension - Get stream code
17 - Assignment - Practice odata project with Service Implementation
Introduction to SAP Fiori
2 attachments • 2 mins
Configuring SAP Fiori Launchpad
Creating SAP FIORI App
Enhancing SAP Fiori Apps
3 attachments
Extending SAP Fiori standard apps
Coming Soon
Customizing SAP Fiori themes
Coming Soon
Integrating SAP Fiori with backend systems
Coming Soon
Performance Optimization and Testing
3 attachments
Optimizing SAP UI5 app performance
Coming Soon
Debugging and testing SAP UI5 apps
Coming Soon
Performance testing strategies
Coming Soon
Deployment and Maintenance
1 attachment
Packaging and deploying SAP UI5 apps
Coming Soon
Cloud connector, cloud <--> on-premise, FIORI Template with odata service
5 attachments • 4 hrs
44 - Cloud connector
45 - Connect OData with UI5
46 - OData calls in UI5 ( Meta data, query, read, expand, pagination, search)
46 - Middleware notes
46 - Running notes for this session
UI5 Key concepts - Routing, navigation, data posting to OData, screen sizing
8 attachments • 8 hrs
47 - Routing and navigation
47 - Routing and navigation end to end example - test code
48 - Route match handler, & OData post
49 - OData Post operation
49 - OData data post with an example - code
50 - OData - read, delete, error log, picture, function import
50 - OData - Read, Delete, Error / Success log, Function Import, Images - example code
51 - OData Update, App deployment, FIORI App configuration
Certification
When you complete this course you receive a ‘Certificate of Completion’ signed and addressed personally by me.
FAQs
How can I enrol in a course?
Enrolling in a course is simple! Just browse through our website, select the course you're interested in, and click on the "Enrol Now" button. Follow the prompts to complete the enrolment process, and you'll gain immediate access to the course materials.
Can I access the course materials on any device?
Yes, our platform is designed to be accessible on various devices, including computers, laptops, tablets, and smartphones. You can access the course materials anytime, anywhere, as long as you have an internet connection.
How can I access the course materials?
Once you enrol in a course, you will gain access to a dedicated online learning platform. All course materials, including video lessons, lecture notes, and supplementary resources, can be accessed conveniently through the platform at any time.
Can I interact with the instructor during the course?
Absolutely! we are committed to providing an engaging and interactive learning experience. You will have opportunities to interact with them through our community. Take full advantage to enhance your understanding and gain insights directly from the expert.
About the creator
SURYA
SURYA is an experienced SAP Techno-Functional Consultant with over 10 years of experience. They offer training courses in SAP Core ABAP, SAP OO ABAP, SAP ABAP on HANA, SAP MDG Functional, and SAP MDG Technical, providing mentorship and guidance to help students secure jobs. SURYA's certifications in SAP ABAP on HANA and SAP UI5 FIORI OData ensure strong fundamentals and practical examples in their courses. Contact SURYA at info@StRightRoad.com for more information.
Rate this Course
₹ 5000.00
Order ID:
This course is in your library
What are you waiting for? It’s time to start learning!
Wait up!
We see you’re already enrolled in this course till Access for 365 daysor Max Viewing Time 240 hours. Do you still wish to enroll again?
