Agenda
- Why are people eager to do this?
- What is the value?
- What approaches do people use?
- What are their pros and cons?
- What are the most important features of such an integration?
Community page on this topic:
How to integrate Angular and React components with page editor
Kickoff Question
Project requirement: I Philip - want to use an existing webapp - the client is the centerfrontend js app - and add content management to it, for example the business user still needs to change labels. How to bring the easy-to-use-edness of the CMS into complex frontend applications?
The frontend js app is the center of the project. The cms is not at the center. But the business user still needs to change labels. How to bring the easyness of the CMS into complex applications.
Discussion
Exploring more sophisticated coupling between CMS and JS app.
Jorg - why is it not convinient, now? (content apps, etc.)
Philip - can i edit straight from my app? That would be convenient for authors.
Adrien presents his demo.
Adriens demo is described in this wiki-page section. And it includes the link to the GIT repo: How to integrate Angular and React components with page editor#PageEditorHooks
Comments from Adrien
There are timing issues between vaadin/page/editor and angular.
- The demo works because angular loads everything first, then vaadin page-editor JS runs.
- It would be a nice addition to the page editor - that you can have "green bar scanning" at will - or when the dom updates. (Page editor has some call.)
So what our library provides is:
- Re-creation of magnolia Area concept - in Angular.
Next / Problems:
- What about image variations?
- What about personalization? There is a resolver, but it is not being used yet. Not in the PoC.
- What about auto-generation of components?
Discussion
What about all of the processes that happen in Server side Magnolia Rendering?
What about server-side rendering of frontend components?
- Getting JSON from JCR into nashorn - then they can build something.
- I dont understand the problem - properties.
- Wants to re-use FF components. But render them on the server.
Other notes
Tomas - Map with pins module demonstrates ways to add more powerful editing in the page editor (drag and drop) you can have the editor. Uses REST to push the data to the component.
Alberto - Processed resources needed for some of these things. (Need to ask about that)