Import HTML Template And React

Hi! Support for JavaScript is still slightly experimental. If you haven't seen it already, you can find some examples and background on how it all works in this thread:

At the moment, the html_template expects a string (to make it easier to generate it programmaticaly in Python etc.). So you'd have to do something like:

with open('your_file.html') as f:
    html_template = f.read()

That's probably the most straightforward solution, yes.

If it's a small dependency, you could also copy-paste it into the main JS code you load into Prodigy. Alternatively, you could also import / require your JS dependencies your .js file, then use a bundler like Parcel or Webpack to bundle it all together and finally load the contents of that bundle and pass it forward to Prodigy as the 'javascript' config option. You could even orchestrate all of these processes from Python. But this can easily be overkill and I'd always advocate for simpler solutions with fewer build tools wherever possible.

The Prodigy app uses React under the hood, but it's a compiled app – so there's no easy way to insert React components via external JavaScript. Even if we did ship all the source with it, you'd still need to add your components and compile the whole thing from scratch. (You could maybe render a React app within the compiled React app, but I haven't tried this myself, so not sure if this works as expected.)

We've been thinking about ways to make this easier – e.g. to allow importing Prodigy as a component, passing in your own interfaces (which are also React components that all receive the same props as the built-in interfaces) and rebuilding the app to create a custom bundle. If we wrap this using something like create-react-app, we could even support something close to a zero-config setup for users who are not so experienced with JavaScript build tooling.