4 ms·

Slidev – Presentation Slides for Developers

125 points by antfu 5y ago

privatenumber 5y ago
Slidev is amazing! It's an alternative to Google Slides/Keynote/Powerpoint, allowing you to code your slides as a website so you have more granular control. The slides are written in markdown so it's very intuitive and easily maintainable: ``` # Slidev Hello World --- # Page 2 Directly use code blocks for highlighting ```ts console.log('Hello, World!') ``` --- # Page 3 ... ``` It's also built on top of Vite and Windi CSS so it's blazing fast! Checkout their beautiful website: https://sli.dev https://sli.dev For the first time, I can't wait to do a slideshow presentation! ---- PS. the author Anthony Fu is an incredibly talented & prolific engineer + designer. He maintains multiple large open source projects and yet somehow managed to deliver this. More importantly, he's super kind and friendly, and strives to raise other engineers. He's definitely on to big things!
zhdc1 5y ago
How does it stack up against something like Reveal.js? I have a couple of presentations that I did with Reveal. If Slidev can make formatting and deployment slightly easier, I would definitely consider switching over.
- podiki 5y ago
  Same question here, there are several similar seeming slide systems and would be helpful to see a comparison or major differences in approach/output.
twobitshifter 5y ago
Looks nice, is it possible to add to the options in pandoc? https://pandoc.org/MANUAL.html#slide-shows https://pandoc.org/MANUAL.html#slide-shows
edp 5y ago
Missing from markdown/web based slides is a way to auto resize text content to fit on a page, like powerpoint does. I didn't find a way to manage this correctly with reveal, remark or marp and from what I'm seeing, slidevjs won't do it either.
- podiki 5y ago
  Good question, have run into the same problem of sizing/positioning issues. Usually can just manually tweak so it will be okay on typical sizes for presentations, but not optimal.
- dividedbyzero 5y ago
  That's why I stick with Deckset (paid) [1] even though it has its share of bugs and limitations. I like it because I can write some basic semi-ugly slides in a fraction of the time it takes me in Powerpoint, as it's really just markdown, having to fiddle with JavaScript at all would make that moot, let alone for absolute basics like fit content to slide. Also, the themes it ships with are ok-ish. [1] https://www.deckset.com/ https://www.deckset.com/
  - prepend 5y ago
    It’s too bad it doesn’t export to PowerPoint. I’d like to be share with other coworkers who only know ppt. Nice that it exports to read only but that limits how slides can be reused.
jtwaleson 5y ago
I've seen many of these attempts by developers turned Product Manager (myself included). Ultimately the ease of use of powerpoint / google sheets cant be beat. There's a very long tail of UX niceties in these products and you can collaborate with non-developers on presentations.
azalemeth 5y ago
I am both a programmer and someone who uses a fair amount of mathematics – I work in medical imaging, and it is not uncommon to have both psudeocode and "proper" equations in a talk. I _still_ think that Keynote together with a colour-formatting syntax highlighter just can't be beat. Beamer on latex is excellent and listings is powerful – but it takes too long. Keynote's latex engine is 99.9% good enough and being able to arrange things graphically is just a killer feature. This looks like a very fancy, shiny project – but also at some level a bit of a time-sink. I'm really bad at spending effort on formatting instead of content, because I enjoy it, and it's a nice form of procrastination!
- cosmie 5y ago
  I didn't even realize Keynote had a latex engine. The equation support in Powerpoint results in nice formatting, but Powerpoint doesn't directly support latex format without third-party addins so it gets a bit tedious to use for more than a one-off. I generally end up using the equation editor in Word (that does support latex[1]) as a workaround, and just copying the output into Powerpoint. Will have to give Keynote a try! [1] https://support.microsoft.com/en-us/office/write-an-equation-or-formula-1d01cabc-ceb1-458d-bc70-7f9737722702 https://support.microsoft.com/en-us/office/write-an-equation...
  - azalemeth 5y ago
    My experience of the equation editor in Word on MacOS is that it definitely does not support any meaningful degree of compatibility with TeX. Command-alt-E in Keynote works properly and seems to have most of amsmath imported by default: you can \begin{pmatrix} or \begin{cases} easily. One of my worst weekly experiences is receiving documents in Word, especially papers written by colleagues with maths in them. Writing Markov chains in the supplementary methods section for a recent paper genuinely drove me to distraction; each non-ascii character was a major break from the flow of the sentence and requires a move to the mouse. I really dislike Word in general, actually: on Linux (my workstation) LibreOffice is integrated well and polished; on MacOS it isn't as much as there's some value in having the 'real deal' product as administrators in my university use it a lot. I don't understand why Word's behaviour is interpreted differently from that of the rest of MacOS: e.g. in Word, clicking to select a chunk of text from the middle of the word automatically selects the whole word the cursor was in, unlike the rest of MacOS. This makes selecting parts of a word almost impossible, and it's not possible (AFAIK) to turn this behaviour off.
