An alternative to PowerPoint
As a lecturer and trainer, I usually work with a mix of presentations, live coding and exercises. I initially used the classic PowerPoint for the presentations, but this soon no longer felt right. Too often, I found myself spending too much time formatting content. Another problem was the display of code in PowerPoint. I felt that only images or screenshots of code looked really good, but that created a big problem: images had to be recreated every time there were changes in the code, and that is very time-consuming.
Slidev
So I started looking for an alternative to PowerPoint and found what I was looking for with slidev. Slidev allows me to describe my presentation content in Markdown. This means that I can write presentations in a similar way to code - great! In addition, slidev offers many useful functions for me, such as:
- A great representation of code. Syntax highlighting is available for many common programming languages.
- The content and the formatting or display of the presentation are separated. There are many different layouts and Themes available to customize the appearance of your own presentation to your personal needs.
- A slidev presentation is started in the browser and can be controlled via a separate Presenter view if required. It is also possible to switch between dark and light mode.
- The presentation can be exported as a PDF. This makes it very easy for me to share the content with participants in my courses.
A very comprehensive documentation also makes it easier to get started.
Reuse content
The lectures and courses that I give as a lecturer or trainer usually deal with the development of apps with React Native, Expo and JavaScript. There is a large overlap in the content that I use in both the lectures and the courses. Initially, I created both a slidev project for the lecture and a slidev project for the courses and duplicated content - not a good idea! As in development, you should also avoid duplicating presentation content because it unnecessarily increases the maintenance effort.
While looking for an approach to reuse, I noticed that slidev supports symlinks for graphics and that individual sections of presentation content from folders outside the current project directory can be included. Symlinks and external sections allow me to create a kind of multi-module project for different slidev presentations:
teaching-react-native-and-expo/
├── common/
│ └── public/
│ └── some-image.png
│ └── sections/
│ └── common-topic-a.md
├── lecture/
│ └── public/
│ └── some-image.png <-- Symlink
│ └── sections/
│ └── lecture-specific-topic-b.md
├── course/
│ └── public/
│ └── some-image.png <-- Symlink
│ └── sections/
│ └── course-specific-topic-b.md
The common folder contains graphics (in the public folder) and sections of presentation content (in the sections folder) that are used in both lectures and courses. The lecture and course folders contain the specific slidev projects for the lecture and the course, which in turn can include the graphics and sections from the common folder.
Symlinks for graphics
In the regular slidev projects, I can insert the graphics from the common/public folder via symlinks and thus comply with the folder structure of slidev projects without any problems.
cd teaching-react-native-and-expo/
cd lecture/public/
ln -s ./../../common/public/some-image.png some-image.png
cd ../..
cd course/public/
ln -s ./../../common/public/some-image.png some-image.png
The generated symlinks in the folders lecture/public and course/public point to the original image in the folder common/public. The graphic in the form of the symlink can be used as usual in slidev. For example, as an image in a specific page:
<div class="flex flex-col justify-center items-center m-4">
<img src="/some-image.png" class="h-65"/>
</div>
External sections
Sections of presentation content from the common/sections folder can be used as usual in the specific slidev project in conjunction with src:
---
<!-- Section within the project -->
src: ./sections/lecture-specific-topic-b.md
---
---
<!-- Section outside the project -->
src: ./../common/sections/common-topic-a.md
---
Summary
Creating my presentations for lectures and courses is such a joy for me, thanks to the use of slidev. In particular, the display of code is great and, in my opinion, much better than in PowerPoint, for example. The maintenance and reuse of presentation content can be achieved in a simple way with the help of symlinks, among other things.