presentations with jupyter notebook

Creating Presentations with Jupyter Notebook

Jupyter Notebook can be turned into a slide presentation that is kind of like using Microsoft Powerpoint, except that you can run the slide’s code live! It’s really neat how well it works. The only con in my book is that there isn’t a lot of theming that can be applied to your slides, so they do end up looking a bit plain.

In this article, we will look at two methods of creating a slideshow out of your Jupyter Notebook. The first method is by using Jupyter Notebook’s built-in slideshow capabilities. The second is by using a plug-in called RISE .

Let’s get started!

Note: This article assumes that you already have Jupyter Notebook installed. If you don’t, then you might want to go to their website and learn how to do so.

The first thing we need to do is to create a new Notebook. Once you have that done and running, let’s create three cells so that we can have three slides. Your Notebook should now look like the following:

Now let’s turn on the “slideshow” tools. Go to the View menu and then click on the Cell Toolbar menu option. You will find a sub-menu in there that is called Slideshow . Choose that. Now your Notebook’s cell should look like this:

There are now little comboboxes on the top right of each cell. These widgets give you the following options:

You can just create a series of Slides if you like, but you can make the slideshow a bit more interesting by adding Sub-Slides and Fragments. Sub-slides are just slides that are below the previous one while Fragments are basically fragments within the previous slide. As an aside, I have actually never used Fragments myself. Anyway you can also set a slide to Skip, which just allows you to skip a slide or Notes, which are just speaker notes.

Let’s add some text to our first cell. We will add the text “# Hello Slideshow” to it and set the cell type to Markdown. Note the pound sign at the beginning of the text. This will cause the text to be a heading.

In cell two, we can add a simple function. Let’s use the following code:

For the last cell, we will add the following text:

Make sure you set that to be a Markdown cell as well. This is what my cells ended up looking like when I was done:

To make things simple, just set each of the cell’s individual comboboxes to Slide .

Now we just need to turn it into an actual slideshow. To do that, you will need save your Notebook and shut down the Jupyter Notebook server. Next you will need to run the following command:

To navigate your slideshow, you can use your left and right arrow keys or you can use spacebar to go forward and shift_spacebar to go back. This creates a pretty nice and simple slideshow, but it doesn’t allow you to run the cells. For that, we will need to use the RISE plugin!

Getting Started with RISE

Reveal.js – Jupyter/IPython Slideshow Extension (RISE) is a plugin that uses *reveal.js* to make the slideshow run live. What that means is that you will now be able to run your code in the slideshow without exiting the slideshow. The first item that we need to learn about is how to get RISE installed.

Installing rise with conda

If you happen to be an Anaconda user, then this is the method you would use to install RISE:

This is the easiest method of installing RISE. However most people still use regular CPython, so next we will learn how to use pip!

Installing rise with pip

You can use Python’s pip installer tool to install RISE like this:

You can also do `python -m pip install RISE` is you want to. Once the package is installed, you have a second step of installing the JS and CSS in the proper places, which requires you to run the following command:

If you somehow get a version of RISE that is older than 5.3.0, then you would also need to enable the RISE extension in Jupyter. However, I recommend just using the latest version so you don’t have to worry about that.

Using RISE for a SlideShow

Now that we have RISE installed and enabled, let’s re-open the Jupyter Notebook we created earlier. Your Notebook should now look like this:

You will notice that I circled a new button that was added by RISE to your Notebook. If you mouse over that button you will see that it has a tooltip that appears that says “Enter/Exit RISE Slideshow”. Click it and you should see a slideshow that looks a lot like the previous one. The difference here is that you can actually edit and run all the cells while in the slideshow. Just double-click on the first slide and you should see it transform to the following:

After you are done editing, press SHIFT+ENTER to run the cell. Here are the primary shortcuts you will need to run the slideshow effectively:

• SPACEBAR – Goes forward a slide in the slideshow
• SHIFT+SPACEBAR – Goes back a slide in the slideshow
• SHIFT+ENTER – Runs the cell on the current slide
• DOUBLE-CLICK – To edit a Markdown cell

You can view all the Keyboard shortcuts by going to the Help menu when not in Slideshow mode and clicking the Keyboard Shortcuts option. Most if not all of these shortcuts should work inside of a RISE slideshow.

If you want to start the slideshow on a specific cell, just select that cell and then press the Enter Slideshow button.

RISE also works with Notebook widgets. Try creating a new cell with the following code:

Now start the slideshow on that cell and try running the cell (SHIFT+ENTER). You should see something like this:

You can use RISE to add neat widgets, graphs and other interactive elements to your slideshow that you can edit live to demonstrate concepts to your attendees. It’s really quite fun and I have used RISE personally for presenting intermediate level material in Python to engineers.

RISE also has several different themes that you can apply as will as minimal support for slide transitions. See the documentation for full information.

Wrapping Up

In this chapter we learned about two good methods for creating presentations out of our Jupyter Notebooks. You can use Jupyter directly via their nbconvert tooling to generate a slideshow from the cells in your Notebook. This is nice to have, but I personally like RISE better. It makes the presentations so much more interactive and fun. I highly recommend it. You will find that using Jupyter Notebook for your presentations will make the slides that much more engaging and it is so nice to be able to fix slides during the presentation too!

Related Reading

• Presenting code using Jupyter Notebook
• The RISE Github page
• Jupyter nbconvert Usage
• How to build interactive presentations with Jupyter Notebook and Reveal JS

4 thoughts on “Creating Presentations with Jupyter Notebook”

Pingback: Jupyter Notebook Extension Basics | The Mouse Vs. The Python

Pingback: Creating Jupyter Notebook Widgets with interact - The Mouse Vs. The Python

Pingback: How to Export Jupyter Notebooks into Other Formats - The Mouse Vs. The Python

Pingback: Jupyter Notebook Extension Basics - The Mouse Vs. The Python

Comments are closed.

Create interactive slides with Python in 8 Jupyter Notebook cells

Creating presentations in Jupyter Notebook is a great alternative to manually updating slides in other presentation creation software. If your data changes, you just re-execute the cell and slide chart is updated.

