Article

Goodbye PowerPoint. Hello reveal.js

March 22, 2013
Containers
Linqing Lu
Guest Author

Let's face it, sometimes slides are painful

There are some common issues when I gave presentations:

  • Will my slides file be recognized by the shared computer at the venue?
  • How to share slides with all audiences using different OS?
  • Most important one, how to make my slides smooth and attractive?

For the first two questions, PDF might be an acceptable answer. I can upload it to slideshare.net and give out a link to audiences. But everyone knows that's not good enough.

Finally I found an awesome way to host my slides:

  • I can edit my slides anywhere with a text editor.
  • I can show my slides anywhere too. The only thing I need is the URL.
  • People can reply to my slides on any platform, even tablets or phones. No special hardware/software requirement.
  • My slides are presented in a really cool style!
  • It's free!

Take a look at this one - http://aws2012-claytondev.rhcloud.com/
Isn't it awesome?

Here is some background information about OpenShift+reveal.js before we start:

OpenShift PaaS

In this case, we store the slides on PaaS, show them on PaaS, and share them on PaaS.

It's pretty straightforward to get started.

The first presentation example on OpenShift only took me 2 minutes from scratch.
Check this out: http://slides-llq.rhcloud.com/

reveal.js

An open source framework for easily creating beautiful presentations using HTML.

reveal.js comes with a broad range of features including nested slides, markdown contents, PDF export, speaker notesand a JavaScript API. It's best viewed in a browser with support for CSS 3D transforms but fallbacks are available to make sure your presentation can still be viewed elsewhere.

More information about reveal.js

Getting it working

First, make sure you have a free OpenShift account and RHC tool installed.

With the help of the RHC tool, the whole project will be as easy as one single command:

$ rhc app create slides php-5.3 --from-code=git://github.com/openshift-quickstart/reveal.js-openshift-quickstart.git

Done! Now tt's ready to show on the cloud.

Check it out from anywhere you want. Tips inside the slides!

The arrow keys will navigate between slides.
On an iPad, you can even swipe to slide!

Edit or Add more slides

After the rhc app create slides ... command above, we'll get a folder named slides locally. Of course you can pick any other name.

There are some files in the folder:

.
|-- deplist.txt
|-- libs
|-- misc
|-- php
|   |-- css
|   |-- grunt.js
|   |-- health_check.php
|   |-- index.html
|   |-- index.php
|   |-- js
|   |-- lib
|   |-- LICENSE
|   |-- openshift.html
|   |-- package.json
|   |-- plugin
|   |-- README.md
|   `-- revealjs.html
`-- README

All slides are saved in php/index.html by default. So you can edit it via any text editor.
You can maintain different slides in different files like openshift.html or paas.html in the same folder. So you can switch between them via slides-llq.rhcloud.com/openshift.html or slides-llq.rhcloud.com/paas.html.

And here are some instructions for improving your slides.

After you're done editing, we need to push the updates to OpenShift so everybody can see it:

git add .
git commit -m "update my slides"
git push

Okay~ Let's refresh the browser.

New slides are ready in the cloud for your next awesome presentation!

Last updated: September 19, 2023

Comments