For a sales-pitch we had to implement a SAPUI5 prototype within two weeks. A mighty framework met the busy-developer everyday life: giga-tons of documents, outdated, not-quite-fitting or vague examples and a small stackoverflow-community. At ui5con we would like to report on how we won UI5 for the light side of The Force. We think that three well-known, badly- or over-documented principles can get you started on ui5 very quickly: The event-bus, two-way binding and expression binding in XML-Views. Keeping those in mind we like to demonstrate the short time-to-market you can achieve with ui5 by the example of our prototype

1. Minimize time-to-market with UI5
UI5Con Frankfurt, Benjamin Steinvorth, eXXcellent solutions GmbH

2. #me
2 |
Benjamin Steinvorth
l HANA-Stack
l Senior Project Manager
eXXcellent solutions GmbH
l Stuttgart, Ulm, München
l Culture-driven Development
l ~100 People - Hiring!

3. Talk About Nice Things
3 |
Two-Way
Binding
Two-Way Binding
and MVC-Pattern
Event-Bus
Event-Bus and
Two-Way Binding
Nice!
Inter-Page
Routing
Aggregation-
Binding
Expression-
Binding
XML-Views and
Dynamic Controls
Nice! = Narrative + Imperative + Clean + Easy

4. 2-Way-Binding
Angebotspräsentation eXXcellent solutions4 |
Model View
2-Way-Binding
State of the View
is persistent in
the model
Model-attributes
used in the view
are always in sync
Pull all view-attributes
From a Model

5. Two-Way binding and MVC-Pattern
5 |
Model View
Controller
Model View
Controller
2-Way-Binding
Events
Manipulate
Manipulate
2-Way-Binding !!

6. Event-Bus
6 |
Criteria.controller.js
Consumer
Emitter

7. Event-Bus and 2-Way-Binding
7 |
Searchbar.ctrl
Event-Bus 2-Way-Binding
Criteria.ctrl
Preview.ctrl
Controls.ctrl
) addCriteria) setCrit
) updateData
:critEntered
:updatePreview
:adjust
Controls
:eventEmitter ) eventConsumer
XML-
View
XML-
View
XML-View
Controller Model
2-Way-
Binding

8. Inter-Page Routing
Angebotspräsentation eXXcellent solutions8 |
l What‘s the point in using a router
if I have to add all pages anyway?

9. Inter-Page Routing
9 |
/index.html#/customers
/index.html#/trans/2

10. Inter-Page Routing
10 |
https://openui5.hana.ondemand.com/docs/api/symbols/sap.ui.core.routing.Route.html#constructor
https://openui5.hana.ondemand.com/docs/api/symbols/sap.ui.core.routing.Targets.html#constructor
l Since March 2016:
l December 2015:
sap.ui.core.routing.Targets
???

11. Inter-Page Routing
11 |
Index.html
router.js

12. XML-Views: Dynamic Control Creation
Angebotspräsentation eXXcellent solutions12 |
„Your competitor told us that
XML-Views do not support
dynamic control creation.“

13. XML-Views: Dynamic Control Creation
13 |
Expression Binding
Aggregation Binding
JSONModel
XML-View
Property Binding

14. l Thank you!
l Questions?
Angebotspräsentation eXXcellent solutions14 |