Embedding Jupyter notebook in website

Hi,

I have done a few courses on Coursera and found the experience very good. As a student, I was able to open a Jupyter notebook and work with it. How can I integrate Jupyter notebook in a website? I want to use this for educational purposes for our visitors. Can you point me to a guidance, please?

thanks,

Naveen

If you want to have users be able to open a Jupyter notebook and work with it, the easiest thing is rely on MyBinder.org to serve the session with the content you specify via a Github repository or other type of data information repository-type that MyBinder.org allows. Other examples are Zenodo, Figshare, or GitLab and more.
Then you could just put the link on your page and direct the user to click on it. Like so:


Click this badge to launch Jupyter for an amazing demonstration: Binder


If you click on that on this page, it will spin up a session served via MyBinder.org with the environment and notebook specified here.

You can use whatever you want to link to the launch URL. (Behind-the-scenes, here I used markdown but you can do the same thing with plain HTML on your page.) It doesn’t have to be a badge. You can link the launch URL to whatever you want on your page. It is just like an href in HTML-speak, so you could attach it to anything where’d you normally attach a link for a new page. So it could be text or a picture or a button, etc…

If you like the badges, you can even make custom launch badges in the Jupyter Binder style here. For example, this one was made via that way:

badge

Found out more about making a Binder-ready repository here and in video form here.

1 Like