Publishing A Webpage¶

To convert a notebook into an HTML file, start a terminal and run the following command.

nbinteract tutorial.ipynb

This generates a tutorial.html file with the contents of the notebook created in the previous section. Now, push your files to GitHub by running:

git add -A
git commit -m "Publish nb"
git push origin main

After pushing, you now have a URL you can view and share:

{username}.github.io/nbinteract-tutorial/tutorial.html

Where {username} is replaced with your GitHub username. For example, if my username is SamLau95, my URL is:

SamLau95.github.io/nbinteract-tutorial/tutorial.html

Publishing to a different URL¶

To change the URL of the page you publish, you can rename your notebook before you convert it. For example, if you rename tutorial.ipynb to hello.ipynb and convert the notebook, the resulting URL becomes:

{username}.github.io/nbinteract-tutorial/hello.html

To change the path segment before the filename (in this case, nbinteract-tutorial) you can create a new GitHub repo with the subpath name you want. Then, you may create and convert notebooks in this repo. For example, if you create a new repo called blog-posts and convert a notebook called tutorial.ipynb, the resulting URL becomes:

{username}.github.io/blog-posts/tutorial.html

Workflow¶

You have learned a simple workflow to create interactive webpages:

1. Write a Jupyter notebook containing Python functions
2. Use interact to create UI elements to interact with the functions.
3. Run nbinteract {notebook} in a terminal to generate an interactive webpage using your notebook code.
4. Publish your webpage to GitHub pages to make it publicly accessible.

In the next section, you will create an interactive simulation of the Monty Hall Problem. Onward!