Let's consider react application with Tiny.MCE component. I need to create a custom plugin. But I would like to create this component as a React component.
I have no idea how could I inject the react component to my plugin. Any idea?
TinyMCE plugins have a specific format for how the JavaScript has to be created/bundled. A React component won't fulfill that requirement.
The process for creating a TinyMCE plugin is documented here:
https://www.tiny.cloud/docs/advanced/creating-a-plugin/
I would recommend placing your custom plugins in their own directory and using the external_plugins option to load them. This will keep your custom code separate from the editor and avoid things being deleted/overwritten if you update TinyMCE itself.
Related
I am trying to get this layout using tailwind css and also render elements in this order with vue or react
This layout is called "masonry". I recommend that you check how to do that one in CSS (or with some vanilla JS/package), it's not specific to React nor Vue per-se.
As of how to implement it exactly, SO is not a coding platform so I recommend that you Google that for further progress.
I want to create a react based theme engine for NextJS, in summary, the user can upload a set of .js files that contains React components, and I want to inject them inside my app on some specific parts.
The question is: It is possible to compile react component and inject them in my app after build and at runtime?
I also open to suggestions, still looking for an alternative of this.
On a React app, a client needs to customize some pages for some specific needs.
Is it possible to inject some custom JS / React component and "override" the behavior of an other component?
I don't want to keep the custom component on the bundle all the time and do some control because other clients may customize other features as well ...
Basically, I'm trying to inject a custom JS with a custom component inside and use it.
Anyone had to do samething like this?
In my company we had kind of the same problem and it can get very messy. You can use window.eval() if you import an external js code to make it run in your project but I would not recommend it at all as it gave us a lot of headaches...
That would be for JS code which are instructions and not components.
If your client has their own components maybe you can suggest them to create a node library so you can import their comps.
if react-dom is specifically geared for rendering html elements and react-native renders native views...
Lets say I have an xml type language and I want to use react / jsx to declaratively compose components that have there own native elements.
How do I create base elements (not divs or spans but something else)
How can I get a react component to run its lifecycle method without using ReactDom.render
any resources out there that I can study?
Thanks in advance
You can checkout the tutorial by Nitin Tulswani on writing a custom react renderer.
Noob Question: Is the intention of the cSS API to make it possible to use the components as normal HTML without the need for any additional React code? Does the usage of only the CSS API therefore require the inclusion of the React JS package or can the Blueprint JS package alone work ?
As an author of Blueprint, I can confirm that it is in fact possible to use some of the Blueprint components via CSS only. Components that describe a CSS API in the documentation can be used without React, but usually with caveats (the biggest being that you must write the markup correctly). The CSS API is presented as an alternative to the JavaScript (React) API, and CSS modifiers are supported by the JS APIs through the className prop.
As Blueprint is a React-based UI toolkit, the best experience will be had by using React, primarily because you no longer have to write the markup correctly.
It is not possible to use the components as normal HTML, without ReactJS. Blueprint is a ReactJS UI toolkit for the web.
Their pre-made (React) components are customizable via a JavaScript API or a CSS API (or both).
The idea behind the CSS API, that some of the components have, is to provide additional options for style customization.
Let's use an example. See the Menu component. Its CSS API allows us to modify Menu's style. One example is that we can add icons to menu items, read in their docs:
Add icons to menu items the same way you would to buttons: simply add the appropriate pt-icon-<name> class*.
PS: I'd recommend you to head over the ReactJS docs, understand how ReactJS components work, get deeper knowledge about the core ReactJS concepts (or complete a fundamentals course) and only then - try to implement BlueprintJS.