Page History
...
All content editing is done in the Pages app of the Magnolia author instance. The Magnolia-provided SPA renderer libraries ensure that a SPA project can be edited in the Pages app. The SPA renderer produces template annotations, which the Pages app transforms into the green toolbars – editable page elements. Note: The green toolbars are generated whenever the page iFrame is loaded. Additionally, the green toolbars can also be generated by calling the document.mgnlRefresh() function.
The renderer libraries allow you to work with page hierarchies in the same way you would expect when creating non-SPA pages. SPA applications can load content from different Magnolia pages. The content can be organized using a navigation component or through back and forth buttons.
Example
The angular-minimal is a parent page to the about page:
Content of both pages is freely accessible to the editor of an SPA application and links to both pages are placed next to each other on a blue navigation bar:
On the Magnolia side, an SPA has a very simple template definition that just references the index.html file generated by the external React or Angular app.
...
Overview
Content Tools