История Марпа Далее

Этот пост – перекрестная статья из Марп блог . Марп это настольное приложение для настольного компьютера с открытым исходным кодом для записи слайд-колоды в Markdown.

Первая версия Марп был выпущен почти 3 года назад. Сначала он был начат с простого инструмента для личного использования под названием «MDSlide». И теперь Марп использовался многими пользователями, которые узнают реальную ценность автора презентации. Марп собрал вокруг 8000 звезд до настоящего времени.

Тем не менее, наша головная боль, вызванная отсутствием обслуживания для развития. Мы получили так много запросов в приложение Old Marp, и оно должно развиваться, чтобы продолжать предоставлять лучшую писательскую среду презентации.

Сегодня я так взволнован, чтобы представить историю о Марпе следующей! Полно-разворотный марп-это не только писатель. Чтобы быть полезным в различных ситуациях, мы строим совершенно новая экосистема марпа состоял из нескольких модулей. Они разработаны с помощью JavaScript и TypeScript, и гораздо более обслуживаемые, чем предыдущий MARP.

Marp-Team/Marp

Входная репозитория экосистемы презентации Markdown Ecosystem

Марп : Ecosystem Markdown Presentation

Марп Является ли экосистема, чтобы написать вашу презентацию с простой отметки.

МАРП СЕМЬЯ

Наш проект распространяется по многим репо, чтобы сосредоточиться на ограниченном объеме на репозиторий. Активные проекты показаны, как подчеркивается в следующем списке.

Этот репо ( @marp-team/marp ) является входом в семью Марпа, и места наш сайт .

Структура/ядро

Марпит		Тощий фреймворк для создания слайд -палубы от Markdown. (marpit.marp.app)
Marp Core		Ядро конвертера MARP с практическими особенностями и темами.

Программы

Марп Кли		MARP CORE / MARPIT’S CLI Интерфейс для преобразования в HTML, PDF, PPTX и Image (S).
Марп Веб		Основной интерфейс MARP на основе PWA и Preact Framework.
MARP Desktop		Настольный клиент для MARP Web для замены Yhatt/Marp.

Интеграции

Марп VSCODE		Расширение кода VS на

Марп VSCODE

Расширение кода VS на

Марп Далее имеет два основных компонента: Марпит структура и MARP CORE Анкет Инструменты MARP Ecosystem обычно основаны на них.

Марпит

Marp-Team/Marpit

Тощий фреймворк для создания слайд -палубы от Markdown

Марпит : Рамки с наставкой слайд -слайд

Марпит /mːrpɪt/это тощая структура для создания слайд -колоды от Markdown. Он может преобразовать темы Markdown и CSS для скольжения колоды, состоящей из статического HTML и CSS, и создавать кабриолет веб -страницы в слайд PDF путем печати.

Марпит предназначен для Выходные минимальные активы для слайд -колоды . Вы можете использовать голые активы в качестве слайд -колоды без логики, но в основном мы рассчитываем интегрировать выход с другими инструментами и приложениями.

Фактически, эта структура создается для использования в качестве базы основной конвертер в Следующая версия Marp Анкет

Функции

📝 Марпит Маркдаун

Мы расширили несколько функций в Markdown-It Счастчик, чтобы поддержать написание потрясающих слайдов, таких как Директивы и Слайд Фоны Анкет Дополнительные синтаксисы придают значение совместимости с общими документами маркировки.

🎨 Тема CSS от чистой наценки

У Марпита есть система тематического уровня CSS, которая …

Марпит это Тощий каркас Для создания слайд -колоды HTML от Markdown. Он предназначен для преобразования разметки в только минимальные активы, состоящие из статического HTML и CSS, а выход может преобразовать в слайд -колоду PDF путем печати через хром/хром.

Марпит создал для использования в качестве основы экосистемы MARP, но это также независимая структура. Вы можете интегрировать преобразование отметки Марпита со своим инструментом, даже если это не Marp: Specive.js , WebSlides , и так далее.

Одним из реальных вариантов использования является Metabake проект. Он обеспечивает интеграцию Marpit с нашей ранней фазы, чтобы легко создать веб -страницу в стиле презентации. ( См. Пример )

Marpit Markdown: сохраняйте совместимость с простым документом с отметки

Мы получили много запросов Для старого марпа о дополнительном синтаксисе, чтобы помочь создать красивую слайд -колоду. С другой стороны, мы также получили запрос, чтобы должен строго уважать синтаксис разметки Анкет Мы должны иметь дело с этими противоречивыми вопросами.

Дополнительный синтаксис, предоставленный Marpit, никогда не должен ломаться Commonmark документ. Таким образом, результат рендеринга продолжает выглядеть красиво, даже если вы откроете Marpit Markdown в общем редакторе Marckdown. И вы даже можете расширить дополнительный синтаксис через Плагины Markdown-It если тебе надо.

