UI5 Web Components – the enterprise-flavored sugar on top of native APIs!
Over the last months, we worked hard to create a new offering for you and get it on its way! We call this offering the UI5 Web Components. This is a key pillar of the UI5 Evolution project to enable a lightweight and independent consumption of the UI elements of UI5. As the name already suggests they are built using the Web Components standards.
The time has come, the web is ready! The Web Components work in all major browsers. They are based on a set of web standards like Custom Elements, Shadow DOM, HTML Templates and ES6 classes and modules. Web Components allow to create custom HTML tags, extending the browsers’ standard HTML tag vocabulary. Behind those custom HTML tags, they provide the visual appearance defined via HTML and CSS and also the behavior implemented with JavaScript. Finally, the great thing about Web Components is that they work with any web framework that uses HTML tags.
UI5 Web Components are the new offering of UI5 to provide basic and selected advanced UI elements as Web Components. Just like UI5 Controls, these UI elements are implemented in accordance with the SAP Fiori Design Guidelines and incorporate the SAP Fiori 3 design. Therefore, they are great to ensure visual and behavioral consistency for static web sites and web applications. UI5 Web Components appear and behave just like UI5 Controls. In addition, they come with the familiar enterprise-grade features such as stability, internationalization, accessibility and theming support. Compared to UI5 Controls, the footprint of UI5 Web Components is much smaller because UI5 Controls are embedded in an application programming model, whereas UI5 Web Components are not. And exactly this sets UI5 Web Components apart from UI5 Controls. They enable you to use our UI elements with any HTML based UI technology of your choice.
Classification
It is essential to understand what UI5 Web Components are and what they are not. The following statements will help you understand how they fit into UI5s offering:
UI5 Web Components…
- …are not built on top of UI5, but rather lightweight and independent UI elements
- …are not a successor of UI5, but rather a complementary offering
- …bring the relevant UI5 qualities and SAP Fiori UX to the HTML level, usable with any web framework
UI5 Web Components are good for…
- …static web sites built without web frameworks, to just add a few interactive UI elements
- …web applications which already use a different web framework
UI5 remains what it is: the best choice for…
- …building complete enterprise-ready and responsive web applications
Get started
Finally, UI5 Web Components have become open source! They are available on GitHub. For now, they are released as Beta version as we want to get your feedback and keep the possibility to adapt. To get started we invite you to visit our home page:
Here, you can discover and get started with the UI5 Web Components. You can explore the code in our GitHub repository, the examples and documentation in the Playground and learn about the integration possibilities into other frameworks.
Conclusion
The UI5 Web Components are the new offering of UI5 to provide you with a set of reusable UI elements which can be used for your static web sites or for web application using any web framework of your choice with a minimal footprint. They allow you to create a consistent user experience aligned to the SAP Fiori Design Guidelines and you can expect an enterprise-grade UI element set which comes with a common look and feel and an aligned behavior. This makes the UI5 Web Components such a great opportunity.
What now?
It’s your turn now. We really would like to ask you to try out the UI5 Web Components on your own and use them. We kindly ask you to provide feedback: What do you miss? What do you like? What should we improve? Or just help us to improve! In any case, please create a GitHub issue to send us your feedback or open a GitHub pull request to send us your contribution or join our #webcomponents channel of the OpenUI5 Community Slack. to discuss the UI5 Web Components with us! We are looking forward to collaborating with you.
- SAP Managed Tags:
24 Comments
