Can we use App builder frontend apps inside adobe commerce PDP

[Vignesh29332420nfcx]

Hi folks,

I'd like to build custom PDP more like product customizer in adobe commerce cloud and would like to use React & express app in app builder that render inside Adobe commerce(Magento) PDP? Can that be achieved? If yes, what are the ways to achieve it? And can app builder has access to adobe commerce assets like images from pub/media folder?

[sarav_prakash]

Hi @Vignesh29332420nfcx ,

What has been tried and what is not working? 

Technically this is feasible.

You create a fully functional express react SPA and host onto runtime action as web assets. When you hit the runtime action url, for example https://712511-demo.adobeio-static.net , it must run the react app successfully. Then you load this app into calling application. 

I implemented a pattern like this:

1. Built the react app and deployed onto App Builder
2. At AEM Dispatcher, normal website urls always hit AEM publisher
3. But created a reverse proxy, for specific url, request proxies to App Builder (https://712511-demo.adobeio-static.net) instead of publisher. 
4. And provided link to portal on main website nav.
5. So normal browsing, user sees AEM pages. 
6. Upon clicking portal link, AppBuilder runtime is invoked, web assets served and react page works.