Skip to Content
Author's profile photo Former Member

How to deploy a simple SAPUI5 application into ABAP server using Eclipse.

Hello All,

This blog explains you how to deploy a SAPUI5 application into ABAP server.

1. How to install Eclipse.

Installing eclipse-jee-juno-SR1-win32.


To download and install please visit the below link.


http://www.eclipse.org/downloads/packages/eclipse-ide-java-ee-developers/junor

/wp-content/uploads/2015/09/1_790544.png

Click on windows 32-bit, it will download one zip file.


Go to the eclipse download path and extract the eclipse juno rar file. Open the eclipse folder and double click on eclipse.exe


Note: Before doing that we have to install jdk in our system. And set the jdk path.


2. How to install SAPUI5 packages in Eclipse.


Click Help > Install new software.

/wp-content/uploads/2015/09/2_790545.png

Click on “Add” button.

/wp-content/uploads/2015/09/3_790546.png

/wp-content/uploads/2015/09/4_790550.png

In the above window specify Name as sapui5 and in Location give the below link and Click “ok”.

https://tools.hana.ondemand.com/juno

/wp-content/uploads/2015/09/5_790551.png

Click on Select All and Click Next.


/wp-content/uploads/2015/09/6_790552.png

Choose I accept the terms of the licenses agreement and Click on Finish.


/wp-content/uploads/2015/09/7_790553.png


3.How to Install Tomcat 7


To download Tomcat visit the below link.

http://tomcat.apache.org/download-70.cgi

How to Integrate Tomcat 7 to Eclipse juno

Select Windows and click on Preferences in Eclipse.


/wp-content/uploads/2015/09/9_790504.png


/wp-content/uploads/2015/09/10_790559.png


Choose Server and click on Runtime Environment and click on Add.

/wp-content/uploads/2015/09/11_790560.png

Select Apache Tomcat v7.0 and click on Next.


/wp-content/uploads/2015/09/12_790561.png


Click on Browse.


/wp-content/uploads/2015/09/13_790563.png


And specify the path directory and click on Finish.


/wp-content/uploads/2015/09/14_790564.png

4.How to Create a Simple Hello World Project


Open Eclipse → Click File and select new option → Select Project.


/wp-content/uploads/2015/09/15_790565.png


In New Project window choose SAPUI5 Application Development and click on Application Project →and Click on Next.


/wp-content/uploads/2015/09/16_790566.png


Enter your Project name and Click on Next.


/wp-content/uploads/2015/09/17_790567.png

Select the Development Paradigm as JavaScript or XML or JSON or HTML click on Finish.


/wp-content/uploads/2015/09/18_790568.png


MVC structure of  in Eclipse

  • Index Page
  • Controller Page
  • View page

Index File for Hello World Project

Below screen short shows the index file.

/wp-content/uploads/2015/09/19_790569.png


View File for the Hello World Project


View file is used for web Page View purpose.


Below screen short is View code.

/wp-content/uploads/2015/09/20_790570.png

.

Controller File for Hello World


Controller part is used to write the functionalities.


Below screen short is Controller code

/wp-content/uploads/2015/09/21_790576.png


Output


/wp-content/uploads/2015/09/22_790581.png



5.How to share or upload a project in ABAP server system.


Open Eclipse.


In project Explore Right click on project name and choose Team and click on share.


/wp-content/uploads/2015/09/23_790582.png


Share project repository window will open, in that choose SAPUI5 ABAP Repository and click on Next.


/wp-content/uploads/2015/09/24_790583.png


Click on Browse and select system details and click on OK.


/wp-content/uploads/2015/09/25_790584.png


/wp-content/uploads/2015/09/26_790585.png


Click on Next.


/wp-content/uploads/2015/09/27_790586.png


Enter the client number, username and password details and click on Next.


/wp-content/uploads/2015/09/28_790587.png


Next we will get SAPUI5 Repository window, in that choose create a new BSP Application.


Enter the details like Name, Description and Package.


/wp-content/uploads/2015/09/29_790588.png


Click on Next—-> Finish.


/wp-content/uploads/2015/09/30_790589.png


After sharing the project into the server we have to submit the code.


Right click on the project and select Team and click on submit.


/wp-content/uploads/2015/09/31_790590.png


Click on Finish.


Best Regards,

Mohanbabu D.

Assigned tags

      3 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Saravanan Madhappan
      Saravanan Madhappan

      Thanks Mohan for sharing this step by step document. It's really helps me to get started with SAPUI5.

      Author's profile photo Former Member
      Former Member
      Blog Post Author

      welcome 🙂

      Author's profile photo Former Member
      Former Member

      Thanks  for sharing this document. But I have a javax/activation/MimeTypeParseException  error when I tried it.

      Can you help me please ?