Overview:
This blog is intended to people / customers who are implementing SAP Portal solutions and have not yet upgraded their systems to latest and greatest but wish to have their applications developed based on SAPUI5. I have been seeing few questions on forums people asking how to build SAPUI5 applications and deploy them to the SAP EP 7.0. Also, how do we create iViews based on these deployments as there are no templates available to create SAPUI5 iViews as in newer versions like Portal 7.3 and even versions like SAP EP7.01 SP30 and above.
Solution:
I am going to show just a basic example of how to create a Web application project in SAP IDE 7.0, add the project into an EAR application, deploy them to the server and create iViews in Portal.
1) Open your NWDS and create a Web Module Project. (File > New > Web Module Project)
2) In the WebContent Folder Create a html file and name it as index.html
3) Build your SAPUI5 code into the html file. I have all my code in here but MVC pattern is also supported just in case you need to have the view, controllers, models separately.
<!DOCTYPE html> <html><head> <meta http-equiv='X-UA-Compatible' content='IE=edge' /> <title>Hello World</title> <script id='sap-ui-bootstrap' src='https://openui5.hana.ondemand.com/resources/sap-ui-core.js' data-sap-ui-theme='sap_bluecrystal' data-sap-ui-libs='sap.ui.commons'></script> <script> var btn = new sap.ui.commons.Button({ text:'Hello: Deply Me to EP 7.0', press: function() { alert("Successfully Deployed to EP 7.0!") } }); btn.placeAt('content'); </script></head><body class='sapUiBody'> <div id='content'></div></body></html>4) Create a New EAR Project.
5) Add the Modules to the EAR Project.
6) Generate the Archive Files.
7) Deploy them to the SAP J2EE Engine.
8) Run the application in a browser with the following URL https://<hostname>:<Port>/<WebModuleProjectName>/index.html
9) Go to your Enterprise Portal and create a New iView from Template
10) Select the URL iView and give the URL of the application you deployed.
11) Finish the iView creation and open the iView details. You can define a http system and then use them as a prefix instead of giving the full URL that way when you transport to different environments you do not end up doing manual activities to change the URL to point to the particular server.
12) Preview the created iView.
That's it !!! We have deployed SAPUI5 to SAP EP 7.0 Application Server. Enjoy 