Кодери, ето инструмент за презентация на JavaScript, който ще ви хареса

Една от задачите ми в работата ми е да разработвам и поддържам технически презентации. В миналото съхранявах тези презентации в Google Drive във формат Keynote на Apple. Keynote, подобно на много приложения за офис пакети, съхранява своите файлове като големи дебели двоични петна. Когато множество хора модифицират презентация и се опитват да я актуализират, получавате проблеми. Хората мълчаливо се измъкват от промените.

Това раздразнение не е уникално за Keynote. PowerPoint и други формати страдат от същия проблем. Въпреки че PowerPoint теоретично има XML-базиран файл, той е увит в Zip, така че няма практичен начин за обединяване на промените на ниво файл.

Друг проблем с Keynote е, че докато има главни слайдове, нещата, които се поставят в слайд, трябва да бъдат внимателно форматирани. WYSIWIG е страхотен и ужасен едновременно. Нещата, които се поставят в слайд, трябва да бъдат форматирани с любов. Това обикновено означава, че докато главният шаблон е последователен, съдържанието често се различава във формат: разстоянието е малко по-малко, изборът на шрифтове не е подходящ и цветовете стават диви.

В идеалния свят ще съхранявате презентации в GitHub точно като код и ще пишете презентации в опростен формат като Markdown, без да се налага да знаете стила. Човекът с потребителски интерфейс / марка или момче може да направи всички „хубави неща“ отпред в CSS, докато вие се опитвате да философствате в маркираната си проза.

Точно това ви позволява инструментът за слайдшоу в браузъра с отворен код Remark.js. 

Забележителни технически презентации

С Remark.js имате един HTML файл и колкото и CSS файлове, но презентацията ви е отделна в вкус на Markdown. Можете да съхранявате всичко в GitHub. Има дори режим на презентатор, който ви позволява да виждате бележките си, докато аудиторията гледа вашите брилянтни визуализации.

Както подсказва името, Remark.js е JavaScript библиотека. Както всяка библиотека на JavaScript, има около 50 алтернативни реализации. Най-впечатляващото за мен визуално е Reveal.js.

Докато Remark.js ви позволява да пишете изцяло в Markdown с пръски от HTML или разширения, Reveal.js ви кара да научите HTML. Казвам, че познавам HTML в автобиографията си от 90-те години, но точно като знам как да използвам четка за рисуване: и с двете правя грозни неща. Ето защо предпочитам да използвам Remark.js.

Ето текста на Markdown и слайда за действителен слайд от една от моите презентации:

—-

class: left, top

# Fusion Concepts: Collection

* Contains documents

* Associated with actual indexed data and schema

* Associated with a named configuration in Zookeeper

* Logical index that can be spread across multiple servers

* Routing strategy that defines how documents get assigned to shards replica placement strategy that defines how many copies to keep of each document in the collections

* A collection as it exists on an instance of Solr is called a “Core”

???

Script: In short a collection is a logical index that is tied to a whole lot of configuration and process management in the cluster, including how it is configured, replicated, and routed.

—-

Ето как изглежда това на моя телефон (което между другото мога да Chromecast):

Андрю С. Оливър

Ето режима на водещ! Мога да настроя слайдовете си нагоре, за да мога да чета екрана си като телесуптер (всъщност не го правя, защото това би ми отегчило):

Андрю С. Оливър

Когато клонирате презентация, прозорците на браузъра се синхронизират, дори ако влезете в режим на презентатор на една. Вашата аудитория вижда изгледа на първата екранна снимка. Виждате гледката във втория.

Лошите неща

Remark.js далеч не е перфектен. Страхотно е за технически хора, които правят технически презентации, но не бих подлагал екипа по продажбите на това. Ако имате акаунт в GitHub, вероятно ви е по-удобно Markdown, отколкото непостоянния WYSIWYG редактор на PowerPoint или Keynote. Ако четете имейла си с желание в Outlook, вероятно няма да ви хареса.

За да използвате това, ви е необходим локален уеб сървър като Python SimpleHTTPServer. Препоръчвам също да отидете с Chrome. Firefox излезе от синхрон, ако щракнах наоколо. Изгледът на презентатора е полезен, но няма изглед на миниатюри за хора, които много се движат напред-назад между слайдовете.

Ако организирате презентациите си като отделни файлове, трябва да пренастроите и да въведете отново режим на презентация за всеки един. Снимките и слайдовете на заглавията може да изискват настройка на CSS, за да се получи правилно. Всеки код, който не избягате с „backtics, ще бъде изкривен (особено регулярният израз). Също така трябва да промените CSS, за да направите правилното подреждане на печат в PDF.

След като го разберете и свършите CSS, сравнителните усилия за създаване на „още една“ презентация в Remark.J / Markdown са по-ниски от тези на PowerPoint или Keynote. Управлението на версии в GitHub е монументално по-добро и знанието, че мога да представя от телефона или таблета си ме радва. Следващият път, когато организирате конференция и осъзнаете, че всичките ви материали са върнати към предишни версии, може би помислете за Remark.js.