New Frontend Module: React Web Components (non SPA)

[mkovacek]

Would be nice to have an option to generate the project with a frontend module that follows react web components approach (non SPA)

Two options:

1. Extension of general frontend module so that we can still use existing approach for standard content components + react web components approach for specific, frontend complex components.
2. Only react web components approach

https://github.com/adobe/react-webcomponent https://github.com/adobe/aem-react-core-wcm-components-examples/tree/master/react-webcomponents-example-project

[kevinolivar]

Hi there,

Sorry for the late reply and not sure if you managed to find an answer or not but maybe this can help. I setup an AEM project (not headless, nor spa) with the general frontend module and the following 'requirements' in mind:

• core components (ootb markups)
• custom components (basic or complex interactivity only)
• complex components (state, api request, graphql, complex interactivity, animation orchestration...)

For core components, we just need styling. For custom components, it depends if we need interactivity or not. If yes we go vanillaJS or alpineJS. If not, no problem we go HTL. For complex components, we go 100% react.

For this last point, I am using this library https://github.com/bltnico/react-register-dom which also helps handling SSR. There was another library which needed you to set a model and so on, but it was too cumbersome. I cannot recall the name.

[mkovacek]

Hi, yea I managed it. I used react spa frontend type and just update dependencies (removed spa-related and included react-webcomponent ones)

[kevinolivar]

Hi,

ah cool then! Would you have a 'demo' repo? Just curious about what you got.

Thanks!

[mkovacek]

Hi, I have forgot about it.

Here is demo example: https://github.com/mkovacek/aem-react-webcomponents