Status: Things are starting to work. I'm finding bugs in the Reference Examples. I have to update the gallery notebooks in order to be able to serve them as apps. I would like to configure VS Code to enable showcasing how powerful the combination of Panel and VS Code is.... Also on Binder and in a Jupyter Hub.

So I would really, really like Panel to work in VS Code. But it requires fixing bokeh/jupyter_bokeh#131

Hi @philippjfr

As I see it 1) Binder is working 2) It now comes with a nice setup like panel-jupyter-proxy, panel serve of all gallery examples, vs code integrated and a new, improved index page.

In principle this could be all for this PR except adding a link to binder in different places. For example the README.

BUT all the notebooks need to be walked through and prettified in order to be useable as apps. This could be a lot of work and a lot of minor changes. And to be honest. Even without binder a test and update of the notebooks could be in place (c.f. all the bugs posted, I have just scratched the surface I believe).

Here are my questions.

• Do you want the gallery notebooks updated in general to be responsive and end up in a nice app template?
• Do you want the reference examples updated in general to be responsive and end up in a nice app template?`
• If yes to some of these questions. Do you want separate PRs for each notebook, one large Notebook PR or just this PR with everything?
• Could you answer the question about which link to provide to users posted in the first post? Thanks.

Do you want the gallery notebooks updated in general to be responsive and end up in a nice app template?

No, some of them sure, but definitely not all. The focus should be the feature being demonstrated not making all the examples look like.

Do you want the reference examples updated in general to be responsive and end up in a nice app template?`

Definitely not, in fact I'd argue there's no reason to make these available as apps at all.

Could you answer the question about which link to provide to users posted in the first post? Thanks.

I'll make sure to configure this once you're done here. The link will go in the interactivity warning that floats on the right side.

If yes to some of these questions. Do you want separate PRs for each notebook, one large Notebook PR or just this PR with everything?

Just make a single PR for any coordinated changes like this.

Binder is now working as I originally intended it to and more :-).

• You can open jupyter lab in Binder via https://mybinder.org/v2/gh/holoviz/panel/binder?urlpath=lab/tree/examples
• You can open the panel app gallery in Binder via https://mybinder.org/v2/gh/holoviz/panel/binder?urlpath=panel
  • Panel has an improved index/ gallery page
  • You can click the site_title in an app and navigate back to the gallery.
  • Apps are "responsive"
• You can open VS Code on Binder as well. https://mybinder.org/v2/gh/holoviz/panel/binder?urlpath=vscode
• You can open Docs on Binder as well. https://mybinder.org/v2/gh/holoviz/panel/binder?urlpath=docs
• Everything is installed and configured to work with all gallery and reference notebooks.
  • Gallery and reference notebooks work.

Some things are not in scope for me

• Adding links from every example at panel.holoviz.org to the notebook and app on Binder. I hope @philippjfr can/ will do this.

Some things are not working and I am not capable of getting it working

• C.f. Not working in VS Code bokeh/jupyter_bokeh#131
• Serving notebooks as live "docs" with static code cells and dynamic output. For example via Voila. See Enable serving notebook as interactive docs with static code cells #2241.
• And lots more that I created individual bug reports for.

Working Video

Not Working

Watch this video on Youtube https://www.youtube.com/watch?v=gI3qQRVdIIE

@philippjfr Feel free to review and start creating value from this :-) I don't plan to do more on this before getting a review and feedback.

Thanks.

Nice! This will make things look and feel much better. Should we promote the approach from #2271 or is it better to put the template separately like it is here?

When the new approach #2271 is ready and tested I think it would make a lot of sense to switch. That syntax is nice and shorter.

The only downside is that then not a lot of examples will show how to build apps with templates for non-notebook users. There the natural workflow might still be to explicitly declare a template ??

Good point. We should still have a separate example of building such a template explicitly somewhere, and while it's true people may not see that example, having people use servable unnecessarily in a standalone file is not that terrible. I.e., I agree it doesn't make as much sense outside a notebook, but it's still going to be fine for many people, and so I'm ok with more advanced non-notebook users having to do a bit more work to find that there is this other way.

Codecov Report

Merging #2198 (bed6e07) into master (9984f55) will increase coverage by 0.38%.
The diff coverage is 41.66%.

@@            Coverage Diff             @@
##           master    #2198      +/-   ##
==========================================
+ Coverage   83.64%   84.02%   +0.38%     
==========================================
  Files         183      181       -2     
  Lines       21947    21940       -7     
==========================================
+ Hits        18357    18436      +79     
+ Misses       3590     3504      -86     

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 9984f55...bed6e07. Read the comment docs.

There is one fundamental thing to consider. Which branch should be promoted and shared with users? In principle any branch will be available on Binder. But it's important to agree on one that is promoted.

My recommendation would be to promote the binder branch. Then it can be updated and fixed whenever there is a new release. The master branch for example will not always be working is my experience. For example the .ts code cannot build right now I believe.

For example the .ts code cannot build right now I believe.

There are a few errors but they are not preventing the .ts from being built and don't cause any real issues. However I should add a CI check to ensure there are zero TS errors or warnings. Not entirely excited about a binder branch since that's an additional release step but given all the alternatives that still seems like the best approach.

The alternative is just using the master branch. But then users would see functionality that is not yet released. That might be confusing. But maybe also just fine.

Sound to me like it ought to be using a tag indicating the latest release, rather than a separate branch? Our release workflow would then need to update latest-release or released whenever we make a full (non-dev) release. Seeing changes post-release would not only be confusing, it would likely not work, if it's anything like when I try Panel outside the release process (due to the JS build/publish process involved).

Thanks again for this extraordinary effort @MarcSkovMadsen. I'll be adding binder links to all pages in a separate PR.

This pull request has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.