support for Other SPA integration with AEM | Community
Skip to main content
Manu_Mathew_
Community Advisor
Community Advisor
October 27, 2021
Solved

support for Other SPA integration with AEM

  • October 27, 2021
  • 1 reply
  • 999 views

Hi guys,

 

So React and Angular integration is supported by AEM SPA, so is it possible to integrate any other framework with AEM using the Node and NPM?

So the use case here might be migrating a site that's developed in a proprietary framework similar to react, with concepts of components and patterns , so to convert these into an authorable component integrating it with AEM, can we do that?

 

Any thoughts or ideas?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Asutosh_Jena_

Hi @manu_mathew_ 

 

There are some rules defined, that SPA should follow to make it work in AEM.

 

Follow these steps to get your existing SPA ready to work with AEM.

  1. Make your JS components modular. Make them capable of being rendered in any order, position and size.
  2. Use the containers provided by our SDK to place your components on the screen. AEM provides a page and paragraph system component for you to use.
  3. Create an AEM component for each JS component. The AEM components define the dialog and JSON output.

https://experienceleague.adobe.com/docs/experience-manager-65/developing/headless/spas/spa-architecture.html?lang=en#migrating-existing-spas-to-aem

 

Please review these here:

https://experienceleague.adobe.com/docs/experience-manager-65/developing/headless/spas/spa-architecture.html?lang=en#spa-development-principles-for-aem

 

Here is the AEM Architecture with SPA:

https://experienceleague.adobe.com/docs/experience-manager-65/developing/headless/spas/spa-architecture.html?lang=en#aem-architecture-and-spas

 

Hope this helps and it will definitely give idea if the existing SPA can be migrated into AEM.

 

Thanks!

1 reply

Asutosh_Jena_
Community Advisor
Asutosh_Jena_Community AdvisorAccepted solution
Community Advisor
October 28, 2021

Hi @manu_mathew_ 

 

There are some rules defined, that SPA should follow to make it work in AEM.

 

Follow these steps to get your existing SPA ready to work with AEM.

  1. Make your JS components modular. Make them capable of being rendered in any order, position and size.
  2. Use the containers provided by our SDK to place your components on the screen. AEM provides a page and paragraph system component for you to use.
  3. Create an AEM component for each JS component. The AEM components define the dialog and JSON output.

https://experienceleague.adobe.com/docs/experience-manager-65/developing/headless/spas/spa-architecture.html?lang=en#migrating-existing-spas-to-aem

 

Please review these here:

https://experienceleague.adobe.com/docs/experience-manager-65/developing/headless/spas/spa-architecture.html?lang=en#spa-development-principles-for-aem

 

Here is the AEM Architecture with SPA:

https://experienceleague.adobe.com/docs/experience-manager-65/developing/headless/spas/spa-architecture.html?lang=en#aem-architecture-and-spas

 

Hope this helps and it will definitely give idea if the existing SPA can be migrated into AEM.

 

Thanks!

Manu_Mathew_
Community Advisor
Community Advisor
October 28, 2021

@asutosh_jena_  Thanks for the valuable information.