wdf2025-fiori-innov-day-building-blocks
A SAP Fiori Innovation Day Walldorf hands-on session that builds a flexible travel dashboard from freestyle SAPUI5, SAP Fiori elements templates and building blocks.
Written for SAP Fiori Innovation Day Walldorf, the exercises start from a CAP back end based on the SFLIGHT sample service and adapted from cap-sflightSAP-samples/cap-sflightA travel-booking reference application built with CAP and SAP Fiori elements, whose same UIs run against a Node.js and a Java backend so the two stacks can be compared directly.sap official, cap, generate a Fiori elements Custom Page app bound to the CAP Travel service and enrich it with annotations and SAPUI5 integration cards, then add an Object Page with grouped form sections and a related Bookings table. The bonus exercise applies what the README calls the flexible programming model: a custom geo map section, a FilterBar and Table in an extension, and a controller extension injecting business validation, without forking the standard controllers. Exercise 0 sets up the development space in SAP Business Application StudioSAP Business Application StudioSAP's development environment for business applications, delivered as a cloud service and opened in a browser, where work happens in preconfigured dev spaces.sap official, btp, and the README's Requirements section states no special requirements. It stops at the UI: the CAP back end is given, and the README points at cap-sflight for the CAP patterns themselves.
Facts
Where it sits
Who is behind it
In the atlas: maintains 222@SAP-samplesmaintainerianquigley-sapContributes to this
In the atlas: contributes to 1@ianquigley-sapStefan EngelhardtContributes to this
In the atlas: contributes to 5, wrote 1@stefan08162 contributors
What it declares
Every artifact
- Type
- Sample
- Origin
- By SAP
As a sample
- Form
- Workshop or CodeJam material
Connections
Describing a service so a Fiori client renders it without UI code
Browser-based development environment with dev spaces
Download
README
quoted from SAP-samples/wdf2025-fiori-innov-day-building-blocks under Apache-2.0, readFiori Innovation Day Walldorf
Flexibility at Scale with Freestyle SAPUI5 and SAP Fiori elements
Description
This hands-on session for SAP Fiori Innovation Day Walldorf guides you through building a flexible travel dashboard and object-centric UX by combining freestyle SAPUI5, SAP Fiori elements templates and building blocks (tables, filter bar), and the flexible programming model (custom sections, controller extensions). You start from a proven CAP back end based on the SFLIGHT sample service (adapted from the public repository: cap-sflight). That repository is well worth exploring separately for deeper CAP patterns (service definitions, draft handling, data model evolution, analytical queries etc.).

Overview
Across the exercises you will:
- Set up your development space in SAP Business Application Studio (Exercise 0).
- Generate a Fiori elements Custom Page app bound to the CAP Travel service and enrich it with annotations and SAPUI5 integration cards (Exercise 1).
- Add and structure an Object Page with grouped form sections and a related Bookings table (Exercise 2).
If you have extra time, you can try the following bonus exercise
- Apply the flexible programming model: custom geo map section, FilterBar + Table in an extension, and a controller extension injecting business validation (Exercise 3).
Key learning outcomes:
- How metadata drives UI generation and reduces boilerplate.
- How to extend with freestyle XML fragments while retaining Fiori elements consistency.
Topics covered in the bonus exercise:
- Reuse of building blocks (Table, FilterBar) in both template and custom contexts.
- Implementing controller extensions for conditional logic in SAP Fiori elements without forking standard controllers.
Requirements
No special requirements.
Exercises
Start with Exercise 0 to set up the environment before proceeding sequentially; each exercise builds on the previous one. Enjoy exploring flexibility at scale!
Contributing
Please read the CONTRIBUTING.md to understand the contribution guidelines.
Code of Conduct
Please read the SAP Open Source Code of Conduct.
How to obtain support
Support for the content in this repository is available during the actual time of the online session for which this content has been designed. Otherwise, you may request support via the Issues tab.
License
Copyright (c) 2025-2026 SAP SE or an SAP affiliate company. All rights reserved. This project is licensed under the Apache Software License, version 2.0 except as noted otherwise in the LICENSE file.
Details
Sources
Sources are graph entities: the same page may back several entries, and an unreachable source flags every row that rests on it.
Compatibility and provenance
Flavors
“This hands-on session for SAP Fiori Innovation Day Walldorf guides you through building a flexible travel dashboard and object-centric UX by combining freestyle SAPUI5, SAP Fiori elements templates and building blocks (tables, filter bar), and the flexible programming model (custom sections, controller extensions).” — SAP-samples/wdf2025-fiori-innov-day-building-blocks — README, Description
“This hands-on session for SAP Fiori Innovation Day Walldorf guides you through building a flexible travel dashboard and object-centric UX by combining freestyle SAPUI5, SAP Fiori elements templates and building blocks (tables, filter bar), and the flexible programming model (custom sections, controller extensions).” — SAP-samples/wdf2025-fiori-innov-day-building-blocks — README, Description
Contributors
History in the atlas
- First seen.
For your agent
- Ref
artifact:sap-samples-wdf2025-fiori-innov-day-building-blocks- JSON
- /artifacts/sap-samples-wdf2025-fiori-innov-day-building-blocks.json
- MCP
- Connecting an agent