So lets startup with one by one concept.
1. Create a HTML page something like xyz.html
2. Add the HTML5 doctype definition: <!DOCTYPE html>” in the first line and the Internet Explorer-specific meta tag :<meta http-equiv=”X-UA-Compatible” content=”IE=edge” />” are the beginning of <head> element.
This ensures that all browsers use the latest version of their rendering engine. Although Microsoft Internet Explorer is not really used widely on mobile devices and not yet supported by the SAPUI5 mobile library, this meta tag makes the page more future-proof.
3. Add a second meta tag: <meta http-equiv=”Content-Type” content=”text/html;charset=UTF-8″/>.
This lets all browsers treat the file as UTF-8 encoded (assuming that you use this encoding when editing/saving the file)
4. Add a <div> element to <body>.
5. The “sapUiBody” class should always be added to the <body> tag to initialize font and colors for the whole page:
<body class=”sapUiBody”> <!– This is where the App will live: –> <div id=”content”></div></body>
<script src= “http://<http://<server>:<port>/sapui5/resources/sap-ui-core.js” id= “sap-ui-bootstrap” data-sap-ui-libs= “sap.m” data-sap-ui-theme= “sap_mvi”> </script>
Note that you are only loading the “sap.m” control library and the “sap_mvi” theme. mvi stands for Mobile Visual Identity and is the name of the SAP Mobile design.
7. Replace <server> and <port> with your local SAPUI5 installation or point to the SAPUI5 libraries on SAP HANA Cloud Platform: https://sapui5.hana.ondemand.com/resources/sap-ui-core.js
Continue my next tutorial SAPUI5 Beginners tutorial part 2