Self-Hosting Custom Jupyter Notebooks

Hi, I’d like to host some jupyter on my website. It would be nice to have formal instructions in doing so, what are best practices. How much option do I have to customize theme and unecessary features, so that my site visitors can interact with interesting code snippets and play around with exercises.

I’d love to hear your thoughts and ideas. Also, anyone else who has tried to do this?

Putting static code within articles is outdated and I think binder/jupyter is the alternative. I’m aware of code snippets like from codepen also but there’s a file structure visibility inherent to notebooks that I would like to see on my site. I’d very much appreciate a discussion.

I saw https://joergbrech.github.io/Modellbildung-und-Simulation/intro today and thought it was an amazing show case for building a website that includes interactive code and is based on notebooks.

It uses https://jupyter.org/jupyter-book/intro.html which @choldgraf helps maintain.

1 Like

This is a personal passion of mine… sharing work and making it accessible. I basically found myself diving into jupyterhub and dev-ops to help answer this since it appears to do exactly that: run python (or other) code (safely) and display something in a browser.

I used nbinteract and voila, which both have relative advantages. Here is what embedding nbinteract widgets looks like on a static website: regularization. Only problem is that binder is quite slow to react, but I believe I can link it to a jupyter kernel on a rented server to speed it up.

I like the ability to embed the notebook (literally this was just a notebook and then I scraped the header html away) within the style of my website, widgets and all. Here is another little example made with nbinteract, but keeping the default styles: biz.mathfight.club

Using Dash to create pages is way prettier, but it’s a learning curve… This can go from prototype to website in no time. Thebelab was cool but I had some trouble getting it to work as expected with widgets.

That book is by far the cleanest standalone implementation. But when writing blogs, I prefer to hide the code, so my personal use-case is a bit more dashboard-y.

1 Like

Link to the nbinteract homepage: https://www.nbinteract.com/

1 Like

I’d like to also shout-out the nbinteract team for being really responsive and helpful (especially via Gitter). They were very patient and willing to help me understand exactly how it worked. And when one of their JS dependencies mysteriously disappeared from its host, they got it back up within a day of me reaching out.

1 Like

Regarding speed-ups, combine jupyterhub with nbgitpuller, then you can skip the expensive kernel-image build phase.

I use Thebelab on my site and it’s been really great so far. Here’s an example of an article/blog post I wrote using it to turn the static code cells into interactive Jupyter cell. tacosdedatos

At the very top there’s a button that says ":sparkles:activar código :sparkles: " and once you click it the cells I designated to be executable turn into executable code snippets. you can click then “ejecutar” (run) below each cell and it’ll connect to a mybinder session and return the output to display under the cell.

the docs go into more detail and explain it better. if this is what you’re thinking you’d like on your website, I definitely recommend thebelab.

2 Likes

I do like thebelab quite a bit but the “end-user” I have in mind probably doesn’t want to see any code whatsoever, and the widget support is probably the most important thing

that gets files, but doesn’t actually take care of installing dependencies, from what I can tell. Could you say more about what you have in mind? Am I missing something about how that project works?