
Cleaver – 30-second slideshows for hackers - iheredia
http://jdan.github.io/cleaver/
======
prezjordan
Hi HN! Cool to see this posted here.

I made this in college because I would always make slides last minute before
class presentations or talks at my school's CS club, and fiddling with google
slides/powerpoint seemed like overkill. I hope you find it useful as I have
over the years.

I've attempted to rewrite it 5 or 6 times based on whatever cool technology I
was distracted with, but never merged anything upstream (Spectacle
[https://github.com/FormidableLabs/spectacle](https://github.com/FormidableLabs/spectacle)
is already a wonderful React solution).

A couple other folks maintain cleaver now (they're great), but lemme know if
you have any questions!

~~~
H4CK3RM4N
I have to ask what this offers over a LaTeX/Beamer setup. I'm fairly happy
using LaTeX for anything I'm sharing, but I'm curious about alternatives.

~~~
kurige
Sure, when throwing some slides together last minute the first thing that
comes to mind is "LaTeX".

~~~
sporkenfang
Maybe you might want to spend some time with LaTeX then. Honestly, it's one of
the most useful things I learned in school.

~~~
asafira
I'm with ralmeida here; do you actually make super fast slides with LaTeX?
That has definitely not been my experience.

~~~
sporkenfang
Yeah after 1-2 presentations I built a template and just drop stuff into each
slide I have defined. Then if I need more slides I copy the framework bit for
a single slide. Super easy.

------
tedmiston
Cool project.

Dropbox Paper recently added a similar feature called Presentation mode. It
treats --- as slide breaks and intelligently does font sizing of headers,
recognizes headers as "soft slides", etc. It takes very little to no effort to
go from doc to minimal presentation.

[https://www.dropbox.com/help/paper/presentation-
mode](https://www.dropbox.com/help/paper/presentation-mode)

~~~
callumlocke
That link is broken

~~~
tedmiston
Try this -
[https://www.dropbox.com/help/9281](https://www.dropbox.com/help/9281)

------
djsumdog
I use Reveal.js for my presentations. The standard docs do have you putting
all the slides in one big file, but I re-used slides between presentations so
I created a little build systems with sets of slides, as well as individual
slides, for different talk types:

[https://github.com/bigsense/presentations](https://github.com/bigsense/presentations)

~~~
tedmiston
Does it support any kind of Markdown import / include? For instance, the OS X
app Marked lets you do this.

main.md:

    
    
        blah
    
        <<[another_file.md]
    
        blah

~~~
djsumdog
I believe it does. The full docs are pretty extensive:

    
    
        https://github.com/hakimel/reveal.js
    

IIRC, at the time you had to serve the presentation from a web server for the
includes to work correctly (not sure if that's still the case). That combined
with me needing to reuse slides and create sets led me down the path I did,
but there are probably easier ways to do that now.

------
nxc18
This looks great. I love the simplicity on mobile and it has some nice touches
(e.g. top progress bar).

I'm working on a project that needs something similar to this - embedded html
presentations - but I'm faced with a problem I haven't found an easy solution
to yet.

Markdown is great if there is just text or maybe only an image and text, but
it falls down pretty hard with oddly shaped images or multiple images.

I'm considering making a js script to reformat things to look reasonable (e.g.
Two column text + image with a tall image). Is there anything like this that
exists currently?

------
cbhl
If you're interested in this, you may also like reveal.js, which backs
slides.com:

[http://lab.hakim.se/reveal-js/](http://lab.hakim.se/reveal-js/)

(previous discussion:
[https://news.ycombinator.com/item?id=6450223](https://news.ycombinator.com/item?id=6450223))

~~~
prezjordan
One of cleaver's maintainers wrote a "theme" which will render your cleaver
document (just markdown with some dashes in it) into reveal.js!

[https://github.com/sudodoki/reveal-cleaver-
theme](https://github.com/sudodoki/reveal-cleaver-theme)

I am unsure what the authoring experience for reveal.js is like in 2017, so
perhaps it can already do this :)

EDIT: Looks like they do support markdown.
[https://github.com/hakimel/reveal.js#markdown](https://github.com/hakimel/reveal.js#markdown)

------
ams6110
These kinds of tools have been around forever. There are probably literally
hundreds of ways do do slides from plain text. An older one is MagicPoint[1].

Nicely done though.

[1]
[https://en.wikipedia.org/wiki/MagicPoint](https://en.wikipedia.org/wiki/MagicPoint)

~~~
dstroot
Except this one works great on mobile. Most do not work very well on my
iPhone.

------
yogsototh
Shameless plug. I made a very similar tool a few time ago:

[https://github.com/yogsototh/mkdocs](https://github.com/yogsototh/mkdocs)

Mostly a very minimal script which use pandoc. From markdown generate
presentations (html with reveal.js/pdf with beamer) and documents (html/pdf).

~~~
zoom6628
I have used mkdocs! Very cool. I actually used it to produce a newsletter. SO
much easier to write the whole newsletter in md and push it to "site" which we
then published via email.

Thanks for writing it. Slick, simple, and delivers.

------
ArlenBales
Based on the title, I genuinely thought this was a site that hosted 30 second
slideshows for hackers. Something like "Learn X in Y time".

------
zck
I have a similar project, but for presenting org files inside of Emacs:
[https://bitbucket.org/zck/zpresent.el](https://bitbucket.org/zck/zpresent.el)
.

The benefit is that it's org files, so you have all your standard org
features, like easily adding new items and reordering things. It also, unlike
other org presentation modes, presents from inside Emacs.

------
jsnathan
Another simple tool of this kind to try out is Marp [1]. It has a live
preview, and slides are exported to PDF.

[1]: [https://yhatt.github.io/marp/](https://yhatt.github.io/marp/)

------
poptartman
Forgive me if it's obvious, but I'm new to programming and I'm trying to
understand how this works.

I've been looking through the github repo for a while now and I can't find the
code that is responsible for parsing the markdown syntax into the html tags
which are rendered on the page. Can someone point me to where that logic is
occuring?

~~~
grzm
Cleaver uses the marked library for markdown processing. The conversion
happens in renderSlide:

[https://github.com/jdan/cleaver/blob/master/lib/index.js#L27...](https://github.com/jdan/cleaver/blob/master/lib/index.js#L274-L276)

    
    
      /**
       * Renders a slide.
       *
       * @param {string} content Markdown content to be rendered as a slide
       * @return {string} The formatted slide
       */
      Cleaver.prototype.renderSlide = function (content) {
        return marked(content);
      };

------
blipmusic
Md slides day? Nice to see another option. I use Keynote/Powerpoint only if I
absolutely have to nowadays (collaboration). The simplicity of plain text ->
slides really speaks to me.

Here's another: [https://remarkjs.com/](https://remarkjs.com/)

There are even commercial apps, such as Deckset (macOS).

------
thesephist
I wrote something like this when I was in high school because I got tired of
powerpoint being hard to work with across platforms (Linux...). I ended up
using it for a couple class presentations, which I enjoyed because it forces
you to focus on content vs. unnecessary style and it's just a URL to link to
instead of a maybe-compatible .pptx.

HTML based, styled with CSS. Not quite markdown, but a parser would be quick
to make, I guess?
[https://github.com/thesephist/tesseract](https://github.com/thesephist/tesseract)

------
dogas
Since it appears to be markdown slides day on HN, I am getting close to
releasing a beta of Ultradeck ([https://ultradeck.co](https://ultradeck.co)).
Currently the marketing site mentions that Ultradeck is a desktop app, but I
have since pivoted and it will be a webapp. I am targeting a beta launch next
month!

------
zoom6628
I really like this. Have messed with the other forms of this approach over the
years but this looks like the simplest. My need is to create a tool that makes
easier for people to quickly throw together presentations from some
boilerplate and some code, screenshots, links etc. This looks like 80% of what
i need. For anything more sophisticated i would use mkdocs which i already
use. BTW i prefer to use typora for my md editing. Its (so far) the nicest
tool with which to work in md directly on windows. I use MOU on osx, and
downloading macdown today.

------
pathsjs
If you want a little more customizability, make sure to try
[https://www.madoko.net/](https://www.madoko.net/)

------
jtraffic
This is rad! I got so excited about reveal.js and webslides recently
([http://lab.hakim.se/reveal-js/#/](http://lab.hakim.se/reveal-js/#/) and
[https://github.com/webslides/WebSlides](https://github.com/webslides/WebSlides))
but this is superior in my view because of Markdown.

~~~
prezjordan
For what it's worth reveal.js supports markdown
([https://github.com/hakimel/reveal.js#markdown](https://github.com/hakimel/reveal.js#markdown))
so be sure to give it another look

~~~
accordionclown
moreover, it's had a web-based editor for years now...

> [https://slides.com](https://slides.com)

i think it started out being free for everybody, but now a free account is
available only for public slide-decks. (when it was free for everyone, i think
all decks were public, so it's not as if they ripped back functionality.)

------
obowersa
Another option in this space:

[https://github.com/regebro/hovercraft](https://github.com/regebro/hovercraft)

Always liked hovercraft as it makes impress.js much more usable. Will have to
properly kick the tires on Cleaver

~~~
MaxLeiter
Hovercraft doesn't seem to work on mobile.

------
diminoten
It's funny, another thing like this just showed up on /r/programming:
[https://github.com/gitpitch/gitpitch](https://github.com/gitpitch/gitpitch)

------
sleepychu
Neat, might give this a try next time I need to do a presentation.

Presently I use tex for this.

------
sametmax
Jupyter, does this, but better IMO. Not only you can create slide shows with
markdown, but the code is executable and include code completion when your
write it.

------
magic_beans
This looks awesome! Clean and easy. I like it!!

------
juanpabloaj
[http://platon.io/](http://platon.io/)

------
anotheryou
put some keywords in the title, I'll never find that bookmark again...

------
kiflay
for some reason it is not working for me. I run "cleaver
Desktop/{Name}/Presentation/testCleaver.md" but i can't see the basic.html
output

------
eptcyka
What has this got to do with hackers?

~~~
prezjordan
(a) It's markdown (b) I was 19 years old when I came up with that subtitle

------
blkhawk
I would try it but I am anti-node - sad

~~~
MildlySerious
What's your preferred alternative for tooling around JS and frontend
development?

~~~
blkhawk
well this example has very little front end and shouldn't need much of a back
end to sync data between systems that want to access it. If i were to build
something like this i would go with a very limited stack - say only jquery and
some js libraries in front end. The back end would be a couple of dozen lines
of code that does nothing but use a sqlite instance to store the slideshow
data. the front end would be local first and store its data in local storage.

