Problem Description
We have two separate applications that we would like to integrate together. One is a WYSIWYG application for generating static websites. The other is an admin application for managing an online shopping site. We would like to be able to use the features of the Website Builder to design pages in the Webshop. In addition, we would also like to be able to manage product details (name, price, images, etc.) while updating Webshop pages in the Website Builder.
Website Builder Details
The Website Builder is a single page app written in React. It is mostly served by a monolithic backend with a few services for select features. The app follows a component-driven architecture using Redux for application state management. Each static page in a user’s website is composed of components. Each component is responsible for rendering the view within its container and for supplying the callbacks for displaying its settings panel. The settings panel is unique per component but may share various individual controls for certain
settings (eg: background color, fonts).
When the user is ready to publish their site, the publication service will generate static assets for each page. The Webshop is one component in the Website Builder. When a Webshop is included on a page, a JavaScript snippet is included in the generated HTML.
Webshop Details
The Webshop has 2 parts: the admin portion is a single page app written in KnockoutJS. It is in the process of being rewritten in React. The second portion is the public-facing shop front, also a Knockout application written in KnockoutJS. The admin application lists products, orders, and other management details. The Webshop backend is quite similar to the Website Builder – monolithic aside from a few minor services for certain features.
The documentation is HERE
Cheers
Osama
Technology Geek 