07-19-2023, 03:30 PM
Basically, we are using a headless CMS to edit content on Website A. We are building our own CMS UI based on the headless CMS API (call this Website CMS).
Now, we have this page in Website CMS wherein you can edit the content on the left panel and get a preview of Website A on the right panel (mobile view).
I haven’t done anything like this before and I am wondering what’s the best way to accomplish this and if there any libraries that help with this functionality.
Some ideas:
1. Embed Website A within Website CMS and any changes done on the left panel basically just refreshes Website A (which is just embedded into the page).
2. Recreate Website A as a page in Website CMS and call the same APIs so that the changes both happen on Website CMS’s Website A and the actual Website A. (Although I don’t see how this would be more beneficial and will create 2 separate codebases for the exact same page).
3. Others???
Main framework we are using is ReactJs for this CMS UI.
Now, we have this page in Website CMS wherein you can edit the content on the left panel and get a preview of Website A on the right panel (mobile view).
I haven’t done anything like this before and I am wondering what’s the best way to accomplish this and if there any libraries that help with this functionality.
Some ideas:
1. Embed Website A within Website CMS and any changes done on the left panel basically just refreshes Website A (which is just embedded into the page).
2. Recreate Website A as a page in Website CMS and call the same APIs so that the changes both happen on Website CMS’s Website A and the actual Website A. (Although I don’t see how this would be more beneficial and will create 2 separate codebases for the exact same page).
3. Others???
Main framework we are using is ReactJs for this CMS UI.