Teaching with open source presentation service Reveal.js

No readers like this yet.
Teaching open source text


Opensource.com has a community moderator program, and I am proud to be a part of it. Recently we all met in person with the Opensource.com team in downtown Raleigh, NC at Red Hat Tower. One of our discussions centered around open source software for education, and Ruth Suehle, who leads Fedora's marketing team as well as writes for and advises Opensource.com, pointed out the wonders of Reveal.js, a new tool for preparing slide presentations.

"It's what the cool kids are using," she said. And, boy was she right!

A quick visit to the example presentations page is enough to persuade any skeptic.

Reveal.js screenshot

The key features that jump out are:

  • Slides are created by writing simple HTML
  • Presentations are...
    • served as HTML+ Javascript pages
    • can be seen in any device: phones, tablets, desktops
  • Content can be put under version control (for example Git/Github)
    • Have you ever viewed a presentation from a previous year and wondered whether is the correct version that you want to use? Have you ever wondered what the latest changes were?
  • Git hosting enables collaboration across multiple authors
    • Just as with any collaborative project, multiple authors can add content, make comments, and fix errors
    • And if disagreeing, they can always fork presentations

Here are some of the presentations that we have created since then—from our Open Source Software Practices course at Rensselaer Polytechnic and the State University of New York at Albany:

For those who are not keen of writing HTML code, there is an interactive editor: Slid.es where you can create your slides using a simplified interface. It also hosts the presentations, so you don't have to worry about finding a web server.

For those who enjoy writing HTML, the easy way to start is to:

  • Look at the many examples
    • Copy or fork your favorite
    • Edit and make it your own

The more long term way to do it is to:

Then, finally: share it back!

You can add your presentations as examples for others, by simply editing the example presentations page.

Note that using Git (or GitHub) is not required, you could enjoy the happiness of Reveal.js by using it simply as a web framework. It is just that adding revision control, hosting, and sharing with GitHub adds a new dimension of ease of use to this wonderful tool.

Note also that it is not required to host your slides in a web server. You can always show the slides from your laptop by pointing your web browser to the HTML files in your local disk. This is quite convenient when running late to your class, or when making last minute changes to your presentations (not that we ever do that...ha).

User profile image.
Luis Ibáñez works as Senior Software Engineer at Google Inc in Chicago.


Excellent article, Luis. Reveal.js can be used as an introductory tool for teaching the basics of HTML to middle or high school students.


Great idea !

Reveal.js certainly produces a very appealing rendering (great CSS settings), and since the slides are created by editing HTML, it can be a nice and easy way to introduce basics of HTML to new students.

I got this website off my dad, an have to say, well done lads !!

I'll be using this as a presentation tool for my final project this semester :-D love the animations and nice cool simplified look ! Already shared this to al my IT friends here.


This is great to hear.

We will love see your presentations and learn from what you do with Reveal.js.

Creative Commons LicenseThis work is licensed under a Creative Commons Attribution-Share Alike 3.0 Unported License.