bleonard 5y ago
Here was my attempt several years ago that used reveal.js https://github.com/bleonard/jekyll-slides https://github.com/bleonard/jekyll-slides I found it useful to have notes as well that showed up when presenting on the other screen.
danielmeskin 5y ago
How is this better than something like MARP?
tracyhenry 5y ago
I feel helpless after clicking around trying to find a live demo that I can play with. I have no idea how this tool works by just reading the documentations. Having an example with code on the side can make it much much more clear what your tool does.
- timdorr 5y ago
  Did you see the demo on their home page? https://sli.dev/ https://sli.dev/
  - tracyhenry 5y ago
    ok this is definitely helpful. I wonder why this website or the demo are not linked in a noticeable place on Github README. The first thing I clicked in the readme is "Why Slidev?", which brings me to the documentation page that had almost nothing graphical.
    - antfu 5y ago
      Good points, will update the docs. Thanks!
BiteCode_dev 5y ago
If it's for dev, I'll use jupyter notebook: - one file - support markdown - export to pdf - you can run the code to check if it's right - you can run the code in multiple languages - you can run the code DURING the prez
- rmnclmnt 5y ago
  And the most unknown/underrated feature: you can switch to slideshow mode and export to Reveal.js presentation!
tomcooks 5y ago
I use suckless sent, it sucks
ekiauhce 5y ago
Obsidian md has a convenient plugin to render a markdown note as presentation. It's cool, because you can put some highlighted code or tex formulas on it.
openbrian 5y ago
Being Docker based, MarkDeck is my go to slide app. https://arnehilmann.github.io/markdeck/ https://arnehilmann.github.io/markdeck/

125 points by antfu 5y ago

Slidev is amazing! It's an alternative to Google Slides/Keynote/Powerpoint, allowing you to code your slides as a website so you have more granular control. The slides are written in markdown so it's very intuitive and easily maintainable: ``` # Slidev Hello World --- # Page 2 Directly use code blocks for highlighting ```ts console.log('Hello, World!') ``` --- # Page 3 ... ``` It's also built on top of Vite and Windi CSS so it's blazing fast! Checkout their beautiful website: https://sli.dev https://sli.dev For the first time, I can't wait to do a slideshow presentation! ---- PS. the author Anthony Fu is an incredibly talented & prolific engineer + designer. He maintains multiple large open source projects and yet somehow managed to deliver this. More importantly, he's super kind and friendly, and strives to raise other engineers. He's definitely on to big things!

zhdc1 5y ago

How does it stack up against something like Reveal.js? I have a couple of presentations that I did with Reveal. If Slidev can make formatting and deployment slightly easier, I would definitely consider switching over.

podiki 5y ago
Same question here, there are several similar seeming slide systems and would be helpful to see a comparison or major differences in approach/output.

twobitshifter 5y ago

Looks nice, is it possible to add to the options in pandoc? https://pandoc.org/MANUAL.html#slide-shows https://pandoc.org/MANUAL.html#slide-shows

edp 5y ago

Missing from markdown/web based slides is a way to auto resize text content to fit on a page, like powerpoint does. I didn't find a way to manage this correctly with reveal, remark or marp and from what I'm seeing, slidevjs won't do it either.

podiki 5y ago
Good question, have run into the same problem of sizing/positioning issues. Usually can just manually tweak so it will be okay on typical sizes for presentations, but not optimal.
dividedbyzero 5y ago
That's why I stick with Deckset (paid) [1] even though it has its share of bugs and limitations. I like it because I can write some basic semi-ugly slides in a fraction of the time it takes me in Powerpoint, as it's really just markdown, having to fiddle with JavaScript at all would make that moot, let alone for absolute basics like fit content to slide. Also, the themes it ships with are ok-ish. [1] https://www.deckset.com/ https://www.deckset.com/
- prepend 5y ago
  It’s too bad it doesn’t export to PowerPoint. I’d like to be share with other coworkers who only know ppt. Nice that it exports to read only but that limits how slides can be reused.

