On Slide Decks with JavaScript
Context
#As I have mentioned before, I strive to ensure that everything I work with is plain text.
I use the delightful remark Javascript library to convert Markdown
into lovely slide decks.
Under the hood, most of my slide decks look like this:
<textarea id="source">
# Slide Title
## Slide Subtitle
- My keen and valuable insights
- As bulleted lists
- This is the way
???
My speaker notes.
---
# Another Slide Title
</textarea>
<!--<script src="https://gnab.github.io/remark/downloads/remark-latest.min.js">-->
<script src="/js/remark-latest.min.js" />
<script>
var slideshow = remark.create();
</script>
Tip: Because the sides spend part of their life as
HTML
, I am able to style however I want using my madCSS
skills.
Because I'm doing an extra bit of JavaScript
, I must exempt the /slides
folder from being processed by Eleventy.js
in .eleventy.js
:
eleventyConfig.addPassthroughCopy("slides"); // My slide decks