SAP Fiori elements add-on for OpenUI5 – showcase

Estimated read time 3 min read

A few years ago the “SAP Fiori elements add-on for OpenUI5” was released without much information, actually there is not a single blog, example or even reference project on Github about it, let’s change that 🙂

Using the best project related with SAP Fiori Elements on Github called “SAP Fiori elements for OData V4 Feature Showcase” I’ve created the “Open Fiori elements for OData V4 Feature Showcase”.

Changes:

-package.json: “@sap/open.fe” dependency added

-“resources” folder created under “app” folder
– “index.html” file added under “app/featureShowcase/webapp”
– micro charts & @Communication commented out from “app/featureShowcase/layouts_RootEntities.cds”
– process flows removed from “app/featureShowcase/webapp/manifest.json”

Run it:

First thing to do is npm install to get all the modules.

Second thing is to add the libraries from the node_modules to your project:

your resources folder must looks like this after pasting

 

Finally run npm start and open http://localhost:4005/featureShowcase/webapp/index.html

Side by side comparison of SAP Fiori Elements between sapui5 & openui:

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

 

sapui5 – openui5

Conclusion:

It looks really good and it is for free 🙂

more info about openui5

 

​ A few years ago the “SAP Fiori elements add-on for OpenUI5” was released without much information, actually there is not a single blog, example or even reference project on Github about it, let’s change that 🙂Using the best project related with SAP Fiori Elements on Github called “SAP Fiori elements for OData V4 Feature Showcase” I’ve created the “Open Fiori elements for OData V4 Feature Showcase”.Changes:-package.json: “@sap/open.fe” dependency added-“resources” folder created under “app” folder- “index.html” file added under “app/featureShowcase/webapp”- micro charts & @Communication commented out from “app/featureShowcase/layouts_RootEntities.cds”- process flows removed from “app/featureShowcase/webapp/manifest.json”Run it:First thing to do is npm install to get all the modules.Second thing is to add the libraries from the node_modules to your project:your resources folder must looks like this after pasting Finally run npm start and open http://localhost:4005/featureShowcase/webapp/index.htmlSide by side comparison of SAP Fiori Elements between sapui5 & openui:sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5 sapui5 – openui5Conclusion:It looks really good and it is for free 🙂more info about openui5   Read More Technology Blogs by Members articles 

#SAP

#SAPTechnologyblog

You May Also Like

More From Author