Jupyter Notebook is using Reveal.js (opens in a new tab) for creating slides from cells. The standard approach is to write slides code and Markdown in the Jupyter Notebook. When notebook is ready, it can be exported to standalone HTML file with presentation.

What if, you would like to update slides during the slide show? What is more, it would be fantastic to have interactive widgets in the presentation. You can do this in Mercury framework.

In this tutorial, we will create an interactive presentation in Jupyter Notebook and serve it with Mercury.

Create presentation in notebook

Please enable Slideshow toolbar in Jupyter Notebook. It can be done by clicking View -> Cell Toolbar -> Slideshow . It is presented in the screenshot below:

We will need following packages to create presentation in Python notebook:

Please make sure that they are installed in your environment.

1. Import packages and App setup

The first step is to import packages and setup Mercury App :

We setup title and description for App object.

Please note that we set Slide Type to Skip . This cell will not appear in the presentation.

2. Add title

The second cell is a Markdown with title:

The Slide Type is set to Slide . It is our first slide!

3. Add slide with Markdown

Add new Markdown cell with the following cell.

Please set Slide Type to Slide . It will be a second slide. I'm using ## as slide title ( # will produce too large title in my opinion).

4. Add Mercury Widget

Please add code cell with Text widget. We will use it, to ask users about their name.

We set Slide Type as Skip , so this cell will not appear in the presentation.

5. Display name

Let's use the name.value in the slide. Please add a code cell. We will display a Markdown text with Python variables by using Markdown function from Mercury package.

Please set the Slide Type to Slide .

You can display Markdown with Python variables by calling mr.Markdown() or mr.Md() functions. Both do the same.

The first five cells of the notebook:

You can enter your name in the widget during the notebook development. There will be no change in other cells. If you want to update the cell with new widget value, please execute it manually.

6. More widgets

We can add more widgets to the presentation. They will be used to control chart in the next slide.

We have used Slider and Select widgets. They are displayed in the notebook. This cell will not be displayed in the presentation, so set Slide Type to Skip .

7. Scatter plot

We will add a new code cell. It will have Slide Type set to Slide .

We used widgets values by accessing them with samples.value and color.value .

Screenshot of the notebook with scatter plot:

8. Final slide

Please add a last Markdown cell. Its Slide Type will be set to Slide :

Please notice that link is added with HTML syntax. There is a target="_blank" used to open link in a new tab.

Run presentation in Mercury

Please run Mercury local server in the same directory as notebook:

The above command will open a web browser at http://127.0.0.1:8000 . Please click on a card with presentation.

You can navigate between slides with arrows in the bottom right corner. You can enter the full screen mode by pressing F on the keyboard. Please use Esc to exit full screen mode.

You can change widgets values in the sidebar and presentation slides will be automatically recomputed:

You can export your slides as PDF or HTML by clicking Download button in the sidebar.

Presenting with Jupyter Notebooks

The best way to walk through this tutorial is using the accompanying jupyter notebook:.

[ Jupyter Notebook ]

In the last year I’ve started presenting work using Jupyter Notebooks, rebelling against the Bill Gates'-driven status-quo. Here I’ll explain how to do it. It’s not difficult, but in my opinion makes presentations look slicker, whilst allowing you to run code live in a presentation if you like. First, we need to download the plug-in that gives us the presentation functionality, it’s called RISE . We can do this easily using pip in a terminal window:

Once installed, our first move is to add the presentation toggles to our notebook cells. We do this by clicking View in the menu bar, then Cell Toolbar , then Slideshow :

Adding Presentation Toggles to Cells

Slide types.

This adds a Slide Type dropdown to each cell in the notebook. Here we can choose one of five options:

• Slide : Used to start a new chapter in your presentation, think of this as a section heading in LaTeX.
• Sub-slide : Slide falling within the chapter defined by a Slide cell.
• Fragment : this is to split the contents of one slide into pieces; a cell marked as a fragment will create a break inside the slide; it will not show up right away, you will need to press Space one more time to see it.
• Skip : Skips cell when in presenter mode.
• Notes : Cell that allows the author to write notes on a slide that aren’t shown in presenter view.

As with any notebook, we can define the cell type to be either Markdown or Code . As you’d expect, we present any text or image-based slide in Markdown , reserving the Code cell type if and only if we want to explicitly run some code in the presentation. If you aren’t familiar, Markdown is a straightforward language for text formatting; I won’t go into the details here, but suffice to say you can learn the basics of Markdown in 5 minutes. You can find a useful cheatsheet here .

Adding images is easy too. I advise creating a sub-directory in your working directory called /images and storing anything you want to present there. Then you display them in a markdown file using some simple HTML syntax:

<img class="" src="images/london_deaths.jpeg" style="width:75%">

You can manipulate the style attribute to change the size of the image. Don’t worry, this is the only HTML you need to know!

Entering Presentation Mode

To view your slideshow click on the bar-chart button in the menu bar. This will start the presentation from the cell currently selected:

That’s it! This tutorial has given you an introduction to the basics of RISE for presenting with Jupyter Notebooks, you can of course customise these to your heart’s content using further plug-ins and more advanced Markdown. Here’s a summary of the useful links from this document to finish:

• RISE Documentation
• Markdown Cheatsheet
• Markdown Table Generator

Twitter: @enjeeneer

Website: https://enjeeneer.io/.

• presentation

Create Presentation from Jupyter Notebook

You don't need to install any additional framework to make a presentation from Jupyter Notebook. Jupyter is using Reveal.js library for creating slides. However, I strongly recommend to install RISE ( R eveal.js I Python S lideshow E xtension) extension. It greatly simplifies the process of slide creation with a live preview.

The outline for this article:

• create a simple notebook with one chart,
• convert notebook to a slideshow,
• presentation development with RISE extension,
• parameterized presentations,
• publishing presentation.

Create Jupyter Notebook

Let's create a Jupyter notebook. It will have a few Markdown and Python cells.

Please notice that we can mix Python variables with Markdown thanks to IPython.display.Markdown() function:

The output of the above code cell will contain a Markdown. There is a simple scatter plot in the notebook for randomly generated points:

The matplotlib scatter plot:

It is a simple notebook created for example purposes. There is no limit on the number of slides or cells. From my experience, I was creating a presentation with more than 70 slides with many plots/images, and the slideshow was working smoothly, even with the presentation published as a website (hosted in the cloud).