Тема CSS: проектируйте свою колоду с чистой наценкой

У Marpit есть система темации, позволяющая проектировать все слайды CSS.

Старая марпа была Ограниченный тематическая система и требует глубокого погружения в внутреннее для настройки: система сборки, Sass , логика приложения MARP, и так далее. Таким образом, нам пришлось создать совершенно новую систему темации для легкой настройки темы только с общими знаниями CSS.

Марпит – это только чистый CSS, и никаких дополнительных знаний! У вас есть только фокусировать стиль HTML Semantic Elements. Это означает, что вы можете создавать тему CSS с этого момента!

Кроме того, Marpit имеет идеальную систему слайдов Pixel, такую как PowerPoint и Keynote. Создатель темы никогда не должен беспокоиться о отзывчивом макете, и может предоставить дизайн именно так, как хотел автор с меньшими усилиями.

Встроенный слайд SVG (экспериментальный)

Наша уникальная идея заключается в том, чтобы обернуть каждую слайды встроенными SVG. Это может быть немного странно, но делает много преимуществ.

Поддерживает Pixel-идеальное масштабирование через определение стиля и Реализует слайд-колоду Zero-JS Анкет
Изолят содержит содержимое и предотвращает, что вводится DOM с помощью расширенного дизайна функций Marpit Breaks, определенного в темах CSS.

Благодаря силе SVG, мы можем сохранить простой и обслуживание. MARP CORE основан на встроенном SVG Slide по умолчанию.

Marp Core

MARP CORE является базовым преобразователем для наших проектов, простиранных от Марпита. Короче говоря, это марпит с батареей.

У Marpit есть только обнаженные важные особенности, поэтому этого может быть недостаточно, чтобы начать писать вашу колоду. MARP Core предоставляет практическое синтаксис, дополнительные функции и встроенные темы.

Многие из функций основаны на старом настольном приложении и улучшились, чтобы быть подходящим для Marpit. Конечно, мы добавили новые функции для создания более красивой колоды.

Встроенные темы (по умолчанию, Gaia и new раскрыть тему)
Включена поддержка эмодзи 😁
Katex Математика набор
Функции автоматического масштабирования ( new )
- Подготавший заголовок через аннотация
- Масштабированный переполненный забор, код и математический блок

Марп Кли

Марп CLI это интерфейс CLI от Marpit и Marp Core Converter. Это швейцарский армейский нож для палубы Marp Slide!

Вы можете использовать его прямо сейчас, работая npx @marp-team/marp-cli Если Node.js установлен.

Экспорт в HTML, PDF и изображение
Смотрите изменение вашей отметки и темы ( -наблюдательно )
Открыть окно предварительного просмотра для презентации ( - -Preview )
Полноучиваемый двигатель на основе каркаса Marpit

Первоначально у Марпа был текстовый редактор, но вы можете подумать, что они хотят написать слайд -колоду с вашим любимым редактором. Если вы используете VIM, вам будет некомфортно, чтобы не быть использованным ключом в стиле VIM. Отныне используйте режим часов Marp Cli вместе с оригинальной Vim!

И Marp CLI может создать действительно практичный статический HTML, как в режиме презентации! Он оснащен глубокой интеграцией с Bespoke.js .

Спасибо NetLify В Теперь и больше услуг хостинга, MARP CLI также приносит эффективное управление GIT для создания слайд -колоды, как Gitpitch Анкет Я создал Пример слайда Управляется через GitHub Repository Как хороший стартер, чтобы помочь написать слайд -колоду. Попробуйте использовать его через кнопку «Развернуть в netLify» на Readme !

Marp Web (Tech Demo)

Марп Веб является веб -интерфейсом автора презентации MARP. Это позволяет писать вашу слайд -колоду как традиционное настольное приложение.

Текущая марпа сеть – это просто техническая демонстрация. Мы планируем переосмыслить веб-сайт MARP на основе известной структуры (например, React) для создания спа.

Прогрессивные веб -приложения

Это сделано Некоторые сильные оппозиции пользователей, которые используют MARP в автономном режиме Когда предложена идея миграции в веб-приложение для поддержания обслуживания MARP. Было вызвано, что мышление о ПВА в то время не было общим.

И через 2 года пришло время использовать PWA! После первого доступа к https://web.marp.app/ , Marp Web будет готов к использованию как в онлайн, так и в автономном режиме. Онлайн -ресурсы для использования веб -интерфейса будут кэшированы в вашем браузере и будут использовать их, когда сеть офлайн.

Используйте через любые устройства

Мигрируя в веб-приложение, MARP сможет использовать в мобильном устройстве: Android и iOS. Это уверен, что он хорошо подходит для планшетного устройства, как iPad.

