I’m building a plugin that will allow users to upload a 3D asset and manage some content about that object in a JSON field. I’d also like to use the Richtext field along with the WYSIWYG component that comes with strapi.
I’m looking for a way to import and configure that component in the React component that I’m building in my plugin.
Is this possible, and if so, are there examples of how I could do this?
This is probably the complete Richtext field built into Strapi: https://github.com/strapi/strapi/tree/main/packages/core/admin/admin/src/content-manager/components/Wysiwyg
I don't think it's available with Strapi's published package, and you cannot find it with their design system.
So I'd recommend looking into an alternative solution like using another WYSIWYG editor package instead.
Related
I work on a large project built on Magnolia CMS and FreeMarker templates and I want to add React to it. Is it possible to integrate React components and grow gradually until the whole project is React based? I looked for this information but the resources are quite limited in this area.
Have you had a look at this one? https://docs.magnolia-cms.com/product-docs/6.2/Developing/SPA-development-and-Magnolia/Mapping-between-Magnolia-and-SPA-components.html#_mapping_between_magnolia_and_reactjs
Basically, you can do the mapping between Reach and Magnolia components as described above.
Recently I've joined a new job and they are working with Salesforce. They have all pages with APEX and I propose to migrate to Lightning components.
I've created the first 7 components and I'm using Atomic Design Methodology (https://atomicdesign.bradfrost.com/chapter-2/) to develop these components.
I want to implement stories (with Storybook) or another similar library to document and put examples of each web component.
My question is... Is it possible? I try to install Storybook in the project and isn't working. The question is simple, whether or not you can. And if not, if you know any alternative to it.
Thank you!
In order to use Storybook, you will need to follow the provided Storybook documentation for lightning "Web Component" rather than the other available options like React and configure your VS Code to work with your SF Environment. Also, you might want to look into downloading the lwc-services, lwc-webpack-plugin and mo-dx-plugin dependency.
To briefly describe my goals --
I have an external React component library of ~70 React components, which feeds a web frontend (Websphere Commerce site, which pulls in Experience Fragments via AJAX calls to get the fragment HTML), and also a React Native app. So for the web, AEM is basically the content engine which feeds our headless frontend.
I'd like to use those same React components to feed the AEM Experience Fragment authoring experience, instead of having to rebuild each React component as an HTL template within AEM -- it's too much overhead to maintain a completely separate component library of HTL templates
By following the official Adobe tutorial here, I see how it is possible to map React components to the Content Fragment authoring experience. By which I mean, if I go to AEM Home > Sites > (my site) > create a new fragment, the component I drag in is fed by a React template. I can tell, because the markup matches what is in my BasicComponent.js React template in ui.frontend, and not the basic-component.html template in ui.apps.
But, if I go to AEM Home > Experience Fragments > create a new fragment, that same BasicComponent component will pull from the basic-component.html file in the component folder (next to .content.xml), instead of from BasicComponent.js
I'm new to AEM, so hopefully the above makes sense. I know I am missing something pretty fundamental re: how Experience Fragments differ from Content Fragments (if that is the right term). I've spent a lot of time Googling around for information, but I'm finding that my own ignorance is making it difficult for me to determine if what I'm reading is or is not a clue to solving my issue.
This is the repo that I pulled down to experiment with: https://github.com/drginm/aem-react-simple-example
Any help much appreciated! I'm sure I'm not the only AEM newbie looking for an approachable model for handling this situation.
Experience Fragments is not recommended used with ajax html in headless architecture, it should be exposed via sling model exporter in json format for the react consumption.
To edit and modify the experience fragments AEM doesn't provide any APIs, AEM developer should give custom REST APIs to do the changes.
I would recommend to go with the content fragments where the CRUD operation is possible via Assets api in AEM.
References
Difference between experience fragments and content fragments
ASSETS API for the Content Fragments
I'm trying to include a Drag-n-Drop Email Editor in my vuejs project. Unfortunately i can't find one but i did find a really good one for reactjs.
https://github.com/unlayer/react-email-editor
Is there a way to use this in my vuejs project?
I am a new in using apostrophe. I read that apostrophe is build on node.js as a backend, express and nunjucks template
my questions is can I create my custom reusable component using react on apostrophe without using headless CMS?
or to be able to use react with apostrophe it must be with Rest API (headless CMS)
Can anyone help?
Yes, you can use React with Apostrophe, even if you are not using apostrophe-headless. React does not insist on "owning" the entire page, and neither does Apostrophe.
This can be as simple as adding some script tags to your outerLayout.html or an individual page template, overriding the extraHead nunjucks block to load them. You may want to bring babel into your project to allow the use of JSX however.
See the official React documentation on using it in existing websites.