Jupyterwidgets and voila

Open In Colab

Jupyterwidgets and voila#

A very nice client server web app solution is given by jupyter widgets. This is a simplified framework that allows for widgets and sliders embedded into jupyter notebooks. They also work in google colab. Once you have a working notebook, you can host it on a web site if you’d like using a platform called voila. Or, you can just distribute the notebook as a notebook. For example, you cna share the notebook just like this one is shared on colab.

(Note, this notebook doesn’t work with the published version of the book, since the book is simply running on a web server, not a voila server instance. So, we’ll just show you screenshots.)

You first need to install jupyter widgets with pip or conda. Then, restart your runtime and you’re off to the races. In the next chapter, we’ll introduce a more fully featured client server framework called streamlit and then dash. If you just want a simple app, especially if you want to distribute it as a notebook, jupyter widgets should be your goto. If you need a full web application, then use streamlit, dash (or one of the other python web frameworks).

import ipywidgets as widgets

Sliders#

There are integer sliders and float sliders. Let’s first figure out integer sliders.

a = widgets.IntSlider()
b = widgets.IntSlider()

display(a)
display(b)
print([a.value, b.value])
[42, 51]
a1 = widgets.Checkbox(
    value=False,
    description='Check me',
    disabled=False,
    indent=False
)
a2 = widgets.Checkbox(
    value=False,
    description='No check me',
    disabled=False,
    indent=False
)
display(a1)
display(a2)
print([a1.value, a2.value])
[True, True]

Showing real time widget interactions#

a = widgets.IntSlider(description='a')
b = widgets.IntSlider(description='b')
c = widgets.IntSlider(description='c')

def f(a, b, c):
    print(a + b + c)

out = widgets.interactive_output(f, {'a': a, 'b': b, 'c': c})

widgets.HBox([widgets.VBox([a, b, c]), out])