MarkDown для презентаций

Тут как то писал про инструмент построения UML диаграмм при помощи PlantUML. Сегодня поговорим про еще один инструмент на основе плоского текст - Marp. Он позволяет описывать презентации в виде текста (который будет нормально мерджится в том же Git-е) и генерировать на его основе презентацию в pptx, pdf или html.

Итак, начинаем.

Для работы с Marp я буду использовать Visual Studio Code. Устанавливаем расширение для работы с Marp:

Создаем файл с расширением md:

После этого можем включить предварительный просмотр:

В режиме разделенного редактора в правой части будет виден результирующая презентация (напоминаю, все картинки кликабельны):

Пара замечаний:

marp: true

Используется, для пометки что мы используем marp. Если не указать эту строку, или указать значение false, то модуль выключится и мы будем получать стандартное отображение для MarkDown:

--- - используется для разделения страниц. Единственно, не забываем, что перед --- надо оставлять строку. если это не сделать, то разделитель перестает работать:

Если пустые строки раздражают, можно воспользоваться другими разделителями ___ (три подчеркивания), *** (три звездочки) или - - - (те же три минуса, но через пробел).

Что еще есть полезного в Marp? Конечно же директивы. В первом блоке, где у нас был указан marp:true можно указывать директивы в синтаксисе имя_директивы: значение, а если нужно указать директиву на конкретной странице, то используется синтаксис html комментариев. Например:

Фон стал желтым, но на конкретном слайде он был заменен на белый, причем в этом случае у директивы использовался в начале знак подчеркивания:

_backgroundColor: white

Если знак подчеркивания убрать, вот так:

backgroundColor: white

То директива будет действовать не только на текущий слайд, но и на последующие:

Директивы делятся на глобальные и локальные. Глобальных не много, они позволяют задать тему (из набора стандартных), стиль оформления и еще один вариант разделения страницы на слайды. Я немного покажу про стили.
Стили задаются при помощи html элемента style:

Как и в обычном html можно задавать классы и применять стиль к ним, в примере задан стиль для титульной страницы (с классом tiltslide) и для всех остальныз страниц:

Ну и самое главное, экспорт. Для этого, достаточно кликнуть на появившемся в редакторе ярлыке Marp и выбрать экспорт:

Получается, весьма похоже:

Кроме pptx, можно экспортировать в pdf, html и изображения (png и jpg).