Thursday, March 26
Steps for making changes to existing custom UI5 App
If you want to make changes in an existing custom UI5 app
which is deployed on ABAP repository, this blog will guide you through the
steps.
First you need to download the app from ABAP repository
Then, import it in eclipse
Then, make changes in the app in eclipse as per business
requirements
Then, deploy the app with the same technical name or a
different technical name. Capture this deployment in a TR.
Download application source code from ABAP repository
For this, login to SAP system as shown below. Enter logon
credentials at below screen.
You will be taken to SAP Easy Access screen as shown below
Enter tcode SE38 in the commmad line
On the following screen, run the program called /UI5/UI5_REPOSITORY_LOAD
as shown below
Click on execute button. On the screen that follows, enter
the technical name of the application you identified previously. See below.
Select the Download radio button since you want to download the source code of
this application and then import in eclipse.
Click on execute button, you will be asked to select a
location on your local machine for saving the folder of source code of this
application
Select a folder or create a new folder at a specific
location of your choice. And click on OK button. Below popup will then display
On this popup, check the checkbox ‘Remember my decision’ and
click on Allow. Then system will display the summary of the files which will be
downloaded
Scroll towards the bottom and click on ‘Click here to
download’ button
On the popup that appears, click on continue
On the popup that appears next, check the checkbox ‘Remember
my decision’ and click on allow
Done. Your application source code is now downloaded in a
local folder. See below message
Importing the downloaded App in Eclipse for making
changes in source code
Now let us import this application source code in eclipse to
make changes as per business requirements. Open Eclipse.
Go to File->Import…
Select Existing project into Workspace option as shown below
On the subsequent screen in the wizard, browse and select
the folder which was downloaded from SAP system and then click on next
Click on Finish. This will create a project in project
explorer view of Eclipse.
Sometimes, there are some junk characters which appear in
the JS files or json files which are downloaded from ABAP repository and hence
some errors will be displayed in the project, refer above picture. In order to
resolve these, refer the same code file in SE80
tcode in the ABAP frontend server and make same changes or remove
unnecessary characters from files while comparing the code with code available
in ABAP repository.
In my case, these are the special characters appearing on
the File
So now I am going to SE80 and opening the same file and
going to line no .115 to see what is causing these special characters and is it
ok to remove/comment this code or remove the special characters and do away
with the error.
Here, we can see that the source code need not commented. It
is required and so I will remove the special characters from Eclipse file and
make it error free manually.
Cleaning done, this is how it looks like now and error free.
So, now the project is error free and ready for making code changes for
business requirements. Once you are done with the necessary changes to the
application, its time to deploy the changed app on ABAP repository. Here, you
can decide to overwrite the existing app source code on the server or you can
create a brand new app for deploy the changed source code under it. Here I will
deploy the code under new app.
Deploying the App to ABAP repository
Right click on the app and select team->Share
Select SAPUI5 ABAP repository from below
Enter ABAP frontend system’s details to deploy the App on it
Enter logon credentials. Ensure that this user has developer
key assigned and developer roles given to it and using this ID, you have
already created at least one technical object in the system prior to using the
ID for deployment of UI5 app fom eclipse.
On the next page, you have options. Options one is to select
an existing App onto which the changed resources will be overwritten. Option
two is to create a new App. This will create a BSP application and a ICF
service for the App in the system.
Finally, you need to select the TR or create a new TR to
capture these changes
Click on Finish.
Test the new App
Once the application is deployed, you need to test that.
Right click on the project and select Run As->Run on ABAP server shown below
Verify the changes in the deployed App. With this you have successfully made changes to an existing custom UI5 app and deployed on ABAP frontend server.
In case you face any issues while following these steps, post a comment below and I will be happy to assist you resolve the issues
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment
You are welcome to express your views here...