I presented at the PyCon 2016 Education Summit on "Doing Math with Python" day before yesterday and a lightning talk yesterday. This is the first time, I prepared a slide deck using Jupyter Notebook + Reveal.js. I was pleased with the content creation process and the end result. So, here is what worked for me.
Please note that I have basically taken quite a bit of liberty with HTML where I didn't want to search for markdown way of doing something
Basically, there are two steps:
- Create content in a Jupyter Notebook
- Use jupyter-nbconvert to convert the notebook to a HTML/JS based slide deck
Finally, I hosted the slide deck on GitHub pages.
Please note that, you will need the latest version of jupyter-notebook (4.2.0).
Quick start to publish your slides using GitHub pages
I have copied my real slides to a repo along with a static copy of "reveal.js" (3.3.0) and a Bash script to automate it all. A good starting point then would be to fork my GitHub repo:
$ git clone firstname.lastname@example.org:<your-user-name>/jupyter-notebook-slides.git $ cd jupyter-notebook-slides $ # Start notebook server $ # Edit your slides $ ./publish.sh
Your slides should now be live at http://<user-github-username>.github.io/jupyter-notebook-slides/
The publish.sh script is as follows:
#!/bin/bash $ jupyter-nbconvert --to slides slides.ipynb --reveal-prefix=reveal.js $ mv slides.slides.html index.html $ mkdir -p /tmp/workspace $ cp -r * /tmp/workspace/ $ git add -A . $ git commit -m "Update" $ git checkout -B gh-pages $ cp -r /tmp/workspace/* . $ git add -A . $ git commit -m "new version" $ git push origin master gh-pages $ git checkout master $ rm -rf /tmp/workspace
The part of the script above where I update the gh-pages branch is of a quality where it does its job.
Viewing your slides locally
To view your slides locally:
$ jupyter-nbconvert --to slides slides.ipynb --reveal-prefix=reveal.js --post serve
Understanding what's going on in brief
The first step to do before you can start creating your slides is activate the "Slideshow" toolbar from the "View > Cell Toolbar menu". Once you do that, each of your cells will have a drop down box, and you can select what the cell is. The options you will have are: Slide, Sub-slide, Fragment, Skip and Notes.
Like any other notebook, your "slides notebook" is also made up of cells. So, if you want a cell to be in your final slide deck, you will have to choose one of "Slide", "Sub-slide" or "Fragment". "Skip" will skip the cell from your final slide deck and cells marked with "Notes" will be visible in the "speaker mode" when you present.