Create Presentation

The notebook is saved in ipynb format . The next step is to convert it to a slideshow. We need to provide information on how to use cells in the presentation. Please click View ➡️ Cell Toolbar ➡️ Slideshow .

Each cell will have a toolbar with the select widget. You can select there how cells will be used in the presentation:

• Slide - the cell will be a new slide;
• Sub-Slide - the cell will be shown in the current slide as a replacement for previous content. It will be available in arrow-down navigation;
• Fragment - the cell will appear in the current slide, it will append to the previous content. It will be available in arrow-down and arrow-right navigation;
• Skip - the content will not be displayed in the presentation;
• Notes - notes for slide, the cell content is not displayed in the presentation;

Please select the Slide Type for every cell and save the notebook.

How to create a presentation for Jupyter Notebook? We need to use the nbconvert tool. It is installed with Jupyter Notebook. There is a command for converting notebook to presentation:

You can open the output file presentation.slides.html in the web browser (just double-click on the file). Alternatively, you can serve slides with jupyter ; slides will be available at http://127.0.0.1:8000/presentation.slides.html :

There are several ways to hide the code in the presentation, one of them is to pass --no-input parameter to nbconvert :

The presentation with hidden code:

It is possible to convert the Jupyter Notebook presentation into PDF slides. One of the ways to do this is to add ?print-pdf in the URL in a web browser while displaying HTML format:

The presentation will be in a format ready to print. To save it as a PDF, just print the website with Save as PDF selected for the destination.

RISE Extension

There is a RISE extension that may be helpful for developing presentations in Jupyter Notebook. It can be easily installed with pip or conda :

You get a small chart icon in the top toolbar after installation. You switch between the notebook and presentation views by clicking on the chart icon.

What is more, you can edit the code in presentation mode. The RISE extension doesn't have the option to hide the code ( GitHub issue discussion about hiding code feature in RISE repository ). If you would like to hide/show the code during the presentation development, you need to install an additional extension called hide_code .

Parameterized Presentation

What if you would like to change or recompute charts in the presentation based on user input? There is an open-source framework called Mercury that makes it possible.

You can easily add interactive widgets to the presentation and publish it with Mercury . Widgets are added based on the YAML header. They are directly connected with Python variables in the notebook. User changes, tweak widgets, and execute the notebook with new values. The slides in the presentation will be automatically recomputed.

The video from an interactive presentation about Mercury :

Publishing Presentation

The final presentation is in HTML format. You can publish it as a static website. There are several ways to publish Jupyter Notebook; you can host it on GitHub Pages, Netlify, or Vercel. If you are using Mercury framework for parameterized presentations, you can host it in the cloud (soon, there will be available online service runmercury.com for hosting notebooks).

Jupyter Notebook Presentations might be a great alternative to traditional presentation software. You will save time by building the presentation in the same environment where your code is. Any update in code or chart change will immediately affect the presentation - no need to manually copy-paste results. The parameterized presentation can take your slides one step further. Imagine your supervisor or manager playing with your slides and recomputing new charts.

Create a slide deck using Jupyter Notebooks

There are many options when it comes to creating slides for a presentation. There are straightforward ways, and generating slides directly from Jupyter is not one of them. But I was never one to do things the easy way. I also have high expectations that no other slide-generation software quite meets.

Why transition from slides to Jupyter?

I want four features in my presentation software:

• An environment where I can run the source code to check for errors
• A way to include speaker notes but hide them during the presentation
• To give attendees a useful handout for reading
• To give attendees a useful handout for exploratory learning

More Great Content

• Free online course: RHEL technical overview
• Learn Advanced Linux Commands
• Download Cheat Sheets
• Find an Open Source Alternative
• Read Top Linux Content
• Check out open source resources

There is nothing more uncomfortable about giving a talk than having someone in the audience point out that there is a coding mistake on one of my slides. Often, it's misspelling a word, forgetting a return statement, or doing something else that becomes invisible as soon as I leave my development environment, where I have a linter running to catch these mistakes.

After having one too many of these moments, I decided to find a way to run the code directly from my slide editor to make sure it is correct. There are three "gotchas" I needed to consider in my solution:

• A lot of code is boring. Nobody cares about three slides worth of import statements, and my hacks to mock out the socket module distract from my point. But it's essential that I can test the code without creating a network outage.
• Including boilerplate code is almost as boring as hearing me read words directly off of the slide. We have all heard (or even given) talks where there are three bullet points, and the presenter reads them verbatim. I try to avoid this behavior by using speaker notes.
• There is nothing more annoying to the audience when the talk's reference material doesn't have any of the speaker notes. So I want to generate a beautiful handout containing all of my notes and the slides from the same source. Even better, I don't want to have slides on one handout and a separate GitHub repository for the source code.

As is often the case, to solve this issue, I found myself reaching for JupyterLab and its notebook management capabilities.

Using Jupyter Notebooks for presentations

I begin my presentations by using Markdown and code blocks in a Jupyter Notebook, just like I would for anything else in JupyterLab. I write out my presentation using separate Markdown sections for the text I want to show on the slides and for the speaker notes. Code snippets go into their own blocks, as you would expect.

Because you can add a "tag" to cells, I tag any cell that has "boring" code as no_markdown .

(Moshe Zadka, CC BY-SA 4.0 )

Then I convert my Notebook to Markdown with:

There are ways to convert Markdown to slides —but I have no idea how to use any of them and even less desire to learn. Plus, I already have my favorite presentation-creation tool: Beamer .

But Beamer requires custom LaTeX, and that is not usually generated when you convert Markdown to LaTeX. Thankfully, one Markdown implementation– Pandoc Markdown —has a feature that lets me do what I want. Its raw_attribute extension allows including "raw" bits of the target format in the Markdown.

This means if I run pandoc on the Markdown export from a notebook that includes raw_attribute LaTeX bits, I can have as much control over the LaTeX as I want:

The --listings makes pandoc use LaTeX's listings package, which makes code look much prettier. Putting those two pieces together, I can generate LaTeX from the notebook.

Through a series of conversion steps, I was able to hide the parts I wanted to hide by using:

