UI5 lesson1

https://github.com/crazko/ui5lessons/tree/lesson1

Reasons

... ideme s dobou

R/2 from 1979

R/3 Dynpro

v4 from 1998

Webdynpro

from 2003

NWBC

from 2005

SAPUI5

from 2012

independent of device resolution => responsive

Connections

SAP UI5

OpenUI5 - open source

Fiori

SAP applications

Technologies

+ preprocessor

BUT...

Good to know

JSON

XML

MVC

Model-View-Controller

Model

Client side

JSON model
XML model
Resource model - translations mostly

Server side

OData model

one app <-> one main model

other models in their own namespace

Directory structure

 +---assets
|   +---css
|   +---img
|   \---js
+---i18n
+---model
+---util
|---view
|   +---detail
|   +---fragments
|   \---master
|
+---Component.js
\---index.html

what can we do

little preview
apps independent of

devices
backend (SAP connection available)

translations
custom themes - https://themedesigner.hanatrial.ond emand.com/
test
extend

Development

Notepad

...

Eclipse + Developer Tools

Sublime Text

Fast Designer

SAP Web IDE

Substitution

Miles plus

...

SAP interconnection

authorization

Before we start

OpenUI5

API

JSON

JavaScript Object Notation

number
string
boolean
array
object
null

http://jsonformatter.curiousconcept.com/

Simple Page

start with HTML

https://github.com/crazko/ui5lessons

IMPORT Library

 <script id="sap-ui-bootstrap"
		src="path/to/library.js"
		data-sap-ui-theme="sap_bluecrystal"
		data-sap-ui-libs="sap.ui.commons"
></script>

CDN

https://openui5.hana.ondemand.com/resources/sap-ui-core.js

 <script src="assets/js/app.js"></script>

ADD Button

new sap.ui.commons.Button();

icon - try to add custom image

Icon Explorer

action after press event