Tue Aug 15 2023 • ☕️ 5 min read • you like my writing? Buy me a coffee
Sitecore maintains a change log of all changes to the XM Cloud SaaS solution. This changelog can be found at https://developers.sitecore.com/changelog. An interesting change, tagged as “improvement” was Improved interface, functionality and flows in Sitecore Components.
Summary of the New Sitecore Components Release (Early Access)
Enhancements & Features:
Updates Required for Latest Features:
Introduction of a new data picker, item picker, and a Settings tab. The Settings tab offers:
Integration with Content Hub ONE:
React Component Features:
Other UI Updates:
This new release brings a plethora of improvements and new functionalities for developers and users of Sitecore Components.
If we disect this improvement there are some interesting things to notice:
The “product” is called Sitecore Components a few times in the text. In documentation it was always named XM Cloud Components:
Is is true that the FrontEnd as a Service components created with the Components builder can be used from both XM Cloud pages, as well as any other web page built with HTML. The components can either be consumed as Web Components, or the React wrapper component can be used. Is this a change in direction, to positions the product as Sitecore Components?
On the other hand: Components is in the UI still one of the tools in the XM Cloud start screen under Tools:
I did not try this out yet, but this will bring a big improvement: the use of external React components. If we can bring our own components, a way more powerful user experience can be created with more interactive components, instead of the simplistic components we could build before! For more information see the documentation Walkthrough: Registering an external React component. More on this in a later post, when I have time to delve into this new feature.
Another important improvement is “New configurable, responsive grid layout in the component canvas for drawing, resizing, and rearranging containers within a component.”. I must say this is a big improvement, I never understood the sizing and placement of elements in the component, until now…
Components can now fetch their own data on runtime in Pages. You finally see changes made in your content reflected in the rendering of the components.
The created components are as powerful as the data that can be bound to it. Besides straight databinding to fields in the Data Source results, it is also possible to use a JSONPath in expert mode. If you select the (i) information icon you are led to the page https://www.npmjs.com/package/jsonpath-plus, with the type of JSONPath queries that can be executed. To test out the expert-mode JSONPath queries using the jsonpath-plus query syntax have a look at the web-based demo environment at https://jsonpath-plus.github.io/JSONPath/demo/:
It looks like Sitecore Components is getting grown up. And this is an important next step for Sitecore to stay relevant in the fast growing space of WYSIWYG tooling to build components and websites like https://builder.io, https://www.plasmic.app/, and many more. And for me personally it now finally becomes relevant to dive deeper into what Sitecore Components can bring to the table. So watch out for more Components posts!
This work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License. You are free to share and adapt this work for non-commercial purposes, provided you give appropriate credit, provide a link to the license, and indicate if changes were made. To view a copy of this license, visit http://creativecommons.org/licenses/by-nc/4.0/.