The author has written a set of step-by-step learning tutorials suitable for SAP UI5 developers . As of April 15, 2023, a total of 180 篇articles . This is the directory of the tutorial .
This set of tutorials focuses on Freestyle 开发技术the introduction of SAP UI5. Thanks to the support of many SAP UI5 developers. During the course writing process, the author received many private messages from learners asking about various technical issues about the development of Fiori Elements. The multitude of questions these learners asked culminated in this set of Fiori Elements tutorials.
Similarities and differences between Fiori Elements and SAP UI5 Freestyle development technologies
Why did the author put the development of Fiori Elements into a new set of learning tutorials, instead of directly reusing a set of by-step learning tutorials suitable for SAP UI5 developers ?
In my opinion, although both are based on HTML/JavaScript, and the final developed product can be deployed on a web server and configured as a Tile of Fiori Launchpad, SAP UI5 应用but the development concept, development process and development process of the two are different. There are differences that cannot be ignored in many aspects such as focus, applicable scenarios, and skill requirements for developers.
There have been many articles on the difference between Fiori Elements and Freestyle UI5 development methods on the Internet. The author of this article talks about his own views.
In order to facilitate understanding, I use the analogy in the basic necessities of life that everyone is familiar with 住.
Suppose you need a house (develop a SAP UI5 application), there are at least two different ways to achieve it:
-
Method 1: Choose the foundation yourself, buy cement, sand, bricks, concrete, wood, steel bars, glass, paint, floor materials, etc. (these raw materials are equivalent to the control set provided by SAP UI5).
-
Method 2: Buy a well-decorated existing house from the developer and move in with your bags.
Obviously, using method 1 to obtain a house requires the operator to have the skills of self-built houses, such as understanding the basic principles of architectural design and planning, and mastering the basic skills of building construction, such as foundation construction, wall masonry, and roof construction wait. After the blank room is built, it needs to be decorated, so it needs skills such as wall treatment, floor laying, and furniture installation.
Method 1 can be compared to using SAP UI5 Freestyle for application development.
In this development mode, developers can freely choose to use a large number of out-of-the-box controls and tools provided in the SAP UI5 control collection to implement application business logic.
The Freestyle development method is very flexible and can give full play to the creativity and imagination of SAP UI5 developers. In this development method, developers can freely choose which controls and components to use according to their needs and skill level. In the Freestyle development mode, the controller (controller) and Component.js codes of SAP UI5 applications need to be manually written by developers.
Compared with the Fiori Elements development method, the learning curve of the SAP UI5 Freestyle development method may be steeper. It requires SAP UI5 developers to have a certain basic knowledge of JavaScript, understand some basic principles of CSS, and understand the design concept of the front-end framework MVC. SAP UI5 official SDK finds the documentation of the UI5 controls you need to use.
However, these efforts are of course rewarded: the Freestyle development method can provide higher flexibility and freedom, and can help developers implement more complex and highly customized SAP UI5 applications.
However, in real life, not all people have the ability to build their own houses. Most ordinary people choose another way: buy a well-built and decorated house from a developer, and then move in with their bags.
In this way, in theory, we only need to prepare enough funds to buy a house, without any other knowledge about self-built houses and decoration, because the developer has helped us take care of everything.
Similarly, when using Fiori Elements to develop SAP UI5 applications, developers do not need to understand too profound front-end development knowledge, because whether it is the interface design of UI5 applications, or the two-way binding of interface elements and data models, the implementation of controller lifecycle hook functions , and the implementation of Component.js, all of which are undertaken by the Fiori Elements framework. Developers can even 连一行代码都不用写move the mouse and click a few 下一次buttons in the Fiori Elements application creation wizard to get a standard application that can run normally and has a very professional interface design and is very Fiori-like. All of this is very similar to the home buying experience of home buyers who choose to move in with bags.
Of course, there are pros and cons in everything. When we enjoy the convenience and time-saving convenience of check-in (Fiori Elements), the door to scalability and personalized settings is also closed to us.
When a house buyer chooses a housing developer, he can only choose the most suitable unit type from the limited sample rooms provided by him. As a house buyer, it is impossible for us to change the design of these units. Similarly, Fiori Elements also provides a limited number of "model rooms", namely Fiori Template (template).
Currently, Fiori Elements provides five templates, covering most usage scenarios of Fiori applications, enabling SAP UI5 developers to 快速build consistent, modern and responsive enterprise-level web applications:
- List Report
- Worklist
- Object page
- Overview page
- Analytical list page
If the interface layout that needs to be implemented is very different from these five templates, it may be a better choice to choose Freestyle instead of the development method of Fiori Elements—a well-decorated house, which is left to the owner’s customization The space is already very small, and it is nothing more than some interior soft decoration design, such as choosing and matching some furniture, curtains, carpets, lamps, etc. according to your own preferences and style. Similarly, applications developed using Fiori Elements leave room for developers to carry out secondary development and customization, and there are only some enhancements defined by the Fiori Elements framework. Later in this tutorial, we will introduce in detail how to enhance the Fiori Elements application.
Summarize
Fiori Elements and SAP UI5 Freestyle are two different development approaches, each with its own advantages and applications.
-
When to use Fiori Elements: If the SAP UI5 application development needs to be completed quickly in a very short time, and the application only needs to complete the standard process that can be covered by the SAP Fiori Elements preset template, there is no need for flexibility, freedom and scalability. More requirements, then Fiori Elements is a more suitable choice.
-
Use occasions of Freestyle UI5 development: If the application needs to implement non-standard business processes and user interfaces, and has high requirements for customization, scalability and flexibility, it is recommended to use Freestyle UI5 development method.
This tutorial will start to update the Fiori Elements series of development articles, so stay tuned.