Write presentation in markdown and hosted on heroku


Write docs in Markdown

As more and more docs and email can be written in markdown format, It is time to try it in the slides/presentation.

Reveal.js

Seems reveal.js is very easy to use, I try to use it to write slides, and I hope it can be hosted on heroku, so I can use it no matter what devices I am using, and where I am.

Installation

install reveal.js


git clone git@github.com:MichaelBitard/revealjs_heroku.git

use express to host

//web.js

var express = require("express");

var app = express();
app.use(express.logger());
app.use("/", express.static(__dirname));

var port = process.env.PORT || 5000;
app.listen(port, function() {
  console.log("Listening on " + port);
});

add heroku Procfile


web: node web.js

add http basic auth to protect the content


var auth = require('http-auth');
var basic = auth.basic({
    realm: "Zyncro China Presentation.",
    file: __dirname + "/data/users.htpasswd" // gevorg:gpass, Sarah:testpass ...
});

app.use(auth.connect(basic));

generate the user/password


mkdir data; cd data
htpasswd -c users.htpasswd david

use haml template


npm install grunt-contrib-haml --save

Then add haml task and enable livereload into Gruntfile.js


haml: {                              // Task
  dist: {                            // Target
    files: {                         // Dictionary of files
      'index.html': 'index.haml',       // 'destination': 'source'
      'widgets.html': 'widgets.haml'
    }
  }
},


watch: {
        haml: {
        files: [ '*.haml' ],
        tasks: 'haml',
                options: {
                  livereload: true,
                }
        }
}

use markdown in haml template

To use markdown in haml, we need to use the following format:


%section{"data-markdown" =>""}
  %script{:type => "text/template"}
    :markdown
      ## Requirement
        1. support CRUD operation
          1. JSON Format
        1. HTTP REST Interface
        1. Reliable and Scalable

troubleshooting

If express start failed(call: node web.js), then select the express version: 3.1.x

comments powered by Disqus