This investigation of Sitecore JSS and SXA was done quite a while ago, but I didn’t get a chance to post it here. I need to go back to validation of this setup so this will be a living post and I’ll be updating as new findings arrive.
You might ask why would you need to mix them, but the reason is pretty simple. SXA brings a lot of functionality outside of presentation configuration (which I’m not a fan of) that can be useful for any site, like sites management, wizards for sites creation, local data sources, various site settings, etc.
Initial research (Sitecore 9.0.0 + JSS TP3 + SXA 1.5.x)
It is possible to run SXA and JSS side by side, which is a good starting point.
- Data sources work and use queries like:
- query:$site/*[@@name=’Data’]/*[@@templatename=’Accordion Folder’]
- query:$sharedSites/*[@@name=’Data’]/*[@@templatename=’Accordion Folder’]
- Shared sites for data sources work fine
- SXA toolbox does not work in JSS
- Partial and Page design do not work in JSS by default
- Page variants don’t work
- Themes could not be used
- Styles are applied using e.g.
- @Html.Sxa().Component(“carousel”, Model.Attributes)
- Design export doesn’t work nor make sense anymore
- The control editing event works strangely when the page design is specified
It turns out that a lot of SXA customization could not be used, site creation requires too much clean-up after creation even with all options unchecked.
It was possible to use many data templates available in SXA.
To be continued…
Follow me on twitter @true_shoorik. Would be glad to discuss ideas above in comments.