The Modular Markdown Guide details the recommended approach and key benefits of adopting a modular design when developing and managing slideshow presentation content. Especially when you are developing course or training materials.
This guide takes modularity one step further, showing you how you can use modular markdown to deliver modular slideshows.
A Modular Slideshow is a slideshow built using modular markdown that allows you to publish mini-decks. Each mini-deck presents a subset of slides found within the master presentation. Mini-decks can be shared independently with any audience.
This feature is especially powerful when you are developing slide decks to deliver course and training materials. Modular slideshows allow you to develop complete course content that can share common slides, assets, and styles. And then deliver your course to your audience as as series of topic-specific mini-decks.
The Modular Markdown Guide demonstrated how a modular approach can be used to deliver training materials using an example course, an Introduction to HTML5. Here is the repository file and directory structure for that example:
. ├── PITCHME.md | ├── PITCHME.yaml | ├── common │ ├── about │ │ └── PITCHME.md │ └── contact │ └── PITCHME.md | └── training | └── topics | ├── css | | │ ├── PITCHME.md | | │ ├── selectors │ │ └── PITCHME.md | | │ └── syntax │ └── PITCHME.md | ├── html | | │ ├── PITCHME.md | | │ ├── attributes │ │ └── PITCHME.md | | │ └── tags │ └── PITCHME.md | └── js | ├── PITCHME.md | ├── callbacks │ └── PITCHME.md └── objects └── PITCHME.md
The master presentation delivered by the content in this repository delivers the full set of content across all topics covered by the example HTML5 course. The master presentation could be shared at the following (fictitious) slideshow URL:
The example that follows below demonstrates how mini-slideshows can be delivered with zero-modifications to the master content.
The following example takes advantage of existing content within the example Introduction to HTML5 repository to deliver chapter-specific mini-decks. These mini-decks can be used to simplify the delivery of the training course materials.
The following directory outline shows the addition of new chapter specific PITCHME.md markdown files:
. ├── PITCHME.md | ├── PITCHME.yaml | ├── chapter | | | ├── css | │ └── PITCHME.md | | | ├── html | │ └── PITCHME.md | | | └── topics | └── PITCHME.md | └── training | └── ...
The content of the new chapter/css/PITCHME.md markdown file might look as follows:
---?include=course/common/greeting/PITCHME.md ---?include=course/topics/css/PITCHME.md ---?include=course/topics/css/selectors/PITCHME.md ---?include=course/topics/css/syntax/PITCHME.md ---?include=course/common/contact-me/PITCHME.md
As you can see above, the content of our new CSS chapter mini-deck is created purely by reusing existing presentation content found in the repository. No file, asset, or style duplication.
To present this new CSS-chapter specific mini-deck, simply identify the chapter as a query parameter on the standard slideshow URL, for example (fictitious):
The GitPitch Demo Deck provides a real-world example of a Modular Slideshow. An overview of the repository file and directory structure for the demo deck is shown here:
├── PITCHME.md ├── PITCHME.yaml ├── assets │ ├── css │ │ └── PITCHME.css │ └── img │ ├── audience.png │ ├── flowers.png │ ├── logo.png │ ├── world.png │ └── ... ├── deck │ ├── code-magic │ │ └── PITCHME.md │ ├── hello-world │ │ └── PITCHME.md │ ├── image-magic │ │ └── PITCHME.md │ ├── markdown-magic │ │ └── PITCHME.md │ └── media-magic │ └── PITCHME.md └── src ├── css │ └── sample.css ├── go │ └── sample.go ├── http │ └── sample.http ├── php │ └── sample.php ├── sql │ └── sample.sql └── uml └── sequence.puml
The master presentation for The Demo Deck is found at the following slideshow URL:
However, the demo deck has grouped related slide designs into sub-categories. And the slide designs for each sub-category are delivered within their own dedicated PITCHME.md markdown files.
One consequence of this modular design of the demo deck is that each sub-category can be opened and viewed as an independent slideshow presentation, or mini-deck.
For example, to present the image-magic designs as an independent mini-deck, simply identify the image-magic category as a query parameter on the standard slideshow URL, for example:
This exact same approach can be used to present any of the sub-categories as an independent mini-deck.