• LaTeX raw_attribute bits inside Jupyter Notebook's Markdown cells
• Tagging boring cells as no_markdown
• Jupyter's "nbconvert" to convert the notebook to Markdown
• Pandoc to convert the Markdown to LaTeX while interpolating the raw_attribute bits
• Beamer to convert the Pandoc output to a PDF slide-deck
• Beamer's beamerarticle mode

All combined with a little bit of duct-tape, in the form of a UNIX shell script, to produce slide-deck creation software. Ultimately, this pipeline works for me. With these tools, or similar, and some light UNIX scripting, you can make your own customized slide created pipeline, optimized to your needs and preferences.

What is the most complicated pipeline you have ever used to build a slide deck? Let me know about it—and whether you would use it again—in the comments.

Edit images with Jupyter and Python

Who needs to learn an image-editing application when you can do the job with open source tools you already know?

JupyterLab teaches Python developers magic

JupyterLab, the successor to Jupyter Notebook, feels like playing video games with the cheat codes enabled.

Markdown beginner's cheat sheet

Learn Markdown syntax to be ready to contribute to open source software.

Related Content

• Python Course
• Python Basics
• Interview Questions
• Python Quiz
• Popular Packages
• Python Projects
• Practice Python
• AI With Python
• Learn Python3
• Python Automation
• Python Web Dev
• DSA with Python
• Python OOPs
• Dictionaries

Create Presentations Using RISE in Jupyter Notebook

RISE is an extension of Jupyter Notebook designed to revolutionize the way you create presentations. By seamlessly integrating with Jupyter Notebook, RISE allows you to transform your static code and data into dynamic, interactive presentations. In this guide, we’ll explore how to install RISE, set up presentation slides, view and present your slides, and delve into the additional features of using the RISE chalkboard for enhanced interactivity.

Installation of RISE

Let’s start with the basics. Installing RISE is the first step towards creating engaging presentations in Jupyter Notebook . To install RISE, follow these simple steps:

Open your terminal, use the following command, and press shift+enter to execute the command:

python -m pip install RISE

Steps to Create Presentations using RISE in Jupyter

Now, let’s move on to setting up your presentation slides. You will find the RISE icon on the top of the Jupyter Notebook page.

Setting Up Presentation Slides

Setting up presentation slides involves configuring the slide types and layout for your presentation.

• Open Jupyter Notebook.
• Click on the ‘View’ menu at the top of the notebook.
• Select ‘Cell Toolbar’ from the dropdown menu.
• Choose ‘Slideshow’ from the options available.

Now that you’ve configured your slide types and layout, it’s time to prepare your slides.

Preparing Slides

Creating compelling content for your slides is essential to captivate your audience. Follow these steps to prepare your slides:

• Create new cells in the notebook for each slide’s content.
• Assign different slide types to cells based on their purpose, such as Slide, Subslide, Fragment, Skip, or Notes.

Determine the slide types you’ll use:

• Slide: The content on this slide is self-explanatory. A new slide will start from this cell.
• Subslide: Type of slide that will appear under the current slide
• Fragment: If you want to control the flow of information on your slide, divide it into fragments.
• Skip: skip this cell, it won’t appear on the slide.
• Notes: This cell works as notes.
• “ — ”: Inherit behavior from the cell above.

Example: Here’s an example of slide preparation using different slide types:

Viewing Presentation

Before presenting to your audience, it’s crucial to preview how your presentation will appear. Here’s how you can do it:

• Run the notebook by clicking the ‘Run’ button or pressing Shift + Enter.
• Navigate through the slides using the space bar, arrow keys, or other navigation controls provided by RISE.

Now that you’ve previewed your presentation, Follow these steps to start presenting:

• Utilize the presentation mode by pressing the appropriate shortcut.
• Navigate through your slides seamlessly using the space bar, arrow keys, or other navigation controls.

How to Use RISE Chalkboard

Now, let’s explore the additional feature of RISE: the chalkboard. The chalkboard feature allows you to annotate your slides in real time, adding a layer of interactivity to your presentation. Here’s how you can use the RISE chalkboard:

• Enable the chalkboard mode by clicking on the chalkboard icon in the presentation mode.
• Use your mouse or touchpad to draw or write on the slides.
• Erase or clear annotations as needed to maintain clarity.

With the RISE chalkboard, you can engage your audience and make your presentations more interactive and dynamic.

Please Login to comment...

Similar reads.

• Jupyter-notebook
• How to Delete Discord Servers: Step by Step Guide
• Google increases YouTube Premium price in India: Check our the latest plans
• California Lawmakers Pass Bill to Limit AI Replicas
• Best 10 IPTV Service Providers in Germany
• Content Improvement League 2024: From Good To A Great Article

Improve your Coding Skills with Practice

What kind of Experience do you want to share?

Natalie B. Hogg

Cosmologist

Using a Jupyter notebook to make presentation slides

• Open a blank Jupyter notebook.
• Add a cell and convert it to Markdown (either esc + m ) or by using the drop down menu at the top of the notebook.
• Add your text, equation or image to the cell (images can be added via the edit menu, though some HTML tags may be needed to render and/or resize the image).
• Choose a slide type in the drop down menu of the cell itself (slide, sub-slide, fragment, skip or notes).
• Save the notebook.
• In the terminal, run jupyter nbconvert *.ipynb --to slides .
• Open the resulting .html file in a browser and use the arrow keys to navigate.

I turn coffee Lapsang Souchong tea into code; if you found this post useful you can contribute to my habit here: https://ko-fi.com/nataliebhogg .

I’m in a strange kind of limbo at the moment. I’m not being paid, since I can’t sign my new contract without being physically present in Spain. And, until the 30th of March, it was physically impossible to enter Spain unless you were a Spanish resident, since the borders were closed due to Covid restrictions. Due to Brexit, I also need a visa in order to be able to stay in Spain for more than ninety days and to legally work there. So, I have an appointment at the Spanish consulate in London on Friday to submit my visa application. I’m hoping for a quick decision so I can book a flight, get to Madrid, sign my contract and start working (and drawing a salary). But, until then, I’m in this strange, semi-working state.

