Input Cell Voilà

Dear Jupyter members,

I’m a new user of this software.
I would like to create an number input cell in Voilà.
for example:

a = float(input(‘Insert first number =’))

I saw however that when I try to export in Voilà, I receive this error message (while in Jupyter works fine):

There was an error when executing cell [1]. Please run Voilà with --show_tracebacks=True or --debug to see the error message, or configure VoilaConfiguration.show_tracebacks.

Anyone could please help me?

My purpose is to create calc_sheet that I could share with other people that don’t use Jupyter.

Thanks
All the best
S

Voila has a bit of a learning curve because the interface it renders for interactivity is based on ipywidgets. You cannot just use code that works in a notebook directly if it involves interaction.

Have you studied the examples at the Voila Gallery and tried to find one close to what you want?

Appmode is often easier to take a working notebook and convert it directly to an app served via MyBinder. There’s a demo you can launch using the launch binder badge there.
I note that once it is corrected (see below), your code example it works in appmode.

Note it is possible to launch directly into appmode via MyBinder URLs but it takes some hand editing of URLs. If you get to the point you have a working notebook that works as you want when you use the ‘appmode’ button to switch and are struggling with adapting the MyBInder launch URL, please post back here and we can help you work it out.

See more info at:


Also, you should review how to post code at this site. Your example isn’t useable as it is presented to others. See advice & examples under ‘Inline code formatting’ and ’ Entire line code formatting’ here. Luckily it was short and easily fixed; however, you want to keep it easier for people trying to help you.

1 Like

Dear Wayne,

thanks for you reply and sorry for wrong code sharing: I’ll studying the forum rules.
I don’t know App Mode, so thanks for the indication.
I upload a .ipynb file in my github that works with mybinders:

GitHub - Stefano2209/My_Second_Binder

I also trying to launch directly in appmode, by follow this topic (I suppose that the answer is yours), but I couldn’t modify the launch URL (is not editable)

python 3.x - How to make myBinder.org launch directly into Appmode - Stack Overflow

I have a last question: I would like to create indipendent file to share with my friends, but I saw with appmode these are not standalone file (is correct?) and are shared with everyone: there’s a way to create files that could launch directly from desktop file (not online?)

All the best
S.Milani

First when developing for appmode, get appmode working in your launches, then refine your notebook, and then you should be ready to launch directly. In your case, the link would be:

https://mybinder.org/v2/gh/Stefano2209/My_Second_Binder/main?urlpath=%2Fapps%2FEs_pag_32.ipynb

You can look at the URL from the launch badge at GitHub - oschuett/appmode: A Jupyter extensions that turns notebooks into web applications. by hovering over it and see the pattern you need to follow in adapting your launch URL.

However, in that current version of your repository, you aren’t installing appmode, and so even if you get the URL right, it isn’t going to work. The directions there touch upon setting up the configuration file for MyBinder. However, it is quite concise and so if you aren’t familiar with MyBinder configuration files, it may not help.

I forked your repo and found I could get it working with appmode by deleting your requirements.txt & replacing it with environment.yml with the following contents based on the directions at the appmode repo and what you had in your requirments.txt:

name: appmode-binderized
channels:
  - conda-forge
dependencies:
  - appmode
  - pip
  - pip:
    - numpy
    - matplotlib
    - ipywidgets

I didn’t pin anything but you can add that back in and test. Make sure you look up the way to version for conda in a .yml file.

You can test my fork here if you want. (The repo for my fork is here.)

Bonus Jupyter tip:
Add a semi-colon to the end of your plotting cell so the last thing the cell sees is the semi-colon & not the plot object, like this:

plt.plot(t,v),plt.xlabel('Tempo (secondi)'), plt.ylabel('Velocità (metri/secondo)'),plt.grid();

(This is trick is covered here.)
That way you won’t see something like this above your plot:

([<matplotlib.lines.Line2D at 0x7fe595155790>],
 Text(0.5, 0, 'Tempo (secondi)'),
 Text(0, 0.5, 'Velocità (metri/secondo)'),
 None)

