diff --git a/README.md b/README.md index 32bcf93170f4190d6da8411ddcdfd1b02eb23439..6b370b4e9f5b37ff1b945a31c66763cd53aa76f4 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ -# Jupyter Dashboarding +# Jupyter Web Applications -Example dashboards using voila and voila-vuetify +Example web applications using voila and voila-vuetify ## Tutorials @@ -9,8 +9,38 @@ A summary can be found under [ipywidgets](./ipywidgets), which contains the bare A tutorial for creating your own `ipyvuetify` dashboard can be found [here](./dashboards/vuetify-custom.ipynb). + ## Example apps You can find a collection of example either on the official [voila-gallery website](https://voila-gallery.org/) or in the subdirectory [voila-examples](./voila-examples). -Unless otherwise specified in the notebooks, you can start voila webapp over the command-line using `voila <your-notebook>`. For possible configuration options, use `voila --help`. -If using JupyterLab with `jupyterlab-preview` installed, you can render a preview of your app with the yellow-grey circle button in the notebook toolbar. \ No newline at end of file +Unless otherwise specified in the notebooks, you can start voila webapp over the command-line using `voila <your-notebook>`. For possible configuration options, use `voila --help`. +If using JupyterLab with `jupyterlab-preview` installed, you can render a preview of your app with the yellow-grey circle button in the notebook toolbar. + + + + +## The different voila flavours +The following two examples show how a standalone Jupyter notebook can be turned into a separate app, from the command-line integration. + +### Rendering a notebook including interactive widgets and rich mime-type rendering + + + +### Rendering a notebook making use of a custom widget library ([bqplot](https://github.com/bloomberg/bqplot + + + +### Voilà dashboards with other language kernels + +Voilà is built upon Jupyter standard formats and protocols, and is agnostic to the programming language of the notebook. In this example, we present an example of a Voilà application powered by the C++ Jupyter kernel [xeus-cling](https://github.com/QuantStack/xeus-cling), and the [xleaflet](https://github.com/QuantStack/xleaflet) project. + + + +### To use the gridstack template, pass option --template=gridstack to the voila command line + + + + +### Using the voila-vuetify template with Jupyter widgets based on vuetify UI components which implement Google's Material Design Spec with the Vue.js framework + + \ No newline at end of file diff --git a/images/jupyterlab_preview_pfeil.png b/images/jupyterlab_preview_pfeil.png new file mode 100644 index 0000000000000000000000000000000000000000..8400f572d720543d371ed48a9f17715c423ceffe Binary files /dev/null and b/images/jupyterlab_preview_pfeil.png differ diff --git a/images/voila-basics.gif b/images/voila-basics.gif new file mode 100644 index 0000000000000000000000000000000000000000..473fc036a7ba3e4a574354b402696624e4fdcdd5 Binary files /dev/null and b/images/voila-basics.gif differ diff --git a/images/voila-bqplot.gif b/images/voila-bqplot.gif new file mode 100644 index 0000000000000000000000000000000000000000..a47873bb0fba845583f1abdccee2be6cfe56b8e6 Binary files /dev/null and b/images/voila-bqplot.gif differ diff --git a/images/voila-cling.gif b/images/voila-cling.gif new file mode 100644 index 0000000000000000000000000000000000000000..1439f93bb585a1ec6b78d68642b56fe137135a8e Binary files /dev/null and b/images/voila-cling.gif differ diff --git a/images/voila-gridstack.gif b/images/voila-gridstack.gif new file mode 100644 index 0000000000000000000000000000000000000000..637e25552500d9c5c55a11edf10705a34a539b02 Binary files /dev/null and b/images/voila-gridstack.gif differ diff --git a/images/voila-vuetify.gif b/images/voila-vuetify.gif new file mode 100644 index 0000000000000000000000000000000000000000..8a5b3db54bc4fa33a8e903f93dbbabc69c6ce5e9 Binary files /dev/null and b/images/voila-vuetify.gif differ diff --git a/voila-examples/voila-basic.ipynb b/voila-examples/0_voila-basic.ipynb similarity index 100% rename from voila-examples/voila-basic.ipynb rename to voila-examples/0_voila-basic.ipynb diff --git a/voila-examples/voila-ipyvolume.ipynb b/voila-examples/1_voila-ipyvolume.ipynb similarity index 100% rename from voila-examples/voila-ipyvolume.ipynb rename to voila-examples/1_voila-ipyvolume.ipynb diff --git a/voila-examples/gridstack-example.ipynb b/voila-examples/2_gridstack-example.ipynb similarity index 100% rename from voila-examples/gridstack-example.ipynb rename to voila-examples/2_gridstack-example.ipynb diff --git a/voila-examples/gridstack-scotch.ipynb b/voila-examples/3_gridstack-scotch.ipynb similarity index 100% rename from voila-examples/gridstack-scotch.ipynb rename to voila-examples/3_gridstack-scotch.ipynb diff --git a/voila-examples/vuetify-bqplot.ipynb b/voila-examples/4_vuetify-bqplot.ipynb similarity index 100% rename from voila-examples/vuetify-bqplot.ipynb rename to voila-examples/4_vuetify-bqplot.ipynb diff --git a/voila-examples/vuetify-custom.ipynb b/voila-examples/5_vuetify-custom.ipynb similarity index 100% rename from voila-examples/vuetify-custom.ipynb rename to voila-examples/5_vuetify-custom.ipynb