Introduction: I am an SAP UX Consultant with Deloitte Consulting. I am currently working on SAPUI5 and SAP Fiori. I have been working in the domain of SAP User Interface for the past 10 years, mainly on SAP NetWeaver Portal, Web Dynpro, and SAPUI5.
To develop a custom SAPUI5 application that enables the client to manage the time billing per project.
The client has SAP HANA in their landscape and the development team is provided access to the SAP Cloud Web IDE environment to develop the application.
The cloud infrastructure is fully configured to connect to the on-premise SAP HANA system.
The client had contracted a design team to provide quasi-functional wireframes. The design team was not from SAP.
To implement the solution within a short time frame and ensure that the UI is in line with the designs.
USAGE of SAP Web IDE
SAP Web IDE was chosen as the preferred environment to develop the SAPUI5 application. SAP Web IDE allowed us to quickly prepare running applications at the start of the implementation phase. We used the layout editor to drag the required controls and form templates to replicate the designs. We also converted many of the forms and other related controls based on functionality into fragments using the menu options.
I used the layout editor extensively to structure the View by splitting it into multiple fragments. This ensured reusability, ease of maintenance, and better readability. I also used the SAP Web IDE custom styles included in the linked CSS file. The i18n file was used to maintain all the text content used in the view.
I used the GitHub plugin to save the project in the HANA Cloud Git repository. Sharing the project through Git created a seamless and simplified process for team development on the same project when the deadlines were tight. Git also mitigated our concerns on code availability and security.
I faced difficulties designing the UI based on the wireframes form the design team. The design team had not considered the SAP Fiori launchpad template, and this resulted in several discussions when we tried to align the existing wireframes to the standard offerings of the launchpad.
Observations – Positive
SAP Web IDE provided simple templates which enabled us to have quick start up applications.
I found the View design simplified with the WYSIWYG (layout) editor, especially for simplified forms. The option to directly link the text in the i18n file to the label controls was very useful.
The integration of OData services with the View layout using entities drastically simplified data access calls, especially during the initial load of the screen.
The seamless integration of Github considerably simplified the task of code share and team development. The tracking of any changes was easy and allowed us to split the development across consultants.
Observations – Negative
In spite of the improvements in comparison to the Eclipse editor, we were still unable to understand which control was needed to achieve our UI design.
During server downtimes, our team could not perform any development.
Impact of Web IDE on Timelines
My earlier project used Eclipse editor to perform SAPUI5 developments. SAP Web IDE simplified the project structure created by using pre-defined templates and made running the application easier. It also saved us time by eliminating the need to create the local Java SDK.
The Layout editor simplified the View creation.
The OData integration with on-premise SAP systems allowed quick deployment and provided helpful run options for the developers.
Overall, I found a decrease of 30% – 40% of the time for development in comparison to the Eclipse editor.
SAP Web IDE is a tool with the potential to be a killer editor. It can speed up development and ease the extension requirements of the developed application. Improvements to the Layout editor and the continuous evolution of the product will go a long way in increasing adoption by development teams.
I personally look forward to many more years of development using SAP Web IDE.