jtwaleson 5y ago

I've seen many of these attempts by developers turned Product Manager (myself included). Ultimately the ease of use of powerpoint / google sheets cant be beat. There's a very long tail of UX niceties in these products and you can collaborate with non-developers on presentations.

azalemeth 5y ago

I am both a programmer and someone who uses a fair amount of mathematics – I work in medical imaging, and it is not uncommon to have both psudeocode and "proper" equations in a talk. I _still_ think that Keynote together with a colour-formatting syntax highlighter just can't be beat. Beamer on latex is excellent and listings is powerful – but it takes too long. Keynote's latex engine is 99.9% good enough and being able to arrange things graphically is just a killer feature. This looks like a very fancy, shiny project – but also at some level a bit of a time-sink. I'm really bad at spending effort on formatting instead of content, because I enjoy it, and it's a nice form of procrastination!

cosmie 5y ago
I didn't even realize Keynote had a latex engine. The equation support in Powerpoint results in nice formatting, but Powerpoint doesn't directly support latex format without third-party addins so it gets a bit tedious to use for more than a one-off. I generally end up using the equation editor in Word (that does support latex[1]) as a workaround, and just copying the output into Powerpoint. Will have to give Keynote a try! [1] https://support.microsoft.com/en-us/office/write-an-equation-or-formula-1d01cabc-ceb1-458d-bc70-7f9737722702 https://support.microsoft.com/en-us/office/write-an-equation...
- azalemeth 5y ago
  My experience of the equation editor in Word on MacOS is that it definitely does not support any meaningful degree of compatibility with TeX. Command-alt-E in Keynote works properly and seems to have most of amsmath imported by default: you can \begin{pmatrix} or \begin{cases} easily. One of my worst weekly experiences is receiving documents in Word, especially papers written by colleagues with maths in them. Writing Markov chains in the supplementary methods section for a recent paper genuinely drove me to distraction; each non-ascii character was a major break from the flow of the sentence and requires a move to the mouse. I really dislike Word in general, actually: on Linux (my workstation) LibreOffice is integrated well and polished; on MacOS it isn't as much as there's some value in having the 'real deal' product as administrators in my university use it a lot. I don't understand why Word's behaviour is interpreted differently from that of the rest of MacOS: e.g. in Word, clicking to select a chunk of text from the middle of the word automatically selects the whole word the cursor was in, unlike the rest of MacOS. This makes selecting parts of a word almost impossible, and it's not possible (AFAIK) to turn this behaviour off.

bleonard 5y ago

Here was my attempt several years ago that used reveal.js https://github.com/bleonard/jekyll-slides https://github.com/bleonard/jekyll-slides I found it useful to have notes as well that showed up when presenting on the other screen.

danielmeskin 5y ago

How is this better than something like MARP?

tracyhenry 5y ago

I feel helpless after clicking around trying to find a live demo that I can play with. I have no idea how this tool works by just reading the documentations. Having an example with code on the side can make it much much more clear what your tool does.

timdorr 5y ago
Did you see the demo on their home page? https://sli.dev/ https://sli.dev/
- tracyhenry 5y ago
  ok this is definitely helpful. I wonder why this website or the demo are not linked in a noticeable place on Github README. The first thing I clicked in the readme is "Why Slidev?", which brings me to the documentation page that had almost nothing graphical.
  - antfu 5y ago
    Good points, will update the docs. Thanks!

BiteCode_dev 5y ago

If it's for dev, I'll use jupyter notebook: - one file - support markdown - export to pdf - you can run the code to check if it's right - you can run the code in multiple languages - you can run the code DURING the prez

rmnclmnt 5y ago
And the most unknown/underrated feature: you can switch to slideshow mode and export to Reveal.js presentation!

tomcooks 5y ago

I use suckless sent, it sucks

ekiauhce 5y ago

Obsidian md has a convenient plugin to render a markdown note as presentation. It's cool, because you can put some highlighted code or tex formulas on it.

openbrian 5y ago

Being Docker based, MarkDeck is my go to slide app. https://arnehilmann.github.io/markdeck/ https://arnehilmann.github.io/markdeck/