This blog demonstrates how you can speed up your UI5 web development in Eclipse when using local HANA Cloud Platform (HCP) runtime.
1. UI5 Web Development as most HCP developers do it
As a UI5 example web application you could take the simple PersonsList Web Example described in another blog.
I used here the PersonsList sample for explaining the faster UI5 development steps by means of screenshots so that you can adapt this easily to your project.
Most HCP developers develop their UI5 web application as follows:
1. Existing UI5 web application (here the PersonsList sample) runs already on local HANA Cloud Platform (HCP) runtime
Eclipse view:
Running application in web browser:
2. You want to change s.th. on the UI5 view: e.g. add a UI5 'Hello' button
Eclipse view:
a) UI5 code change:
b) Save editor
c) Publish changes to server
now WAIT, WAIT, WAIT, ... :cry:
This 10-20 seconds is really not what you want to have to wait for till you see your changes:
Running application in web browser with the changed code
But now see next section 2. how the changed and saved UI5 code is immediately visible in the web browser.
2. What you could do for faster UI5 Web Development in Eclipse?
1. Install FileSync plugin from Eclipse Marketplace
Note: I want to mention here clearly that the below used Eclipse Marketplace 'FileSync' plugin is not an SAP offering and it is in your own responsibility if you want to use it as I described it below.
a) In Eclipse menu: Help > Eclipse Marketplace...
b) Find: 'FileSync' Eclipse PlugIn
c) Choose Install
2. Configure FileSync
Prerequisite here is that your UI5 web application is already running on the local HANA Cloud Platform runtime.
I assume further that you are using an Eclipse workspace located at C:/<local_eclipse_path>/workspace (e.g. C:/dev/eclipse/workspace when the eclipse.exe file is located in C:/dev/eclipse).
Then the local 'HANA Cloud Platform runtime' Server is located at C:/<local_eclipse_path>/workspace/Servers/SAP HANA Cloud Platform local runtime-config.
Based on these paths the following screenshots were made (adapt to your paths if necessary)
Steps to configure 'File synchronization' properties for web project
a) Select the UI5 web project (here personslist-repo-web) and open context menu
b) Choose Properties to open properties for the selected project
c) Select 'File synchronization'
d) Select option 'Enable FileSync builder for project'
e) Choose Add Folder... and select the 'webapp' folder which contents should be synced on local runtime server if web project changes are saved
f) Choose OK.
Then speficy the default target folder
g) Choose Browse...
h) Navigate in the file system browser to C:/<local_eclipse_path>/workspace/Servers/SAP HANA Cloud Platform local runtime-config/webapps/personslist-repo-web
i) Choose OK
2. Now change again s.th. on the UI5 view: e.g. change the text of UI5 'Hello' button
Eclipse view:
a) UI5 code change:
b) Save editor
c) Switch to the web browser and refresh the page
The UI5 development changes are immediately visible in the web browser, WITHOUT RESTARTING THE SERVER :cool:
Enjoy developing HCP UI5 web applications!
3 Comments
