Using a regular javascript library inside a React component

Posted by Rohit Kumar | Updated on

Using a regular javascript library inside a React component. The main purpose of JSX is to feel like HTML. The main purpose of render in a React component is to render that “fake” (virtual) HTML. If your external widget is also a React component, the solution is straightforward:

All you have to make sure is that the code above runs after your widget script is loaded (so the Widget component is present). The exact solution to this would depend on your build system.

If your external library is not a React component, then you cannot use a custom widget tag and you must render actual HTML.

The big trick is to not return from render but manually render ourselves after the widget initializes what it needs:


If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.

Related Questions & Answers