pydantic / FastUI

Build better UIs faster.
https://fastui-demo.onrender.com
MIT License
8.2k stars 317 forks source link

What's the story for jupyter widgets? #51

Open paddymul opened 10 months ago

paddymul commented 10 months ago

Writing jupyter widgets with react is particularly tricky. Using FastUI to build jupyter widgets could be really nice.

samuelcolvin commented 10 months ago

I'm not sure what jupyter widgets are, are there some examples or docs somewhere?

Can you provide a use case?

paddymul commented 10 months ago

tl;dr FastUI is doing something similar to the primary way that interactive apps are built on top of the jupyter notebook - ipywidgets. FastUI has some advantages especially around typing and mindshare from fullstack devs. The work of jupyter app builders could be enhanced by using FastUI in some way.

IPYwidgets background

Jupyter Widgets or IPYWidgets is a framework for adding interactivity into jupyter notebooks. It looks similar in many ways to FastUI. IPYWidgets includes some lightweight frontend components implemented in JS but depends on having a running python kernel to call back to, which can respond to user actions. IPYWidgets are primarily built on top of traitlets which has some light typing and default behaviors for different types. The general form of ipywidget based apps is to have a bunch of properties on a class that set other properties.

Each IPYWidget has a python class and corresponding frontend code. Instance variables of a python widget class are traits which when tagged sync=True are bi-directionally bound to the frontend code. like this

class BuckarooWidget(DOMWidget):
    df_json = Dict({}).tag(sync=True)

Simple apps can be built entirely in python wiring together a series of IPYwidgets python code without writing frontend code. IPYWidgets can also utilize customJS written inline or built separately. There is no enforcement of types between the frontend code and python code.

How FastUI can fit into the picture

It looks like FastUI is similar in many ways to IPYWidgets. As a widget library author, I'm interested in leveraging the typing features of pydantic along with a frontend tool that guarantees the same types are being used. I think it's probably possible to build Pydantic classes that work as FastUI components. The same frontend code can be driven from IPYWidgets. And Pydantic could be used alongside IPYWidgets.

Sorry if this was a rambling response, there's a whole landscape to try to explain.

https://ipywidgets.readthedocs.io/en/stable/ https://github.com/ipython/traitlets bqplot plotting library ipyleaflet interactive map library

samuelcolvin commented 10 months ago

Thanks for trying to explain :-).

Obviously, is be keen for you to try and leverage FastUI, but I have no idea how well the two can fit together.

I'm not trying to build full duplex communications, too much flexibility ends up with nothing more than a layer of obfuscation over http/websockets.

I'd rather build specific components to do useful common things.

vikramsg commented 10 months ago

This is the entire point of Solara. https://github.com/widgetti/solara

Maybe an interesting idea would be to figure out if we can use FastUI and Solara together.

jgunstone commented 8 months ago

just to expand slightly more - as @paddymul describes ipywidgets and jupyter widgets provide a way to synchronise front end js libs with the python server running the notebook via traitlets. jupyter can then be used to author applications and deploy using Voila. This provides a simple way to turn an exporatory analysis in a notebook into a client facing web application. It also allows users to create a UI totally in python. a downside to this is you need a python server running to deploy an application - typically JupyterHub manages this in one way or another. voici is being developed which uses pyodide allowing the python server to be run in the client.

there are 2 ways I could imagine FastUI being useful in a Jupyter context:

aside: I applaud the FastUI approach of moving as much as possible to the backend and using simple / dumb JS frontend components as it makes the dev stack nice and simple. The thing I'd be most interested in here is how to inject custom front-end components...? as a dev using python to make front-end apps, building widgets from ipywidgets gives lots of customisation possibility which practically I've found to be essential when making applications.... but you are obviously also greatly constrained as you don't have access to the rich front-end world of React... it would be awesome if FastUI clearly described the process of adding custom React stuff to make the process less scary for python devs.