I could have taken this time off completely, but with the UK in lockdown and everything shut, I know I would have quickly got bored in the face of a two or three month holiday with nothing to do and nowhere to go. So, I resolved to keep working, despite the lack of pay, albeit at a reduced pace. I’ve been attending journal clubs and mainly working on turning a chapter of my PhD thesis into a paper.

As a result, it was nice to take a full five days off over the Easter weekend. I finished reading three books: Island of Dreams by Dan Boothby (ok if you are interested in Gavin Maxwell, Scotland or otters), The Nine Tailors by Dorothy L. Sayers (which I highly recommend!) and Never Split the Difference by Chris Voss (probably only useful if you’re a hostage negotiator or someone working in big business). It was a conscious decision to try and read more and I’m glad it paid off. I always forget how refreshed I feel after even just a couple of days off from work.

This morning I finished making my slides for my talk at Britgrav next week. I’m going to be presenting my work from a few months ago on how the distance duality relation can be constrained with standard sirens and how modified gravity effects can bias this type of analysis. I tend to use either Google Slides or LaTeX Beamer to make presentations, depending on the content and audience, but this time I decided to use Markdown in a Jupyter Notebook which I then converted to HTML.

This produces very clean looking slides, and it’s easy to write LaTeX commands too (unlike in Google Slides).

The process I followed to create the slides is very simple.

The same week that I’m giving this talk, I’m also presenting the H0 review paper by Di Valentino et al (we’re having a special H0 tension week, as someone else is going to present Efstathiou’s recent offering on the same topic) and the following week I’ve been invited to give a seminar at my old undergraduate institution, Aberystwyth University, which I’m really looking forward to.

Share this:

• Click to share on Twitter (Opens in new window)
• Click to share on Facebook (Opens in new window)

Natalie Hogg

Leave a comment Cancel reply

• Already have a WordPress.com account? Log in now.
• Subscribe Subscribed
• Copy shortlink
• Report this content
• View post in Reader
• Manage subscriptions
• Collapse this bar

Creating presentations from Jupyter notebooks

January 12, 2022

2022   ·   python   jupyter   data visualization  

The Jupyter notebook, controversial though it may be , is a core data exploration and experimentation platform for many in the data and scientific communities. In particular, its combination of REPL-like input and embedded HTML output make for an ideal means of generating and analyzing data tables and visualizations. This is great for sharing information with others – and, it turns out, the Jupyter ecosystem includes tooling to quickly generate reveal.js presentations using the included nbconvert library.

Getting started

For local service, you’ll need to provide a path to the reveal.js library. It’s probably easiest to clone it into the working directory of your notebook:

Then, run the export command to initiate the reveal.js service:

The --to option actually accepts a number of possible output formats, including PDF (try jupyter nbconvert --help to see other options), but the slides argument targets reveal.js slides. --reveal-prefix should point to your local reveal.js directory, and --post serve specifies that the reveal.js serve command should be run following conversion (a tab containing the live presentation should be opened on your default browser).

By default, every cell is treated as a unique slide, but you have some basic control over how cells are turned into reveal.js objects. First, select the “slideshow” view from the menu:

You can choose from a few different slide types for each cell:

“Sub-slide” creates a separate slide which is grouped within the closest “Slide” (in reveal.js presentations, lateral movement will change parent “Slide” groups, while vertical movement will proceed within an individual slide grouping). A “fragment” will be conjoined to the previous slide/sub-slide, but will be revealed on an extra enter/arrow-key press/click (sort of like the “appear” animation in Powerpoint progressively reveals individual bullet points).

A few closing notes:

The nbconvert docs suggest reverting your reveal.js source to version 3.5 (via git checkout 3.5.0 in the reveal.js repo). I found that this broke some things and do not recommend it.

Jupyter notebooks don’t immediately auto-save state, so remember to click the “save and checkpoint” button before exporting to ensure that you capture the most recent iteration of your work.

Theoretically the HTML output should be able to pull requisite scripting from a reveal.js CDN, but it didn’t seem to work for me ¯\_(ツ)_/¯ . Maybe there are more --reveal-prefix related options? Who knows.

Critically, reveal is flexible about sizing for a lot of things, but will struggle with images (and probably code output), so make sure to double-check that any visual output looks right in a presentation beforehand (you may need to resize it)

Nikolai Janakiev

All things data // data science / data engineering / data visualization / GIS

© 2024. All rights reserved.

home · about · projects

Creating Slides with Jupyter Notebook

Table of contents, preparation, convert slides for reveal.js, serve slides with https server, export as pdf.

Jupyter notebook is a powerful tool to interactively code in web-based notebooks with a whole plethora of programming languages. With it, it is also possible to create web-based slideshows with reveal.js .

The slides functionality is already included in Jupyter Notebook, so there is no need to install plugins. Although slides do not work at the time of writing for JupyterLab . To open the slides toolbar for each cell in your Jupyter Notebook, enable it via View > Cell Toolbar > Slideshow :

Now you can specify for each cell what kind of slide type you want. The available types are Slide (new slide), Sub-Slide (new slide below last one), Fragment (fragment within previous slide), Skip (skip this cell) and Notes (adding speaker notes):

