Generate HTML presentations, serve presentation files and control presentation with mobile device.
- create your presentation by editing Markdown and/or HTML snippets
- Syntax highlighting (by now only for JavaScript)
- remote control your presentation with your smartphone
- share a presentation across many browser instances (on distributed PCs)
This tool will probably only be used by nerds and the presentations will be for nerds ==> nerdshow!
The remote control software only works when pages are served by node.js. In this demo you can see only the mobile application. It is not connected with a presentation.
- Copy examples/empty to local folder
- Edit presentation.json
- add Markdown and/or html files and add them to presentation.json (slides array)
- Markdown extension: insert raw html by placing '.' in the first column, e.g.
.</div><div class="slide">
- Since v0.4.0:
<div class="slide">
are generated automatically by runtime (from<h1>
until next<h1>
) - Run generator
nerdshow-generate presentation.json
- Run presentation
nerdshow . --debug
- Open an html5 browser http://localhost:8008/
- Open remote control http://localhost:8008/nerdshow/rc/
Usage: nerdshow-generate <path/to/presentation.json> [options]
Options:
--nerdshow-folder base url for nerdshow runtime [default: "/nerdshow"]
--socketio-enabled disable socket-io for static html [default: true]
--hijs-enabled highlight code as javascript [default: true]
--zoom-enabled enable zoom.js (Ctrl+Click) [default: false]
--help, -h show help and exit
To disable an option, enter --no-<option>
, e.g. --no-socketio-enabled
.
If you want to host a presentation on a web-server, you can save space when you reference the nerdshow runtime-files:
- Either hard-wired in you presentation.json file:
"nerdshow-folder": "http://hgoebl.github.io/nerdshow/rt/0.4.0"
- or as a command-line option:
--nerdshow-folder http://hgoebl.github.io/nerdshow/rt/0.4.0
Be aware that github.io will not serve files over https
so if your presentation
is served via https, this won't work.
Usage: nerdshow path/to/presentation [options]
Options:
--port TCP port of web server [default: "8008"]
--encoding, -e character-set of stdin input [default: "utf8"]
--debug output for easier debugging [default: false]
--help, -h show help and exit
If you run 'nerdshow' w/out a path to a presentation folder, it will serve the examples folder: http://localhost:8008/
You can install nerdshow
locally or globally. This depends on how much your presentations are spread across your
file system. If you put them in one location, I would install it locally, if not, then globally (add option -g
):
npm install nerdshow [-g]
- Provide a boilerplate/template for new presentation (nerdshow-create)
- Provide CSS for print (showing all slides and div.class='handout'
- Add support for SyntaxHighlighter (from Alex Gorbatschev)
- Migrate generation code to assemble or provide an assemble plugin
- Provide grunt plugin (and gulp.js)
- When zooming (Ctrl+Click Source-Code) all images disappear (background + img)
- HowTo documentation + enhance example
- Implement/Test incremental page updates (ul/li elements coming item by item)
- Isolate different presentations delivered by the same server
- Generate a QR-Code for the remote control URL
- Output error message when used with IE <= 9
- Write some test code
- Generate impress.js Slides (Positioning slides along paths/patterns)
MIT (see LICENSE file)
- S5 Presentation
diascope
Original Source comes from minad/diascope - JavaScript Syntax Highlighter
hijs
from cloudhead - See package.json (marked, express, socket-io, optimist, mote, cheerio)
- jQuery and jQuery Mobile
Here you can find information about similar tools, the S5 format and some fancy new alternative implementations for HTML-based slide shows:
- http://en.wikipedia.org/wiki/Web_Based_Slideshow
- http://icant.co.uk/domslides/
- http://www.mulberrytech.com/walkthewalk.html
- http://en.wikipedia.org/wiki/S5_%28file_format%29
- http://www.w3.org/Talks/Tools/Slidy2/
- http://www.netzgesta.de/S5/
- http://meyerweb.com/eric/tools/s5/
- http://fittextjs.com/
- http://eikes.github.com/jquery.fullscreen.js/
- http://leeoniya.github.com/reMarked.js/
- https://github.com/hakimel/zoom.js