Faster react component prototyping by loading js files directly from the project structure

dash-local-react-components is a small library that helps with speeding up the prototyping phase of Dash visualizations that contain small react components (components that are not intended to be shared with other applications and therefore don’t need to be exported to separate libraries).

It allows for loading react components in Dash applications directly from local project files, without any need for a separate build process.

All one has to do is to:

  • add .js files with the custom react components into a directory local to the project,
  • load those components from the python code using a one-liner,
  • include them into the layout.

It is not recommended, though, to use this library in bigger scale projects. The dash-local-react-components serves raw .js files in an un-minified and un-bundled way, which means that they require more resources in order to be download and executed. Also, as it skips the build process, it does not support .jsx files (at least as of now).

But if you want to quickly prototype a small visualization with a custom react component, it might be worth considering.

More info can be found on the github page (MIT license):


This is really cool! Thank you for sharing this work. Love to see folks play around with this part of the codebase.

1 Like