You can now convert the notebook with the jupyter-nbconvert command line tool and the --to slides option. First, you need to add/clone reveal.js into your folder with the presentation ( git clone https://github.com/hakimel/reveal.js/ ) and then you can run the command:

If you want to enable scrolling you can add the following to the jupyter nbconvert command (thanks to Hannah Augustin for the hint):

It is also possible serve slides with an https server by using the --post serve option as in the command:

This will run a server which opens the presentation in your browser ready for presentation. Another neat thing is RISE , a Jupyter slideshow extension that allows you to instantly turn your Jupyter Notebooks into a slideshow with the press of a button in your notebook:

Finally, if you want to create a PDF from your slides, you can do that by adding ?print-pdf to the url of the previously hosted slides:

After opening this url, you can now print the page to PDF. You can find other configuration options in the nbconvert documentation .

Happy presenting!

Related Posts

Installing and running jupyter on a server 12 feb 2019, manage jupyter notebook and jupyterlab with systemd 10 nov 2020, remove jupyter notebook output from terminal and when using git 06 nov 2021.

How you can ditch PowerPoint and build better slides with Jupyter and Reveal.js

By Dat Tran

In this article, I will introduce jupyter2slides — a little side project of mine that lets you easily create beautiful and interactive presentation slides using Jupyter Notebook and reveal.js .

Here’s what it looks like:

And this is the corresponding PDF, generated with DeckTape :

My motivation for building this

Microsoft PowerPoint is cool. It’s like a Swiss Army knife for consultants, and you can make beautiful slides with it.

When it comes to code, though, PowerPoint sucks. The solution is to use reveal.js. You can use markdown to highlight code, and it’s responsive. But like LaTeX , it can be tedious.

Another way to use reveal.js is through Jupyter which offers many advantages:

• In-browser editing for code with automatic syntax highlighting, indentation, and tab completion
• Ability to run code with the results of computations attached to the code which generated them (literate programming)
• Supports Markdown and many media formats such as HTML, LaTex, audio, and images
• Supports interactive widgets to manipulate and visualize data
• Uses tools from the PyData stack like Matplotlib, Numpy, and Bokeh as well as others like Plotly and Folium

To use reveal.js with Jupyter, you create a notebook and use nbconvert to get reveal.js slides as well. But the standard design is boring:

My solution

I’ve worked on a project that lets you generate beautiful presentation slides. The entire code is on my GitHub repo . Under the hood, it still uses nbconvert with reveal.js, but I extended it by:

• Adding a customized theme which has a cleaner design
• Enabling the title footer plugin by default
• Enabling slide numbers by default
• Adding a Jupyter notebook template with examples like cover and divider slides, markdown syntax, and more
• Making it easier to push the presentation to Cloud Foundry by using Flask and the Python buildpack
• Including the option to export slides to PDF using DeckTape

How to get started

To create your own presentation, clone the repo on GitHub and go through its readme.

I hope this project will be of use for you in the future. I look forward to seeing others use this template at conferences like PyData . I welcome any feedback to improve the slide designs and others’ contributes to the code base.

If you found this article useful, give me a high five ?? so others can find it too, and share it with your friends. Follow me here on Medium (Da t Tran) or on Twitter (@d atitran) to stay up-to-date with my work. Thanks for reading!

freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More

If you read this far, thank the author to show them you care. Say Thanks

Learn to code for free. freeCodeCamp's open source curriculum has helped more than 40,000 people get jobs as developers. Get started

• Manage Email Subscriptions
• How to Post to DZone
• Article Submission Guidelines
• Manage My Drafts

Enterprise Security: Now is the time to ensure your systems are secure. Expand your org's tactics and put future attackers in their place.

Secrets Management: Learn key strategies for secrets management to enhance visibility. Identify and mitigate potential security risks.

2024 DZone Community Survey: Tell us what's in your tech stack. Help us build a better DZone. Enter for a chance to win swag!

• Norm of a One-Dimensional Tensor in Python Libraries
• Improving Sentiment Score Accuracy With FinBERT and Embracing SOLID Principles
• Apache Flink
• How To Use Amazon SageMaker for Machine Learning
• Benchmarking OpenAI Models for Automated Error Resolution
• A Hands-On Guide to OpenTelemetry: Better Tracing With Automatic Instrumentation
• Go: Unit and Integration Tests
• Utilizing Multiple Vectors and Advanced Search Data Model Design for City Data

Creating Presentations With Jupyter Notebook

When you build a presentation using jupyter notebook, you'll be able to run code live from your slides..

Join the DZone community and get the full member experience.

Jupyter Notebook can be turned into a slide presentation that is kind of like using Microsoft PowerPoint, except that you can run the slide's code live! It's really neat how well it works. The only con in my book is that there isn't a lot of theming that can be applied to your slides, so they do end up looking a bit plain.

In this article, we will look at two methods of creating a slideshow out of your Jupyter Notebook. The first method is by using Jupyter Notebook's built-in slideshow capabilities. The second is by using a plug-in called RISE .

Let's get started!

The first thing we need to do is to create a new Notebook. Once you have that done and running, let's create three cells so that we can have three slides. Your Notebook should now look like the following:

An empty notebook with 3 cells

Now let's turn on the "slideshow" tools. Go to the View menu and then click on the Cell Toolbar menu option. You will find a sub-menu in there that is called Slideshow . Choose that. Now your Notebook's cell should look like this:

An empty slideshow

There are now little comboboxes on the top right of each cell. These widgets give you the following options:

You can just create a series of Slides if you like, but you can make the slideshow a bit more interesting by adding Sub-Slides and Fragments. Sub-slides are just slides that are below the previous one while Fragments are basically fragments within the previous slide. As an aside, I have actually never used Fragments myself. Anyway you can also set a slide to Skip, which just allows you to skip a slide or Notes, which are just speaker notes.

Let's add some text to our first cell. We will add the text "# Hello Slideshow" to it and set the cell type to Markdown. Note the pound sign at the beginning of the text. This will cause the text to be a heading.

In cell two, we can add a simple function. Let's use the following code:

For the last cell, we will add the following text:

Make sure you set that to be a Markdown cell as well. This is what my cells ended up looking like when I was done:

Getting the slideshow ready

To make things simple, just set each of the cell's individual comboboxes to Slide .

Now we just need to turn it into an actual slideshow. To do that, you will need save your Notebook and shut down the Jupyter Notebook server. Next you will need to run the following command:

Running the slideshow

To navigate your slideshow, you can use your left and right arrow keys or you can use spacebar to go forward and shift_spacebar to go back. This creates a pretty nice and simple slideshow, but it doesn't allow you to run the cells. For that, we will need to use the RISE plugin!

Getting Started With RISE

Reveal.js - Jupyter/IPython Slideshow Extension (RISE) is a plugin that uses *reveal.js* to make the slideshow run live. What that means is that you will now be able to run your code in the slideshow without exiting the slideshow. The first item that we need to learn about is how to get RISE installed.

Installing rise with conda

If you happen to be an Anaconda user, then this is the method you would use to install RISE:

This is the easiest method of installing RISE. However most people still use regular CPython, so next we will learn how to use pip!

Installing rise with pip

You can use Python's pip installer tool to install RISE like this:

You can also do `python -m pip install RISE` if you want to. Once the package is installed, you have a second step of installing the JS and CSS in the proper places, which requires you to run the following command:

If you somehow get a version of RISE that is older than 5.3.0, then you would also need to enable the RISE extension in Jupyter. However, I recommend just using the latest version so you don't have to worry about that.

Using RISE for a SlideShow

Now that we have RISE installed and enabled, let's re-open the Jupyter Notebook we created earlier. Your Notebook should now look like this:

Adding RISE

You will notice that I circled a new button that was added by RISE to your Notebook. If you mouse over that button you will see that it has a tooltip that appears that says "Enter/Exit RISE Slideshow." Click it and you should see a slideshow that looks a lot like the previous one. The difference here is that you can actually edit and run all the cells while in the slideshow. Just double-click on the first slide and you should see it transform to the following:

Running with RISE

After you are done editing, press SHIFT+ENTER to run the cell. Here are the primary shortcuts you will need to run the slideshow effectively:

• SPACEBAR - Goes forward a slide in the slideshow
• SHIFT+SPACEBAR - Goes back a slide in the slideshow
• SHIFT+ENTER - Runs the cell on the current slide
• DOUBLE-CLICK - To edit a Markdown cell

You can view all the Keyboard shortcuts by going to the Help menu when not in Slideshow mode and clicking the Keyboard Shortcuts option. Most — if not all — of these shortcuts should work inside a RISE slideshow.

If you want to start the slideshow on a specific cell, just select that cell and then press the Enter Slideshow button.

RISE also works with Notebook widgets. Try creating a new cell with the following code:

Now start the slideshow on that cell and try running the cell (SHIFT+ENTER). You should see something like this:

Using a widget in RISE

You can use RISE to add neat widgets, graphs and other interactive elements to your slideshow that you can edit live to demonstrate concepts to your attendees. It's really quite fun and I have used RISE personally for presenting intermediate-level material in Python to engineers.

RISE also has several different themes that you can apply as well as minimal support for slide transitions. See the documentation for full information.

Wrapping Up

In this chapter we learned about two good methods for creating presentations out of our Jupyter Notebooks. You can use Jupyter directly via their nbconvert tooling to generate a slideshow from the cells in your Notebook. This is nice to have, but I personally like RISE better. It makes the presentations so much more interactive and fun. I highly recommend it. You will find that using Jupyter Notebook for your presentations will make the slides that much more engaging and it is so nice to be able to fix slides during the presentation too!

Related Reading

• Presenting code using  Jupyter Notebook
• The RISE  Github page
• Jupyter nbconvert  Usage
• How to build interactive presentations with  Jupyter Notebook and Reveal JS

Published at DZone with permission of Mike Driscoll , DZone MVB . See the original article here.

Opinions expressed by DZone contributors are their own.

Partner Resources

• About DZone
• Send feedback
• Community research
• Advertise with DZone

CONTRIBUTE ON DZONE

• Become a Contributor
• Core Program
• Visit the Writers' Zone
• Terms of Service
• Privacy Policy
• 3343 Perimeter Hill Drive
• Nashville, TN 37211
• [email protected]

Let's be friends:

Things Michael Thinks

Data science in learning, creating an interactive presentation with jupyter notebook and plotly.

Let’s say you have performed some analysis using Jupyter notebook and produced some great visualisations to back up your finding. How would you present this to your stakeholders and other people? One great way to ace this is to convert your jupyter notebook and plotly graphs to an interactive presentation that can impress people.

Introduction

I learned on creating slides using Jupyter Notebook from Tahsin Mayeesha’s medium post . However, I was curious to see if I can incorporate interactive graphs from Plotly in the slides. Therefore, I wrote this post to share what I’ve learned.

For this post, I will use the Titanic dataset from Kaggle . This dataset is a classic dataset used to learn machine learning models on classification problems.

In this case, my aim was to present my finding from an Exploratory Data Analysis on the Titanic dataset. I would include several visualisations and slides to show what you can do with Jupyter markdown and slides. Although I would use Plotly mostly for the slides, I have also included one plot with Seaborn and one plot from Pandas Profiling library to show the possibilities you can do.

For my presentation, I imported the following visualisation libraries.

• Plotly, including the Plotly Express and Plotly Graph Objects
• Pandas Profiling visualisation for missing values in the dataframe.

All the libraries above are not required to make the slides work, you can just simply use Plotly , Seaborn , or even simply Matplotlib . You can check the full notebook on my GitHub repo here .

Jupyter Notebook Slideshow View and Setting

Changing the view will allow you to set what type of slides you want for each cell. There are 5 Slide Types you can select:

• Slide . This is the main content of a slide. You can place markdown, visuals, or even code here.
• Sub-Slide . I will consider this as a new slide with transition animation. You have to use the down arrow navigation to access it from the main slide (Slide type).
• Fragment . This will be a part or component of the immediate previous cell with Slide Type. For example, one cell with the heading will be set as Slide and the visualisation will be set as Fragment. The fragment will be inside the main slide but with a fade-in transition.
• Skip . This cell will not be shown on the slides. Perfect for code and comment cells that you won’t show. Be aware that you can’t put skip for your visualisation code because the output will not be shown as well.
• Notes . This will create Speaker notes, but I haven’t tried this function. From the NbConvert reference , you need to have a local copy of the Reveal.JS file to allow you having a presenter view with the notes.

Skip type for Non-Visualisation Code Cell

Slide type for Title and Markdown Cell

For the first slide or the cover, I will only use one markdown cell with title, subtitle, and author.

Slide + Fragment types for Mixture of Markdown and Code Cells

Hiding the Codes on the Slide

Specific for Plotly

If you use plotly, then you need to pay attention in this section. Otherwise, your plotly graphs won’t show up in the slides.

Plotly will require its JavaScript file ( plotly.js ) to produce the graph. There are three options you can choose:

• A local copy of JavaScript file. This is the easiest and simplest way to ensure the Plotly graphs to work. You can download the latest JS file from this link and rename it into plotly.js. This file needs to be in the same folder or directory with the resulting HTML slides file.
• Refer to CDN online. This is a great option if you want a lightweight HTML file and have constant access to the Internet. This is perfect if you want to embed the slides on a website. To do this, create a new code cell at the beginning, include this code here: from IPython.display import Javascript Javascript ( """require.config({ paths: { plotly: 'https://cdn.plot.ly/plotly-latest.min' } });""" )

The get_plotlyjs function would return the whole minified Plotly JS script and by using the Javascript function from IPython we include this in the notebook. The resulting file would be 3MB larger because of the inclusion. However, you will only have one HTML file that you can just send or use anytime.

Converting the Notebook to Slides

To produce the slides from the jupyter notebook, run the following code on your command prompt or bash:

Here we are calling nbconvert function that can be used to convert the notebook into slides (HTML format with Reveal.js) or other formats as can be referred on the documentation .

The TagRemovePreprocessor will remove any code with to_remove tag as we specified. Again, this can be replaced with any other tag you specified before hand.

If you check your directory, the html version of your notebook will be there. You can open this on the web browser and use the directional pad on the screen or arrow keys on your keyboard to navigate. I was able to open the file and interact with Plotly graphs successfully using Chrome, Firefox, Opera, and Microsoft Edge. I heard this might not work so well with Safari but I can’t confirm this.

For me personally, I found that using --post serve , I could not terminate the server using Ctrl-C as described even after many tries. However, I also found that I can omit this in my command prompt and still get the HTML slides file.

Final Output of the Slides

Here are the following slides I produced from my jupyter notebook that you can find on GitHub

CSCI 134: Introduction to Computer Science

How to use jupyter notebooks ¶.

Jupyter notebooks allow us to have a rich web-based interface to interactive python.  Moreover, they allow for documenting and visualizing programming projects.  They are widely used as a presentation tool in the data science community.  The name “Jupyter” is a loose acronym for Julia , Python and R :  the programming languages that the application originally targeted.

This document gives you a brief overview of how to read, interpret and use Jupyter notebooks.  If you have any questions, please contact the CSCI 134 staff .

Getting Started ¶

You can run notebooks on your own computer in your Terminal window. If you are on a lab computer or followed our set up instructions for Macs or Windows, you everything should already be installed. If not, or you are unsure if you have install the software properly, simply run the following installation command in your terminal:

In, the Terminal run the following command to start Jupyter:

When you first launch Jupyter, you will see a landing page that looks like the following:

The window is divided into three panels:

The center panel enables you to create new notebooks for writing code interactively. Jupyter supports writing code in many different languages, but we’ll just stick to Python in 134.

The left panel shows the files in the directory where you ran jupyter lab , or the files on our server if you logged in there. You can navigate to and launch existing notebooks through this panel.

The right panel shows various properties of files you edit, but we won’t really do much with that. You can hide it by clicking the little gear icon in the top right corner of that panel.

The JupyterLab documentation covers the user interface in much more detail. The following tutorial should suffice for our needs.

Your First Notebook ¶

Create a new notebook by clicking the “Python 3” button under Notebook in the Launcher window, or by selecting “File -> New -> Notebook” from the menubar. If Jupyter asks you to select the kernel, choose “Python 3 (ipykernel)”. A new tab should open up with a blank input cell:

You can now type in snippets of Python code in the [ ] cell. For example, try typing 1+2 :

To run this code, select the cell (clicking on it will select it as seen by the blue highlight) and selected “Run -> Run Selected Cells” from the menubar. The keyboard shortcut to run cells is Shift+Enter (Mac) or Shift+Return (Windows). You should now see the output directly below with the label [1] .

A new cell for more input should have appeard below the output line. You can always insert more cells by clicking the “+” in the toolbar at the top of the notebook tab. Type in some more python code and run it:

Note that typing a command in a cell in a Jupyter notebook is similar to typing it in an interactive Python session. When we “run the cell,” a number appears in the brackets to indicate that:

the command has been executed, and

the number n indicates that it is the nth command executed in the current session.

In most cases, you can ignore this number. The output [n]  cell of the notebook gives the resulting output.

Jupyter notebooks allow you to add rich notes along with examples. For example, you can change the “Cell Type” from Code to Markdown in the toolbar at the top of the tab to add Markdown-styled text.

Saving Your Notebook ¶

When you are done, you can save the notebook by selecting “File -> Save Notebook” or “File -> Save Notebook As…” from the menubar. Note that if you are working on our sever, the notebook is stored there, not on your local computer. Selecting “File -> Download” from the menubar will let you download a copy of the file from our server to your own machine.

To quit, select “File -> Logout” inside Jupyter, or simply close the browser tab running. If you launched Jupyter from a Terminal window, you’ll want to either close that window or press “Ctrl + C”.

Lecture Notebooks ¶

We will be using Jupyter notebooks as a teaching aid in lectures. We’ll add links to those notebooks on the Calendar .

To view a notebook, simplly click on any Notebook link on the calendar, such as this one Notebook , which brings you to the notebook for Lecture 2. If all you wish to do is read the notes, you can simply browse through this page…

But you can also edit and run the notebook yourself:

First, be sure to have followed the setup instructions for Macs or Windows .

Then, click on the calendar for the day you are interested in. That will download a zip for with all of the materials for that lecture, including the notebook file. Save that file to an easily found location on your harddrive and unzip the contents.

Navigate to the directory containing the contents in the Terminal, and open the notebook by typing the following, where you should replace name-of-notebook with the actual name of the notebook you downloaded:

You can execute each cell in the notebook one-by-one by selecting the cell and running it (via “Run -> Run Selected Cells” or Shift+Enter/Return). If you would like to execute all of them at once, you can select “Run -> Run All Cells”.

Feel free to add notes or extra examples to this notebook (and to lecture notebooks in general).

Set Up Your Windows PC (Non-Linux Version)

Navigation Menu

Search code, repositories, users, issues, pull requests..., provide feedback.

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly.

To see all available qualifiers, see our documentation .

• Notifications You must be signed in to change notification settings

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement . We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Error thrown from py lang server from a jupyter notebook on insiders.vscode.dev #6307

ulugbekna commented Aug 27, 2024

rchiodo commented Aug 27, 2024 • edited Loading

Sorry, something went wrong.

rchiodo commented Aug 27, 2024

debonte commented Aug 28, 2024

No branches or pull requests