Hah! Coming from LaTeX/Beamer presentations in grad school, I *have* debugged presentations 🤦♂️. Thankfully Markdown is harder to mess up than LaTeX...
The old Opera browser, and I mean the old one, the one that didn't use chromium, made something similar 20-ish years ago, if I remember well it used html as markdown still wasn't a thing
I think the biggest advantage would be that you could write yourself one consistent style and functions for said style and then everything you do could be made simple to write and would always look consistent, no need to manually manage the style of each slide. The work for one slide is useless, but if you build hundreds of slides a year, it would definitely be a speed up.
@@Spartan322 What would you want to do that you couldn't achieve with creating custom powerpoint slide masters? I think automating something like translation of presentations could be easier with Marp, but that is pretty much the only real advantage I see. (Other than being markdown, which some people including myself seem to enjoy working with.)
Tbh, I think this is good for making presentations with syntax highlighted code, but I think Google Sheets or LibreOffice Impress are more powerful and accessible for most purposes. The fact that I can’t export to an editable PPTX is a dealbreaker for me.
So, simpler than TeX and in a format familiar to devs. Pretty cool! In the future, there will be a code-free version with built in diagrams and figures, maybe a slideshow mode for presentations, a little highlighter you can use while presenting, and...
yea this reminds me of using some TeX derivative to make presentations, tho instead of dealing with TeX annoyances you have html/css annoyances but a bit less customization
Thanks so much Andy =]! The aim for my channel is "clear, concise, overly edited educational programming content". So, if you're enjoying my style of video, be sure to stick around or check out some of my other videos!
@@dougmercer do you by chance watch Lazy Artist and edit with davinci resolve? :D recognized some of his tricks/patterns in you Work/editing style. Looks great
Interesting. I think I’ll stick with Keynote for now. But I can see this being interesting for generating slides programmatically for, e.g., release notes for your product. Instead of a simple list of changes you could have a slide per change with the name of the issue resolved as a title and the description of the issue in form of bullet points. Even better: if you have a use case where you need to periodically update an existing presentation with new values. Instead of doing that manually, just let your build process generate those slides with updated values for you. You could make slides highlighting the code quality of your code, showing metrics such as average lines of code per function or complexity metrics and how they evolved over time.
You can always use tables to have grids of any size. All you have to do is to hide borders via css without defining your own grid, and it works fine for small content!
You can also use `display: grid` to make grids of any size. Just set your `grid-template-columns` value to the size of each column. Then you don't need to add extra CSS to remove the borders, among other advantages. For example, you can use fractional units to easily make a certain number of columns - `1fr 1fr` for two equal columns, `2fr 1fr` for one large and one small column, `1fr 1fr 1fr` for three equal columns, etc. The "repeat" syntax used in the example is designed to automatically add equal sized columns for you (so you don't need to specify an extra "1fr" manually to add another column). If you want more rows as well, there's a very similar `grid-template-rows` that works in much the same way!
Nice video, for years we have been used to create slides using only the mouse, however Markdown is also a great format for creating and editing, instead of using a specific program for opening pptx files for example, you can just use whatever text editor you want! Worth noting that there is an alternative to Marp, which is slidev and it has a ton of great features
Yeah-- there seem to be a bunch of markdown -> slide renderers, but Marp was the first I landed on and learned. Maybe in the future I'll do a comparison video... In any case, I'll have to check out slidev!
As a dev, i do so much of my work in markdown, including taking notes (extending as far as my college notes), so this feels like it's catered exactly to my needs, since I don't do really complicated presentations anyway.
Small markdown tip: if you're defining code blocks often, then file extensions work just as well (so ```py instead of ```python or ```js versus ```javascript). Saves you a few seconds over the course of a year!
Thanks for this! I was just fighting my brain to move away from PP to Quarto, seeing all the nice ways I can integrate live graphs and maps. This helped get the basic syntax down!
The great thing about this is that you can create basic presentations with simple scripts. So let’s say you have a python notebook, you are now able to convert this into a presentation. You have a website and want to show it in a ppt presentation (why not do a live demo…? Doesn’t matter) you can script it quite easily.. so now this is an amazing thing.
I can see how this would help. A nice tool to have in my toolbox. But, I'd still prefer ppt, the ease of creating custom designs, animation and transition (like morph). Adding add-in helps a lot, makes it much faster in editing or creating.
@@dougmercer I don't see how it could possibly save you time to find workaround to do something which is so simple to do in Powerpoint. Honestly, it seems like people are solving problems which don't exist.
@@javierflores09 Maybe, only if Github allows you to slide through it right from the repository, for very minimal presentations that give you a clearer idea of what the project is about
Interesting. However seems like it would only really be of more benefit than PowerPoint in cases where you want to programmatically generate a presentation. Regardless, great video! Love the editing.
Idk. Seems more intuitive to make your slides in ppt instead of markup. Maybe marp is great for automating and trying to keep your source code and docs in sync with your presentations.
That's fair. If you're putting together quad charts or other complex format slides then PowerPoint still makes sense. For me, where most of my slides are simple bullets, images, syntax highlighted code, and math, Marp is way faster for me. For code, I can simply copy/paste the code's text and have editable highlighted code. I'm not sure how to get nice, highlighted code in PowerPoint besides screenshots from an IDE (non-editable) or some more complex workflow with Pygments.
@@dougmercer this works in word, not sure of ppt... to get highlighted code, just copy from a code editor, and keep the source formatting. PS: don't forget to switch to the light mode...
To be honest as someone with a good understanding of html, I know the possibilities of it and for me could be faster to create cool presentations with markup and html than ppt. But that's where your preferences help you to choose one of the other
I've definitely been trying to tinker with getting Pandoc to render my lectures, but keep running into difficulties with theming and code scaling. This looks pretty solid, and being able to drop CSS in there is awesome. Great video Now to get wild see if it supports embedding, and if my LMS can handle putting the HTML outputs up so my students can tweak Python tutor code mid-slidedeck.
I want to thank you for this video, it started me on using Marp and while it's quite simplistic out-of-the-box, it's fully customizable with some css tinkering and in conjunction with vector graphics software, such as Inkscape. I think I'm about ready to forget Powerpoint, except when it's required at work.
thought this was a really big channel - turns out you've only got 1k rn keep it going, the editing is super high quality and the content is amazing too
Love the idea behind marp and what it could accomplish so far plus your vid is absolutely on point But the truth is, I’d still need to sell my soul to big corps (ppt, google slides) or libre suite on the other spectrum because the apps are much simpler and faster with batteries included
I find it funny when people talk about "coding presentations". Markdown isn't a programming language - it's simply a markup language for formatting text. I think it's really useful, especially when you're creating presentations which involve a lot of code snippets, quotes or stuff like that. When you're trying to build something with a huge amount of images, transitions and effects, this tool isn't for you. But then you're mostly directing a movie, not creating a presentation. Presentations should be kept simple without effects or transitions, a handful of images in total and only a few lines of text for each slide.
I agree. I think Marp hits a nice middle ground of making it simple to make syntax highlighted or latex formatted presentations, but think it's the wrong tool if you want something truly custom with fancy transitions, etc. (then maybe reveal.js is a nice option)
Wasn't impressed at first (esp. the picture + text solution), but you had me at "supports custom css" lol! Definitely will be looking into this. -I wonder, while it doesn't support slide transitions like powerpoint, would it be able to render the css animation property?- Edit: Just googled a bit, it actually does seem to support custom transitions with several css properties even, very cool
(Was in process of replying, but it looks like you already stumbled across some of the same stuff I did.) I haven't tried it, but it looks like Marp experimentally supports transitions! marp.app/blog/how-to-make-custom-transition . Let me know if it works! When doing research for this video, I also stumbled across this demo that combined Marp and "reveal.js", codesandbox.io/s/nw80vrxvpp . That said, that demo uses the lower level "marpit" which more explicitly exposes HTML/CSS rather than the plain old Marp markdown syntax.
@@dougmercer Yea, just came across marpit as well. As someone who has done quite a bit of front end web-dev, I can see some wild possibilities for slide designs and transitions that would never be possible in PowerPoint. Though I do wonder how easy (or difficult) it would be to collaborate on this. Doubt most non-coders would be comfortable using this instead of Google Slides. Maybe a mixed workflow, where the backgrounds/general designs are done in marp and then exported as pptx could work though.
I haven't messed with working in pure marpit-- I do think it could be harder to onboard collaborators if you get too exotic. I have a bit of a blind spot on how much complexity (if any) you can boil into your own custom theme. You might be able to bake the fanciness into a theme (total speculation-- sorry if I'm wrong!)? In another comment thread, I mentioned that I had a workflow where I: * Set up a Gitlab repository for my presentation * Set up a Gitlab CI pipeline that used the Marp CLI docker image to render the slides and deploy them to Gitlab pages You might be able to set up something like that so that your collaborators wouldn't need to install Marp CLI, and could just focus on modifying the content after you establish the style/themes/etc.
It remembers me a little of reveal.js. Back in my middle school I've been asked to make a simple quiz with some math and code in it, and I chose this library to build it, together with a little bit of custom js code. It doesn't use markdown, it's rather focused on using appropriate html tags. Since then 've discovered some other tools I can't imagine using powerpoint at all.
The employee in me supports this because markdown is where 100% of my non-code work lives. The engineer in me strongly opposes this as I am pretty sure every presentation made via a slide deck could have been more effectively communicated in a different medium. Still though, this is cool and definitely will have uses for me at some point and opens up a way less frustrating alternative to opening PowerPoint and fighting against it the entire time to get what I want 😂
For people into this, this is a great intro. But really the snark is not needed. This is for a very niche use of presentation software. Great if all you really want is some nice looking text and code with the odd flourish. But it is not accessible to most people, and to get the same level of interactivity and visual polish of PowerPoint would take hours of coding.
That's a good question! For me, Marp makes sense for people whose goal it is to make math/code-focused presentations quickly. Generally, people who code tend to be at least passingly familiar with Markdown syntax (because it's frequently used as in open source code repositories "README.md" files). For those sort of people, Marp can be very valuable. I use it for weekly status updates on my projects and it saves me time over using PowerPoint.
Ah, okay, I get it; It's tailored toward someone who has a minor background in programming or may still be operating in that field. Given that the application works within your preexisting coding network, it becomes very easy to leverage within a reliable time. I think that is roughly correct, right?
Marp is awesome...but what it (and VSCode's regular markdown render need) is MERMAID support! With Mermaid, you can generate flow charts, UML, and other diagrams. It's rendered with JavaScript.
Oh man, I totally agree. I love mermaid. What I do (which I don't love) is use another mermaid plugin to render the chart to file and then embed the graphic. It's very annoying to maintain separate documents though!
@@benoitgrasset well it uses markup documentation. And marp is markdown presentation tool. So yeah, i mean have you ever seen a readme file on github or girlab, it looks all nice but its written in a markup language.
This looks cool. I love the philosophy behind it and will check it out. However, in the basis of your presentation, I don’t see what it has to offer that Quarto plus revealjs does not.
Yup, it's a great package! Have used a ton in the past. The advantage of Marp is that Markdown is less verbose than LaTeX, so I can create simple presentations faster. If I needed a heavily math-focused presentation, I'd still use Beamer. If I want to present something in a super animated way, well, I'd either make a video or reach for manim-slides or reveal.js (because they grant more control over animations than Marp). Marp hits a sweet spot for me of "fast, and good enough for most circumstances".
@@dougmercer Well for me LaTeX in general and Beamer in particular are both reflections of my integration with Org-Mode over the past decade. As a general rule of thumb I think for most people wishing to use their computer to achieve outcomes, rather than tinker with systems, I am very happy with the state and progress of Visual Studio and any tools to grant people capabilities that only folks familiar with the full suite of GNU and Latex tools have been doing for the past 15 years. So while I have already melded my very soul with my emacs configuration (from scratch, no doom/space, overlay) I just want to see tools like Word and Powerpoint get put in their place by some markdown compiler system.
As someone who did undergraduate math/graduate comp sci, I learned to love LaTeX/Beamer (although, I never embraced Emacs, despite using Linux as my daily driver for ~10 years). But yeah, in the same vein of being outcome-oriented, as someone who has less time to tinker/configure as I get older, these systems scratch the same itch without being time vampires (e.g., Marp vs Beamer, VS Code vs Vim, OSX vs Arch Linux).
@@dougmercer emacs as an operating system with a piddly text editor on-top. I love some of its killer apps but to this day I wish I had just started with vim.
Hey! Can you reach these slides? Here's a set of HTML Marp slides that I put together for my first video dmercer-youtube.gitlab.io/type-hints/ . You can get a sense of how it looks on mobile
@@dougmercer many thanks for your fast response....its amazing even on mobile...you can swipe left and right to make for the keyboard buttons.....your presentation has definitely piqued my interest in this new tech....Love from Zambia
Thanks Drezz! I haven't tried it, but it looks like Marp experimentally supports transitions in "Marp CLI" (no Marp for VS Code support, yet) marp.app/blog/how-to-make-custom-transition . Let me know if it works! When doing research for this video, I also stumbled across this demo that combined Marp and "reveal.js", codesandbox.io/s/nw80vrxvpp . That said, that demo uses the lower level "marpit" which more explicitly exposes HTML/CSS rather than the plain old Marp markdown syntax. Alternatively, you could make the jump to use reveal.js entirely, revealjs.com/ Thanks again for watching (and for the kind words =])
Hi Doug, thanks for sharing! I'm a newbie to programming. As you mention in the video, Marp supports HTML code, so I assume that Marp supports CSS too, is it right?
Hi Quang! I'm also a newb at HTML/CSS, so no worries there! In Marp, I stick to an included theme and at most add styles to spans. You can see some examples of adding custom CSS at 3:42 (and totally in-lining the style within the HTML here 4:39). So, if being able to write styled HTML with perhaps factoring out some of the style names, then that would be the easiest way to do it. You could also try to create your own Marp theme. It looks like a theme is essentially just CSS marpit.marp.app/theme-css. I believe you can create a theme and configure your Marp for VS Code settings to support the usage of the theme. Maybe that would work for you? If you want to have an external style sheet that isn't a theme, I *believe* (am not certain!) that you wouldn't be able to use the "Marp for VS Code" plugin and would have to instead use the "Marp CLI". I found some discussion of importing CSS here, github.com/marp-team/marp-cli/issues/266 . There may be a newer discussion somewhere. Hopefully that helps! Let me know what you end up doing!
@@dougmercer thanks for clarifying. I currently have a small project, it's a personal page that works as my résumé. I think I could create something with Marp to showcase my work on the page. Still loads of work to do so I may have to ask you more in the future ^^
For people with little/null knowledge about programming, MARP is not advantageous and I think prezi or PowerPoint are better suited for these persons. Personally, I've found MARP super easy to use, and it fits my necessities. Definitely I love MARP and I can't go back using PowerPoint XD
True. I've used beamer in the past for math-focused talks. Beamer + TikZ is a fantastic combo. That said, I can whip together a code-focused Marp presentation with a lot less boilerplate than Beamer.
@@dougmercer That is a good point. They definitely have different use cases and requirements. If you don't already use Latex I would never suggest to used Beamer, whereas Marp seems fairly easy to get into.
Looks really good. But does it support graphs that are linked to a data frame like excel tables a no graphs can be linked and updated on the fly in PowerPoint.
Love your editing! Also, I'll have to check how easy is to make a template with this or something similar. I like using Beamer in LaTeX but making a template for my company is a bit of too much work for that tbh
Thanks! I haven't tried making a custom theme in Marp yet, so I'm not sure how tricky that will be... If you do end up trying it, let me know how it goes!
A slightly more polished version of this (but not free and currently in Beta) would be iA Presenter. Have played around with it a bit, and while there is room for improvement it’s a pretty awesome tool.
Thanks Usmaan! For a future subscriber milestone video I'll do a deep dive on my workflow. But for a quick gist, I use Davinci Resolve. I used the free version up until my Python 3.11 video, only recently switching to the paid "studio" version so I could save time with masking. Check out "Casey Faris", "Patrick Stirling", and "Lazy Artist" on UA-cam for some great Davinci Resolve content!
Unlike PowerPoint however this isn’t Turing complete😢
So true.
Don't worry, it's coming. Feature creap ftw :P
But html together with css is turing complete, so that makes marp turing complete?
@@Ddxcv98 yeah css should be Turing complete by itself
What does it mean to be Turing Complete?
imagine you need to debug a presentation now lol
Hah! Coming from LaTeX/Beamer presentations in grad school, I *have* debugged presentations 🤦♂️. Thankfully Markdown is harder to mess up than LaTeX...
*PowerPoint Turing Machine intensifies*
Aren't we all just debugging everything?
@@dummypg6129 🤔 that's deep
No no, imagine debugging p*werpoint's proprietary xml or whatever that is
I never thought the day would come when they would make a framework for designing stand-alone power points
Never underestimate the laziness of programmers. I don't want to leave my editor/terminal!
@@dougmercer amen! We are lazy. We even use lazy loading 😂
LaTeX has been a thing for decades
LaTEX: Am I a joke to you?
The old Opera browser, and I mean the old one, the one that didn't use chromium, made something similar 20-ish years ago, if I remember well it used html as markdown still wasn't a thing
This is way more effort than PowerPoint for anything but the most basic presentations. Glad to know it exists though
I think the biggest advantage would be that you could write yourself one consistent style and functions for said style and then everything you do could be made simple to write and would always look consistent, no need to manually manage the style of each slide. The work for one slide is useless, but if you build hundreds of slides a year, it would definitely be a speed up.
I will say the latex equation support is way better than powerpoint, office software currently only word supports native latex
Powerpoint sometimes doesn't do what you want it to, this approach means you can position element exactly how you want
@@Spartan322 What would you want to do that you couldn't achieve with creating custom powerpoint slide masters? I think automating something like translation of presentations could be easier with Marp, but that is pretty much the only real advantage I see. (Other than being markdown, which some people including myself seem to enjoy working with.)
Except for code, it's easier to display it :)
Tbh, I think this is good for making presentations with syntax highlighted code, but I think Google Sheets or LibreOffice Impress are more powerful and accessible for most purposes. The fact that I can’t export to an editable PPTX is a dealbreaker for me.
So, simpler than TeX and in a format familiar to devs. Pretty cool!
In the future, there will be a code-free version with built in diagrams and figures, maybe a slideshow mode for presentations, a little highlighter you can use while presenting, and...
like mermaid in markdown you meant?
@@ranggakd Like Powerpoint
Clever and it should be namet somethinnh like emphasis on the point... or... powerpoint!
yea this reminds me of using some TeX derivative to make presentations, tho instead of dealing with TeX annoyances you have html/css annoyances but a bit less customization
i'm working on a startup for exactly this specific use case! we're thinking of calling it Point or Slides
Marp looks like an interesting thing, but also kudos on the editing - it's insanely good.
Thanks so much Andy =]!
The aim for my channel is "clear, concise, overly edited educational programming content". So, if you're enjoying my style of video, be sure to stick around or check out some of my other videos!
@@dougmercer do you by chance watch Lazy Artist and edit with davinci resolve? :D recognized some of his tricks/patterns in you Work/editing style. Looks great
@@swantoinepranks4651 I do-- I copied one of his tutorials for my title card whole cloth. Big fan!
And yes, I do use Resolve. It's great software
Interesting. I think I’ll stick with Keynote for now. But I can see this being interesting for generating slides programmatically for, e.g., release notes for your product. Instead of a simple list of changes you could have a slide per change with the name of the issue resolved as a title and the description of the issue in form of bullet points.
Even better: if you have a use case where you need to periodically update an existing presentation with new values. Instead of doing that manually, just let your build process generate those slides with updated values for you.
You could make slides highlighting the code quality of your code, showing metrics such as average lines of code per function or complexity metrics and how they evolved over time.
Thank you for making this, you cleared up some of my confusions around the custom css styles!
Glad to hear! Thanks for watching!
You can always use tables to have grids of any size. All you have to do is to hide borders via css without defining your own grid, and it works fine for small content!
Oh that's awesome! I'll have to try that later
You can also use `display: grid` to make grids of any size. Just set your `grid-template-columns` value to the size of each column. Then you don't need to add extra CSS to remove the borders, among other advantages. For example, you can use fractional units to easily make a certain number of columns - `1fr 1fr` for two equal columns, `2fr 1fr` for one large and one small column, `1fr 1fr 1fr` for three equal columns, etc.
The "repeat" syntax used in the example is designed to automatically add equal sized columns for you (so you don't need to specify an extra "1fr" manually to add another column).
If you want more rows as well, there's a very similar `grid-template-rows` that works in much the same way!
@@etekweb good to know!
A big reason to why this video blew up is the well done thumbnail. Great video too, keep up the good work!
Thanks so much!
Maybe I need to simplify some of my older thumbnails 🤔
This is awesome! I just introduce Ansible to our team, and presented it using markdown. This thing looks really cool!
Nice video, for years we have been used to create slides using only the mouse, however Markdown is also a great format for creating and editing, instead of using a specific program for opening pptx files for example, you can just use whatever text editor you want!
Worth noting that there is an alternative to Marp, which is slidev and it has a ton of great features
Yeah-- there seem to be a bunch of markdown -> slide renderers, but Marp was the first I landed on and learned. Maybe in the future I'll do a comparison video...
In any case, I'll have to check out slidev!
As a dev, i do so much of my work in markdown, including taking notes (extending as far as my college notes), so this feels like it's catered exactly to my needs, since I don't do really complicated presentations anyway.
Small markdown tip: if you're defining code blocks often, then file extensions work just as well (so ```py instead of ```python or ```js versus ```javascript). Saves you a few seconds over the course of a year!
Oh neat, I didn't know that! Thanks for saving me time =]
That's some super cool way to make a slide!
Thank you so much, Doug! I will definitely incoporate this into my skillset for damn sure
Thanks for this! I was just fighting my brain to move away from PP to Quarto, seeing all the nice ways I can integrate live graphs and maps. This helped get the basic syntax down!
Glad I could help!
Honestly, I’ll dabble with this. Seems REALLY good for making nice looking, simple presentations.
Glad to hear!
This seems overly complicated for no real reason. I love it!
😂
I watched your video for the first time, all the transitions and animations and all you use. It's really creative!
Thanks! =]
Aaaaaaaaa I always loved the minimalism of Markdown and always made my slides very minimalistic that's perfect!!!!!!
The great thing about this is that you can create basic presentations with simple scripts.
So let’s say you have a python notebook, you are now able to convert this into a presentation. You have a website and want to show it in a ppt presentation (why not do a live demo…? Doesn’t matter) you can script it quite easily.. so now this is an amazing thing.
powerpoint is honestly underrated
When it's the right tool for the job, I agree!
That said I avoid it when I can, and Marp saves me a ton of time.
I can see how this would help. A nice tool to have in my toolbox.
But, I'd still prefer ppt, the ease of creating custom designs, animation and transition (like morph). Adding add-in helps a lot, makes it much faster in editing or creating.
@@GildonUser Yeah, Marp looks cool but it is nowhere near as capable as PPT. I can see it gaining popularity in the developer community though
@@dougmercer I don't see how it could possibly save you time to find workaround to do something which is so simple to do in Powerpoint. Honestly, it seems like people are solving problems which don't exist.
@@javierflores09 Maybe, only if Github allows you to slide through it right from the repository, for very minimal presentations that give you a clearer idea of what the project is about
Interesting. However seems like it would only really be of more benefit than PowerPoint in cases where you want to programmatically generate a presentation.
Regardless, great video! Love the editing.
So this is great with chatgpt
@@ure2grit931 ok that's a great idea actually
This reminds me of Quarto, except for presentations instead of documents. It looks awesome!
Idk. Seems more intuitive to make your slides in ppt instead of markup. Maybe marp is great for automating and trying to keep your source code and docs in sync with your presentations.
That's fair. If you're putting together quad charts or other complex format slides then PowerPoint still makes sense.
For me, where most of my slides are simple bullets, images, syntax highlighted code, and math, Marp is way faster for me.
For code, I can simply copy/paste the code's text and have editable highlighted code. I'm not sure how to get nice, highlighted code in PowerPoint besides screenshots from an IDE (non-editable) or some more complex workflow with Pygments.
@@dougmercer this works in word, not sure of ppt...
to get highlighted code, just copy from a code editor, and keep the source formatting.
PS: don't forget to switch to the light mode...
To be honest as someone with a good understanding of html, I know the possibilities of it and for me could be faster to create cool presentations with markup and html than ppt. But that's where your preferences help you to choose one of the other
This is good with chatgpt though, can quickly generate the text for a presentation with it
i love this because i am looking for any reason or excuse to use markdown in anything.
Same. Changing my weekly status update from PowerPoint to Marp was a game changer for me.
I've definitely been trying to tinker with getting Pandoc to render my lectures, but keep running into difficulties with theming and code scaling. This looks pretty solid, and being able to drop CSS in there is awesome. Great video
Now to get wild see if it supports embedding, and if my LMS can handle putting the HTML outputs up so my students can tweak Python tutor code mid-slidedeck.
I haven't tried embedding s-- I hope it works for you and your students!
I want to thank you for this video, it started me on using Marp and while it's quite simplistic out-of-the-box, it's fully customizable with some css tinkering and in conjunction with vector graphics software, such as Inkscape. I think I'm about ready to forget Powerpoint, except when it's required at work.
That's awesome to hear! Glad it was helpful =]
This is great. AND it’s open source, which is extremely based
pogars, bootiful editing and totally sold me
thought this was a really big channel - turns out you've only got 1k rn
keep it going, the editing is super high quality and the content is amazing too
Thanks so much!
Believe or not, before this video I had ~200 subscribers! I'm so thankful that this video is blowing up.
I haven't used PowerPoint to make presentation in years. I use it for drawing and creating movies and illustrations. Writing books and making games.
Loved the flow of this video. Subscribed 😁
Glad to hear! Thanks for subbing!
1990: let’s make a tool for handling this presentation scripts visually
2023: Yo let’s code some powerpoint
This is absolutely phenomenal.
Thank you!
Glad you liked it!
Love the idea behind marp and what it could accomplish so far plus your vid is absolutely on point
But the truth is, I’d still need to sell my soul to big corps (ppt, google slides) or libre suite on the other spectrum because the apps are much simpler and faster with batteries included
Learned a new skill. Good stuff @Doug
Thanks Abhijeet!
Thanks for explaining how to use this tool. It was very useful.
Glad it was helpful! Thanks for watching
this is actually good, I'm impressed
your editing is insanely good
Thanks Micael!
I find it funny when people talk about "coding presentations". Markdown isn't a programming language - it's simply a markup language for formatting text. I think it's really useful, especially when you're creating presentations which involve a lot of code snippets, quotes or stuff like that. When you're trying to build something with a huge amount of images, transitions and effects, this tool isn't for you. But then you're mostly directing a movie, not creating a presentation. Presentations should be kept simple without effects or transitions, a handful of images in total and only a few lines of text for each slide.
I agree. I think Marp hits a nice middle ground of making it simple to make syntax highlighted or latex formatted presentations, but think it's the wrong tool if you want something truly custom with fancy transitions, etc. (then maybe reveal.js is a nice option)
Wasn't impressed at first (esp. the picture + text solution), but you had me at "supports custom css" lol! Definitely will be looking into this. -I wonder, while it doesn't support slide transitions like powerpoint, would it be able to render the css animation property?-
Edit: Just googled a bit, it actually does seem to support custom transitions with several css properties even, very cool
(Was in process of replying, but it looks like you already stumbled across some of the same stuff I did.)
I haven't tried it, but it looks like Marp experimentally supports transitions! marp.app/blog/how-to-make-custom-transition . Let me know if it works!
When doing research for this video, I also stumbled across this demo that combined Marp and "reveal.js", codesandbox.io/s/nw80vrxvpp . That said, that demo uses the lower level "marpit" which more explicitly exposes HTML/CSS rather than the plain old Marp markdown syntax.
@@dougmercer Yea, just came across marpit as well. As someone who has done quite a bit of front end web-dev, I can see some wild possibilities for slide designs and transitions that would never be possible in PowerPoint.
Though I do wonder how easy (or difficult) it would be to collaborate on this. Doubt most non-coders would be comfortable using this instead of Google Slides. Maybe a mixed workflow, where the backgrounds/general designs are done in marp and then exported as pptx could work though.
I haven't messed with working in pure marpit-- I do think it could be harder to onboard collaborators if you get too exotic.
I have a bit of a blind spot on how much complexity (if any) you can boil into your own custom theme. You might be able to bake the fanciness into a theme (total speculation-- sorry if I'm wrong!)?
In another comment thread, I mentioned that I had a workflow where I:
* Set up a Gitlab repository for my presentation
* Set up a Gitlab CI pipeline that used the Marp CLI docker image to render the slides and deploy them to Gitlab pages
You might be able to set up something like that so that your collaborators wouldn't need to install Marp CLI, and could just focus on modifying the content after you establish the style/themes/etc.
Great video! My favorite part was when he said "It's marpin' time" and then marped all over the place!
It remembers me a little of reveal.js. Back in my middle school I've been asked to make a simple quiz with some math and code in it, and I chose this library to build it, together with a little bit of custom js code. It doesn't use markdown, it's rather focused on using appropriate html tags. Since then 've discovered some other tools I can't imagine using powerpoint at all.
Yeah, I've heard good things about reveal.js-- what other tools have you landed on now?
@@dougmercer to be honest I haven't had to use them for some time. Last time I think it was beamer, because I've had to learn LaTeX for my university.
Ah yeah, Beamer+LaTeX are great for math focused stuff
it really good but i want to do this whole prosses in a laravel app that i'll create is it doable
Sorry, I have no idea-- I'm not really familiar with laravel.
markdown for slides? I like this. Thank you!
Glad to hear! Thanks for watching =]
Reminds me of LaTeX Beamer which we used at university. It had more features, though.
Beamer is great!
The use case for this, to me, is "good enough for common tasks, faster"
The employee in me supports this because markdown is where 100% of my non-code work lives. The engineer in me strongly opposes this as I am pretty sure every presentation made via a slide deck could have been more effectively communicated in a different medium.
Still though, this is cool and definitely will have uses for me at some point and opens up a way less frustrating alternative to opening PowerPoint and fighting against it the entire time to get what I want 😂
This just makes me appreciate powerpoint more :p
Its very useful for people in hackathons where u have to write code and create a ppt as well...😚
For people into this, this is a great intro.
But really the snark is not needed. This is for a very niche use of presentation software. Great if all you really want is some nice looking text and code with the odd flourish. But it is not accessible to most people, and to get the same level of interactivity and visual polish of PowerPoint would take hours of coding.
I really like the video editing ♡
Thanks so much, Astha =]
This is exactly what I’ve always wanted
I recommend Pandoc for Markdown -> slides via LaTeX Beamer
Perfect! Now I can code my PowerPoints. Who needs a gui editor anyway?
I'm curious to know who this is being marketed to: from a surface glance, this would be slightly daunting and complex to a more casual user.
That's a good question!
For me, Marp makes sense for people whose goal it is to make math/code-focused presentations quickly. Generally, people who code tend to be at least passingly familiar with Markdown syntax (because it's frequently used as in open source code repositories "README.md" files).
For those sort of people, Marp can be very valuable. I use it for weekly status updates on my projects and it saves me time over using PowerPoint.
Ah, okay, I get it; It's tailored toward someone who has a minor background in programming or may still be operating in that field.
Given that the application works within your preexisting coding network, it becomes very easy to leverage within a reliable time. I think that is roughly correct, right?
@@benny399 yup! That sums it up pretty well
Such a high quality video!
Thanks Charles =]!
would using flexboxes work for multiple columns / complex block placements ?
I'm not sure-- someone else said that tables work, but I haven't had a chance to try that either.
If you try it, please come back and let me know!
Marp is awesome...but what it (and VSCode's regular markdown render need) is MERMAID support!
With Mermaid, you can generate flow charts, UML, and other diagrams. It's rendered with JavaScript.
Oh man, I totally agree. I love mermaid.
What I do (which I don't love) is use another mermaid plugin to render the chart to file and then embed the graphic.
It's very annoying to maintain separate documents though!
Great overview, thanks 👍
Thanks! Glad it was helpful =]
what a awesome tool! i will certainly use this! thanks mate!
Note that you can do exactly that with revealjs in Quarto in Rstudio or use package xaringan in Rstudio.
Ah man, this will be extremely helpful for me. Thanks!
Glad to hear! Thanks for watching!
This channel is amazing
Thanks so much! =]
LaTeX for Presentations? 😊
Marp is great, thats why its used on places like github and gitlab for readme files. I just actually made a bit more complex md file for a repo
You mean Github uses Marp ?? Can you show us your md file ?
@@benoitgrasset it was for a professor so i wouldnt like to doxx my self, cause there is my name and my school on that readme
@@benoitgrasset well it uses markup documentation. And marp is markdown presentation tool. So yeah, i mean have you ever seen a readme file on github or girlab, it looks all nice but its written in a markup language.
holy shit this is so good, i didnt even think of this kind of making presentations
hopefully i find something like that for vim
thanks Doug, very cool
I used vscode-reveal a couple of times which utilizes revealjs. Would be great to see a comparison of the two, and other alternatives if available.
That's a good idea
This looks cool. I love the philosophy behind it and will check it out. However, in the basis of your presentation, I don’t see what it has to offer that Quarto plus revealjs does not.
I always thought about this being a thing. 🙌
Buenísimo, me a encantado está herramienta y muy buen tutorial
Gracias! =]
Did you try the LaTeX package beamer?
Yup, it's a great package! Have used a ton in the past.
The advantage of Marp is that Markdown is less verbose than LaTeX, so I can create simple presentations faster.
If I needed a heavily math-focused presentation, I'd still use Beamer.
If I want to present something in a super animated way, well, I'd either make a video or reach for manim-slides or reveal.js (because they grant more control over animations than Marp).
Marp hits a sweet spot for me of "fast, and good enough for most circumstances".
Fantastic tutorial
Thanks! Glad it was helpful =]
Glad there are alternatives to Beamer for those that don't want to do the full latex rabbithole
Totally agree!
Also, thank you for possibly being the only commenter who both knows about Beamer and did not comment "why not Beamer?"
@@dougmercer Well for me LaTeX in general and Beamer in particular are both reflections of my integration with Org-Mode over the past decade.
As a general rule of thumb I think for most people wishing to use their computer to achieve outcomes, rather than tinker with systems, I am very happy with the state and progress of Visual Studio and any tools to grant people capabilities that only folks familiar with the full suite of GNU and Latex tools have been doing for the past 15 years.
So while I have already melded my very soul with my emacs configuration (from scratch, no doom/space, overlay) I just want to see tools like Word and Powerpoint get put in their place by some markdown compiler system.
As someone who did undergraduate math/graduate comp sci, I learned to love LaTeX/Beamer (although, I never embraced Emacs, despite using Linux as my daily driver for ~10 years).
But yeah, in the same vein of being outcome-oriented, as someone who has less time to tinker/configure as I get older, these systems scratch the same itch without being time vampires (e.g., Marp vs Beamer, VS Code vs Vim, OSX vs Arch Linux).
@@dougmercer emacs as an operating system with a piddly text editor on-top. I love some of its killer apps but to this day I wish I had just started with vim.
Dope video editing !!!
Thanks so much! =]
I'm gonna share this with my class
Thanks so much! glad you liked it! =]
PowerPoint's auto designer is heavenly though. Just slap some text on slides and have PP to handle the design.
Hi Doug, if you use HTML how would the presentation look on mobile? would it be mobile or tablet responsive?
Hey! Can you reach these slides? Here's a set of HTML Marp slides that I put together for my first video dmercer-youtube.gitlab.io/type-hints/ . You can get a sense of how it looks on mobile
@@dougmercer many thanks for your fast response....its amazing even on mobile...you can swipe left and right to make for the keyboard buttons.....your presentation has definitely piqued my interest in this new tech....Love from Zambia
Glad I could help! Thanks for watching, Ron!
I love this! I wish I had a reason to do a presentation where I needed to show code blocks because this is so clean!
wow, this is probably how the original prince of peris made his presentations. Nice video. Probably not made in MARP.
Thanks for sharing the 'm gonna try it out later.
Here's your Like.
Thank you for showing me this, but, BOY, this made me value Only/WPS/Libre Office 😅
wow, amazing, thank you for providing us this awesome extension
I didn't create it! I just use it frequently and wanted to share =]
Much much love the presentation! But I do wish there is a code where you can animate some text or divs (AND your editing is sooo fricking cool!!)
Thanks Drezz!
I haven't tried it, but it looks like Marp experimentally supports transitions in "Marp CLI" (no Marp for VS Code support, yet) marp.app/blog/how-to-make-custom-transition . Let me know if it works!
When doing research for this video, I also stumbled across this demo that combined Marp and "reveal.js", codesandbox.io/s/nw80vrxvpp . That said, that demo uses the lower level "marpit" which more explicitly exposes HTML/CSS rather than the plain old Marp markdown syntax.
Alternatively, you could make the jump to use reveal.js entirely, revealjs.com/
Thanks again for watching (and for the kind words =])
Cool! but can it do Star Wars style transition animation?
Hi Doug, thanks for sharing! I'm a newbie to programming. As you mention in the video, Marp supports HTML code, so I assume that Marp supports CSS too, is it right?
Hi Quang!
I'm also a newb at HTML/CSS, so no worries there! In Marp, I stick to an included theme and at most add styles to spans.
You can see some examples of adding custom CSS at 3:42 (and totally in-lining the style within the HTML here 4:39). So, if being able to write styled HTML with perhaps factoring out some of the style names, then that would be the easiest way to do it.
You could also try to create your own Marp theme. It looks like a theme is essentially just CSS marpit.marp.app/theme-css. I believe you can create a theme and configure your Marp for VS Code settings to support the usage of the theme. Maybe that would work for you?
If you want to have an external style sheet that isn't a theme, I *believe* (am not certain!) that you wouldn't be able to use the "Marp for VS Code" plugin and would have to instead use the "Marp CLI". I found some discussion of importing CSS here, github.com/marp-team/marp-cli/issues/266 . There may be a newer discussion somewhere.
Hopefully that helps! Let me know what you end up doing!
@@dougmercer thanks for clarifying. I currently have a small project, it's a personal page that works as my résumé. I think I could create something with Marp to showcase my work on the page. Still loads of work to do so I may have to ask you more in the future ^^
For people with little/null knowledge about programming, MARP is not advantageous and I think prezi or PowerPoint are better suited for these persons. Personally, I've found MARP super easy to use, and it fits my necessities. Definitely I love MARP and I can't go back using PowerPoint XD
you got some high quality production skills, realy enjoying your style
Thanks so much Tzoor! Comments like yours make my day =]
Finally, having previously replaced Word with LaTeX, I can now replace PowerPoint.
Latex already has the Beamer class.
True. I've used beamer in the past for math-focused talks. Beamer + TikZ is a fantastic combo.
That said, I can whip together a code-focused Marp presentation with a lot less boilerplate than Beamer.
@@dougmercer That is a good point. They definitely have different use cases and requirements. If you don't already use Latex I would never suggest to used Beamer, whereas Marp seems fairly easy to get into.
Looks really good. But does it support graphs that are linked to a data frame like excel tables a no graphs can be linked and updated on the fly in PowerPoint.
Unfortunately, it doesn't support that.
Now you have to center a div inside PowerPoint
Uh oh 😟
The idea is good but you can also put programs in the powerpoint using add ins such as script lab, pick it for images, and many more.
this is a cool way to make one thank you
Love your editing!
Also, I'll have to check how easy is to make a template with this or something similar. I like using Beamer in LaTeX but making a template for my company is a bit of too much work for that tbh
Thanks!
I haven't tried making a custom theme in Marp yet, so I'm not sure how tricky that will be...
If you do end up trying it, let me know how it goes!
A slightly more polished version of this (but not free and currently in Beta) would be iA Presenter. Have played around with it a bit, and while there is room for improvement it’s a pretty awesome tool.
That looks pretty cool-- first time I'm hearing about it
Holding my breath not to make a bad comment on a product that was not even marginally targeted at me
Haha! Sorry-- this video extended well beyond my usual audience
Hi tremendous video editing can you share whihc editor u use and a tutorial on that too please ❤
Thanks Usmaan!
For a future subscriber milestone video I'll do a deep dive on my workflow.
But for a quick gist, I use Davinci Resolve. I used the free version up until my Python 3.11 video, only recently switching to the paid "studio" version so I could save time with masking.
Check out "Casey Faris", "Patrick Stirling", and "Lazy Artist" on UA-cam for some great Davinci Resolve content!
Great 😃 looking forward to it ☺️
Damn! You can use a neovim and marp and no one normal person will undestand that you JUST MAKING A PRESENTATION