Marp Web также будет работать в Chrome OS. У Marp особенно есть много пользователей в области образования, и поддержка Chrome OS, которая имеет большую долю в своей области, имеет смысл.

Прокатный превью в прямом эфире ⚡

Мы думаем, что важной особенностью Марпа является прокатный просмотр в прямом эфире. В веб-приложении осознание одной и той же функции было много трудностей.

В настоящее время опубликовано Tech-Demo, вы можете попробовать действительно быстрый предварительный просмотр MARP в Интернете. Предварительный просмотр применяется, как только печатать, и он не будет блокировать ваше печатание, даже если у вас есть большая отметка на 100 страниц.

Модулизованный MARP Core принес интеграции MARP для некоторых инструментов.

Марп для VS -кода

Честно говоря, я не думаю, что я хочу сделать новый редактор, потому что в мире есть много замечательных редакторов. Я думал, что было бы здорово, если бы Марп мог интегрироваться с чем -то другим мощным редактором Markdown. А теперь Марп может использовать в Visual Studio Code !

Это было реализовано, потому что VS-код использует тот же двигатель разметки (Markdown-IT), что и Marpit Framework. Конечно, вы можете легко экспортировать слайды как PDF и HTML, питаются по Марп CLI Анкет

Marp React & Marp Vue (в разработке)

Благодарный быстрый просмотр Марпа не только для нашего! Мы предоставляем компонент рендеринга марпа в Реагировать и Vue Анкет И MARP React, и Marp Vue поддержали постепенное обновление, используя виртуальный DOM Framework, и их было легко построить ваше приложение.

В частности, Marp React станет на основе будущего Марп Веб Анкет

Настольное приложение (яхта/MSRP)

Если вы используете старое приложение MARP, Вы должны мигрировать, чтобы использовать MARP Next Tools. Я никогда не рекомендую продолжать использовать старую марп, потому что Его обслуживание остановилось 2 года назад, и существует обеспокоенность по поводу проблем безопасности.

В будущем основным интерфейсом станет Марп Веб. У нас есть ставка на технологию PWA, которая имеет много преимуществ. Приложение для настольного компьютера запланировано как «настольный компьютер MARP», но оно может стать оберткой веб -интерфейса.

Я бы прекратил публиковать старую марп и архивировать его репозиторий, если бы Марп Веб стал заменой старой марп.

Ваша слайд -колода

Ваша слайды Markdown, написанные в старом синтаксисе MARP, должны переписать в соответствии с совершенно новой экосистемой MARP.

В новой MARP мы пересмотрели синтаксис Marckdown на основе обратной связи старому приложению MARP. Дело, некоторые синтаксисы теряют совместимость.

Синтаксис

В ядре MARP, не удаленные HTML-элементы отключены по умолчанию из-за причины безопасности. В настоящее время наш белый список включает только элемент. Некоторые MARP Next Tools дали предпочтения для включения HTML, но вы должны позаботиться о том, чтобы включить HTML в ненадлежащей отметки.

Директивы

Директивы будут проанализированы Yaml Parser, настроенным для MARP (MARPIT). Таким образом, Spot Directive Prefix * Изменен на _ Для сохранения синтаксиса YAML.
Размер слайда больше не изменяется по уценке. Так размер Директива тоже удаляется. Вместо этого используйте тему CSS.
page_number Директива переименована в страница Анкет
Шаблон Директива обновляется для использования класс директива. Это может определить класс HTML на слайды.
прерандер Директива удаляется. Это приводит к запуску пользователей по поводу экспортированного качества PDF.

Изображение

Фоновое изображение ! [bg] () не имеет фильтра, применяемый по умолчанию. Попробуйте использовать ! [BG непрозрачность] () Если хочешь.
Встроенное изображение больше не масштабируемо по проценту ! [50%]() . (Это не поддерживается в Firefox) Вместо этого вы можете использовать ширина ( w ) и высота ( w ) Ключевое слово для изменения размера изображения.
! [Центр] () не будет работать. Это требует изменения изображения на элемент блока и приводит путаницу к автору темы. Вы можете настроить стиль, если хотите.

MARP NEXT просто фокусируется на создании экосистемы для слайд -колоды Markdown с чистым открытым исходным кодом. Мы рассчитываем расширить производительность MARP вместе с сообществом с открытым исходным кодом.

Мы все еще стояли в начале совершенно новой экосистемы. Вы заинтересованы в команде Marp и нашей экосистеме? Мы можем начать ваш вклад! Смотрите Наше внесение руководства И начните!

Пса Я начал Patreon и стоял в линии Спонсоры GitHub Анкет Это также хороший вклад, если вы хотите помочь мне работать в открытом исходном коде.

Оригинал: “https://dev.to/yhatt/the-story-of-marp-next-1216”