Jupyter takes the last object and tries to show it. In this case it shows it as a Python object, probably because of the repr for the class. It’s a Jupyter convenience normally by allowing you to just put a variable at the end of cell and get it represented, instead of needing a print() or display().


I think in the second half of your post you are asking about using your code offline so it is private? There are several ways. The most complex would be to set up a private Binderhub on your network. That would give you the same possibilities as with MyBinder and so appmode would work. A JupyterHub would allow this as well. You may want to look at the Littlest JupyterHub. With the other ways, such as ContainDS Desktop (see below), I’m not sure how easy they are to set up with appmode.

This has been touched on in the forum at the following places:

Now there is also Desktop based JupyterLab, see here. If you switch over to using Voila, this may be a viable way, I think? However, I haven’t used it yet and I don’t know if it integrates with Voila quite yet?

There is also a lot of development behind Jupyterlite which is “a full static Jupyter distribution that runs in the browser, without having to start the Python Jupyter Server on the host machine.” See here for a detailed blog post featuring it. It has support for ipywidgets already in it, try an example here; however, await micropip.install('voila') or await micropip.install('appmode') both fail. So this could be used to serve static pages to your users with some sort of authorization and for now you could walk them through using the notebook. Under ‘Next Steps’ here it says Voila is in the works, and so eventually you’d have a more app style offering possible.

Are you sure you need to keep it private though? There are ways you can keep things cryptic and send your colleagues information that allows it to make sense. Sometimes the input data needs to be private and there are ways you can supply those separately so they aren’t shared.

And beyond notebooks, there is a way to share the Python that runs in the notebook on flask and django-based sites. You can add logins to those so that only folks with logins can use the app you’ll serve there.

1 Like

I answer only to the first point for the moment.

I modify my reposity as your indication by including AppMode, and it works (thanks).

However, I don’t understand how could I modify the URLs to use it in MyBinder: when I try to created it in MyBinder the field when I need to change the link are freeze (no changes are permitted).

All the Best
Stefano

You take what the MyBinder.org site gives you and you hand edit in a text editor. You can even use Jupyter’s text editor. Here is a page where the README.md has a lot of variations that point at the same repo. None of those are appmode, but there’s Voila examples & looking at the code may give you an idea how you edit the markdown. What MyBinder.org provides is just a basic link that you can adapt when you have special cases such as appmode.

Dear Wayne,

sorry for the late of my answer.
My question is not related how to edit correctly the link, but how could I paste them into Mybinder.
Infact, I have the fields under “Expand to see the text below, paste it into your README to show a binder badge:” are not modificable, so where I paste the modified link?

Thanks
All the best,
Stefano

It doesn’t matter if the text it shows there isn’t modifiable there. You take that, edit it to what you need, and then paste it in your browser’s URL address bar and it should trigger a launch in the appropriate mode.

I think you are missing how MyBinder and the URLs work. All a URL does is point at the MyBinder.org system at the repository, and optionally say what mode or content to show after the session is launched. If the environment to back the build isn’t available yet because the repo is new, then it build the environment before it can serve it. You don’t need to be at MyBinder.org’s page to launch a session. The first two sentences of my last reply really cover what is involved and give many examples of modified links that do various things. If you haven’t looked at the code for the README.md I linked to in that reply, please do that with the goal of understanding the patterns you see in the URLs.

For example, under the ‘Experimental’ section, I have the following URL:

https://mybinder.org/v2/gh/fomightez/communication_voila/master?urlpath=voila%2Frender%2Fexample.ipynb

If you use your mouse and copy that URL, and paste it in your browser. you’ll see it launches a session via MyBinder.org. The first part of the URL goes to MyBinder.org and MyBInder.org uses the last part of the URL to know what environment to spin up a session in and what mode and content to start in.
Then I put that on the README.md file of the repo here so that people going to that repo can conveniently click the ‘launch binder’ images and get the appropriate session. They don’t have to figure out the URLs because I already worked it out form them and provided links they can launch in their browser.

It would probably help if you shared a repository and what you are trying to do specifically?

1 Like