Fiori Application index (Fiori Application Reference) seeing the name of a thing one thinks of its function , This is a SAP
Released a Fiori Apply search tools , All standards issued Fiori Application details can be found in this tool .

As of the time of writing this article , This website shows that it already exists 11949 individual Fiori The standard applies :

2015 year Fiori 1.0 Time ,UI Style is called Blue Crystall, At that time, the author was still SAP From Chengdu Research Institute CRM Fiori Development team work , We took it from our Indian colleagues 8 individual CRM Fiori application , And carry out the next continuous development .
How to Fiori Use the index to find them ? Click on the top left SAP Fiori apps for SAP Business Suite:

Then select according to Application Component To filter :

This Component Customers or Partners, In implementation and use Fiori When applied , If problems are found , to SAP newspaper incident It needs to be filled in Component Field .
such as Component CRM-FIO-BTX-OPP There is a Fiori application , namely My Opportunities:

You can see its details here , For example, the backstage needs at least CRM EHP3, The application type is Transactional, Support any DB, In the Desktop and Tablet Visit ,App ID by F0012:

All the others CRM Fiori Applications can also be found here :

As mentioned above 8 individual CRM Fiori application , Its source code is the work of Indian colleagues and authors SAP The developers of Chengdu Research Institute wrote it line by line . We said Fiori It is not a specific front-end technology or programming language , It's a design language , Represents a kind of UI Design style , In fact, except for CRM Fiori That's pure UI5 Native development , There are also the following three schemes :
(1) SAPGUI It can be done by SAP ITS(Internet Transaction Server) Used in the browser , For details, please refer to the article published by the author before : I used it in those years SAP IDE. Again , Use SAP ITS Run... In a browser SAPGUI Those traditional transaction codes implemented , adopt SAP Interaction designers and UI Efforts of framework development engineers , It can also ensure that when users use these traditional transaction codes in the browser , Feel and use UI5 Originally developed Fiori Application is as smooth and easy to operate user experience .
(2) use SAP UI5 Other than technology UI Development technology , such as WebDynpro,WebClient UI Developed Web application , adopt SAP Interaction designers and UI Used by framework development engineers Visual Harmonization, It can also make these Web The user experience of the app , Can achieve and Fiori The effect of native application is comparable .
(3) use SAP S/4HANA CDS view Add a lot of comments (annotation) Metadata driven development , Now? SAP Officially, this development method is called Fiori Elements.
For end users , No matter one Fiori Which of the above four methods is used to develop the application , There is no difference in the use experience . let me put it another way , These four development methods get Fiori application , The implementation details are completely transparent to users .

For implementation Fiori For the technicians of , If it is necessary to go deep into these technical implementation details , Can be in Fiori Application index encyclopedia , according to Application Type Field to filter .

use WebClient UI Technically realized Fiori The only application is 119 individual , It's just... Of the total 1% about .

It includes the author's previous articles Hello World, S/4HANA for Customer Management 1.0 Mentioned in tradition SAP CRM Used to create service orders in WebClient UI application , Now through Visual Harmonization, Joined the S/4HANA Fiori Application family .

S/4HANA Create service orders in ID by TBT116MCR:

In transaction code CRMC_UI_NBLINKS You can find the corresponding WebUI component by BT116M_SRVO:


Help document address :https://help.sap.com/viewer/product/SAP_FIORI_tools/Latest/en-US

except Fiori Application Reference outside ,SAP It also provides many functions to improve the use SAP Fiori Elements perhaps SAPUI5 Freestyle method development SAP Fiori Application efficiency .
SAP Fiori Tools and SAP Fiori Elements Together, it reduces development time 、 Maintenance cost , And uses metadata driven UI The advantages of .SAP Fiori Tools include the following extensions :
If the Visual Studio Code As SAP UI5 development tool , We can install one called SAP Fiori Tools -Extension Pack An extension of , To install SAP Fiori Tools:

More specifically Visual Studio Code To build SAP UI5 The steps of the local development environment , Please refer to my article :SAP UI5 The construction of local development environment .
This tool also has a command line interface ,Command Line Interface Abbreviation for CLI.
npm The warehouse address is as follows :https://www.npmjs.com/package/@sap/ux-ui5-tooling
SAP Fiori Tools - UI5 Tooling Contains a series of commands that can be used with ui5 serve Custom middleware used together , And can be used with commands ui5 build Custom tasks used together .
Besides , The module discloses fiori This named line , for example fiori run The order is ui5 serve The wrapper for the command , Some additional parameters and fiori add deploy-config and fiori add flp-config To expand existing projects .
If you run the command line locally npm run deploy Then something went wrong :
fiori is not recognized as an internal or external command

Check SAP UI5 In the project package.json In the file dependencies, See if... Is defined Fiori Tools CLI Corresponding dependence :
"@sap/ux-ui5-tooling": "1.0.10"
Run after adding npm install, then fiori add deploy-config, Encountered a new error message :
Error: Cannot find module '@ui5/fs'

It will be "@ui5/fs": "2.0.1" Add to devDependencies Area :

And then I saw Fiori tools CLI A reminder of , explain Fiori Tools CLI Already available :

summary
This article in turn shares Fiori Application Reference and Fiori Tools These two practical tools play an important role in the author's practical work .
原网站版权声明
本文为[InfoQ]所创,转载请带上原文链接,感谢
https://yzsam.com/2022/187/202207061014464620.html