Pensu chì aghju datu decine di presentazioni à i culleghi, i clienti, è di parlà in publicu in a mo carriera IT. Per parechji anni, Powerpoint hè stata una scelta naturale è affidabile per mè cum'è strumentu di produzzione di slide. Ma questu annu a situazione hà cambiatu qualitativamente. Da ferraghju à maghju, aghju avutu l'uppurtunità di parlà in cinque cunferenze, è i slides per i rapporti anu da esse preparatu in pocu tempu, ma cù alta qualità. A quistione hè stata di delegate quella parte di u travagliu in quantu à u disignu visuale di i slides à l'altri populi. Una volta aghju pruvatu à travaglià cù un designer, mandendu i fugliali .pptx per mail, ma u travagliu hè diventatu u caosu: nimu ùn sapia chì versione di i slides era a "più nova", è u layout era "move" per via di a diferenza in Powerpoint. versioni è fonti nantu à e nostre macchine. È decisu di pruvà qualcosa di novu. Aghju pruvatu, è da tandu ùn aghju micca pensatu à vultà in Powerpoint.
Chì vulemu
Circa un annu è mezu fà, a nostra sucietà hà cessatu di utilizà Word per creà documentazioni di u prugettu, avè scontru i stessi prublemi: ancu s'ellu Word hè bonu per scrive un picculu documentu, cum'è u voluminu cresce, i difficultà nascenu cù a cullaburazione è l'ottenimentu di alta qualità è disignu unificatu. A nostra scelta hè cascata , è ùn cessemu mai di rallegra di sta scelta, ma questu hè un tema per un articulu separatu. In u stessu tempu, avemu amparatu l'efficacità di unu di i principii DevOps di "tuttu cum'è codice", cusì l'scelta di esigenze per a nova tecnulugia per a creazione di diapositive di presentazione era abbastanza ovvia:
- A presentazione deve esse un schedariu di testu chjaru in una lingua di marcatura.
- I nostri diapositive sò nantu à prughjetti di sviluppu, cusì u marcatu duverebbe fà fà più faciule d'inserisce, senza ricorrere à sistemi esterni
- frammenti di codice cù evidenziazione di sintassi,
- diagrammi simplici in forma di forme geometriche cunnesse da frecce,
- Diagrammi UML, diagrammi di flussu è più.
- U prugettu di presentazione deve esse guardatu in un sistema di cuntrollu di versione.
- A validazione è l'assemblea di diapositive finite deve esse fattu in un sistema CI.
Oghje, ci sò duie opzioni basiche per creà slides in linguaggi di marcatura: package per LaTeX o unu di i quadri per creà diapositive cù HTML / CSS (, , è tanti altri).
Ancu s'è a mo ànima si trova in LaTeX, a mo mente dettava chì l'scelta di una suluzione chì ùn saria micca l'unicu chì usu deve esse da u latu di una suluzione familiar à un circulu più largu di persone. Micca tutti cunnosci LaTeX, è se a vostra pratica di ogni ghjornu ùn hè micca ligata à scrive articuli scientifichi, allora hè improbabile di avè u tempu di immerse in u mondu enormu è intricatu di stu sistema.
In ogni casu, a maestria di HTML / CSS ùn hè micca esattamente una cumpetenza diffusa: I, per esempiu, sò luntanu da esse cumplettamente prufessore in questu. Fortunatamente, l'AsciiDoctor, digià famusu, vene in salvezza: un convertitore permette di creà diapositive RevealJS cù marcatura AsciiDoctor. È hè faciule d'amparà è accessibile à tutti!
Cumu codificà i slides
Per capisce l'essenza di i slides di codificazione in AsciiDoctor, u modu più faciule hè di dà esempi specifichi. Quessi sò tutti da diapositive reali chì aghju fattu per e mo presentazioni di cunferenza questu annu.
Una diapositiva cù un titulu è una lista di elementi chì si aprenu unu dopu à l'altru:
== Зачем нам Streams API?
[%step]
* Real-time stream processing
* Stream-like API (map / reduce)
* Под капотом:
** Автоматический offset commit
** Ребалансировка
** Внутреннее состояние обработчиков
** Легкое масштабированиеrisultatu
Intestazione è snippet di codice fonte cù evidenziazione di sintassi:
== Kafka Streams API: общая структура KStreams-приложения
[source,java]
----
StreamsConfig config = ...;
//Здесь устанавливаем всякие опции
Topology topology = new StreamsBuilder()
//Здесь строим топологию
....build();
----risultatu
In preparazione per una discussione, i demo di codice sò sottumessi à rivisioni è miglioramenti ripetuti, cusì l'abilità di copià è incollà rapidamente u "codice crudu" direttamente in una diapositiva hè inestimabile, assicurendu chì a demo hè aghjurnata senza preoccupassi di l'evidenziazione di sintassi.
Titulu, illustrazione è testu (a disposizione nantu à a diapositiva hè fatta in cellule ):
== Kafka Streams in Action
[.custom-style]
[cols="30a,70a"]
|===
|image::KSIA.jpg[]
|
* **William Bejeck**, +
“Kafka Streams in Action”, November 2018
* Примеры кода для Kafka 1.0
|===risultatu
A volte un tìtulu ùn hè micca necessariu, è per illustrà u vostru puntu, avete solu bisognu di una maghjina full-screen:
[%notitle]
== Жить в легаси нелегко
image::swampman.jpg[canvas, size=cover]risultatu
Spessu una idea deve esse sustinuta da un diagramma simplice, in forma di "quadre cunnessi da frecce". Fortunatamente, AsciiDoctor hè integratu cù u sistema - una lingua chì vi permette di discrive diagrammi di gràficu basatu nantu à a descrizzione di i vertici è e cunnessione trà elli. Graphviz piglia una curva di apprendimentu, ma basatu annantu à l'esempii furniti, hè abbastanza faciule da fà! Questu hè ciò chì pare:
== Пишем “Bet Totalling App”
Какова сумма выплат по сделанным ставкам, если сыграет исход?
[graphviz, "counting-topology.png"]
-----
digraph G {
graph [ dpi = 150 ];
rankdir="LR";
node [fontsize=18; shape="circle"; fixedsize="true"; width="1.1"];
Store [shape="cylinder"; label="Local Store"; fixedsize="true"; width="1.5"]
Source -> MapVal -> Sum -> Sink
Sum -> Store [dir=both; label=" n "]
{rank = same; Store; Sum;}
}
-----risultatu
In u casu, quandu hè necessariu di edità a didascalia nantu à a figura, cambià a direzzione di a freccia, etc., questu pò esse fattu direttamente in u codice di presentazione, invece di redrawing the picture somewhere and reinserting it into the slide. Questu aumenta significativamente a velocità di travaglià nantu à i slides.
Un esempiu più cumplicatu:
== Невоспроизводимая сборка
[graphviz, "unstable-update.png"]
-----
digraph G {
rankdir="LR";
graph [ dpi = 150 ];
u -> r0;
u[shape=plaintext; label="linter updaten+ 13 warnings"]
r0[shape=point, width = 0]
r1 -> r0[ arrowhead = none, label="master branch" ];
r0-> r2 []; b1 -> b4; r1->b1
r1[label="150nwarnings"]
b1[label="± 0nwarnings"]
b4[label="± 0nwarnings"]
b4->r2
r2[label="163nwarnings", color="red", xlabel=<<font color="red">merge blocked</font>>]
{rank = same; u; r0; b4;}
}
-----risultatu
Per via, hè cunvenutu per sperimentà Graphviz è debug images in a pagina .
Infine, se avete bisognu di inserisce un diagramma di flussu, un diagramma di classi o un altru diagramma standardizatu in una diapositiva, allora un altru sistema integratu cù AsciiDoctor pò vene in salvezza, . U mo cumpagnu Nikolai Potashnikov hà scrittu annantu à e capacità estensive di PlantUML .
Trasfurmà u prughjettu di presentazione in codice almacenatu in un sistema di cuntrollu di versione permette di urganizà u travagliu cumunu nantu à a presentazione, prima di tuttu, per separà i travaglii di creazione di cuntenutu è disignu. U disignu di diapositive (fonts, sfondi, indentazioni) in RevealJS hè descrittu cù CSS. A mo cumpetenza persunale cù CSS hè megliu trasmessa da - ma ùn hè micca paura quandu ci sò persone chì travaglianu cù CSS assai più destre è più veloce chè mè. In u risultatu, si trova chì cù una data di scadenza chì si avvicina rapidamente per una presentazione, pudemu travaglià nantu à diversi schedari simultaneamente via Git è sviluppà una veloce di cullaburazione chì hè impussibile quandu invià i schedari .pptx per mail.
Custruì una pagina HTML cù slides
I fonti di testu chjaru sò grandi, ma cumu si cumpilà in a presentazione stessu?
AsciiDoctor hè un prughjettu scrittu in Ruby, è ci sò parechje manere di eseguisce. Prima, pudete installà a lingua Ruby è eseguisce asciidoctor direttamente, chì hè probabilmente u più vicinu à i sviluppatori Ruby.
Se ùn vulete micca mess with installing Ruby, pudete aduprà l'imagine docker , in quale, quandu lanciatu, pudete cunnette u cartulare cù e fonti di u prughjettu via VOLUME è uttene u risultatu in un locu determinatu.
L'opzione ch'e aghju sceltu pò esse un pocu inespettata, ma hè a più còmuda per mè cum'è sviluppatore Java. Ùn hè micca bisognu di l'installazione di Ruby o docker, ma permette di generà diapositive cù un script Maven.
U puntu hè chì u prugettu - L'implementazione Java di a lingua Ruby hè cusì bona chì vi permette di eseguisce quasi tuttu ciò chì hè creatu per Ruby in una macchina Java, è eseguisce AsciiDoctor hè unu di l'usi più cumuni di JRuby.
dispunibilità permette di cullà a documentazione AsciiDoctor chì face parte di un prughjettu Java (chì avemu attivamente utilizatu). À u listessu tempu, AsciiDoctor è JRuby sò scaricati automaticamente da Maven, è AsciiDoctor funziona in l'ambiente JRuby: ùn ci hè bisognu di stallà nunda in a macchina! (Esclusu u pacchettu graphviz, chì hè necessariu se vulete usà gràfiche GraphViz o PlantUML.) Simply place your .adoc files in a folder. src/main/asciidoc/. Quì cullezzione di diapositive cù diagrammi.
Cunvertisce diapositive in PDF
Ancu se a versione HTML di e diapositive hè abbastanza autosufficiente, hè sempre necessariu avè una versione PDF di e diapositive. Prima, succede chì in certi cunferenze chì ùn furnisce micca u parlante l'uppurtunità di cunnette u so propiu laptop, necessitanu diapositive "strictamente in formatu pptx o pdf", senza aspittà chì sò ancu in HTML. Siconda, hè una bona forma di mandà à l'urganizatori una versione inedita di e vostre diapositive cume sò state mostrate in u rapportu, in formatu PDF per a publicazione di u schedariu in i materiali di cunferenza.
Fortunatamente, l'utilità Node.js gestisce stu compitu. , custruitu nantu à a basa - sistemi d'automatizazione per a gestione di u navigatore Chrome. Pudete cunvertisce a presentazione RevealJS in PDF cù u cumandimu
node decktape.js -s 3200x1800 --slides 1-500
reveal "file:///index.html?fragments=true" slides.pdf Dui trucchi per u lanciamentu di u decktape, chì avemu avutu da vene cù prova è errore:
-
risoluzione via paràmetru
-sdeve esse specificatu cù un margine duppiu, altrimenti ci ponu esse prublemi cù i risultati di cunversione -
in l'URL di a versione HTML di a presentazione avete bisognu di passà un paràmetru
?fragments=true, chì creà una pagina PDF separata per ogni statu intermediu di a vostra diapositiva (per esempiu, cinque pagine per cinque punti bullet si sò mostrati unu dopu à l'altru). Questu permetterà di utilizà un tali PDF per sè stessu cum'è una presentazione durante un rapportu.
Assemblea automatica è publicazione in u web
Hè cunvene quandu i slides sò compilati automaticamente quandu i cambiamenti sò fatti à u sistema di cuntrollu di versione, è ancu più còmuda quandu i slides compilati automaticamente sò publicati in Internet per l'usu publicu. I diapositive da Internet ponu esse facilmente "ghjucate" davanti à un publicu da ogni macchina cunnessa à Internet è un projector.
Siccomu usemu GitHub in u nostru travagliu, l'scelta naturali di un sistema CI hè , è per accoglie presentazioni pronti - . L'idea di github.io hè chì qualsiasi cuntenutu staticu publicatu in una filiera gh-pages di u vostru prughjettu nantu à GitHub, diventa dispunibule à <ваше имя>.gihub.io/<ваш проект>.
U schedariu di cunfigurazione di TravisCI cumpletu, cumprese a compilazione di a versione HTML di a pagina cù Maven, a cunversione in PDF cù u decktape, è a carica di i risultati in un filu. gh-pages per a publicazione in github.io, pare .
Per custruisce un tali prughjettu nantu à u latu TravisCI, avete bisognu di cunfigurà variabili di l'ambiente
GH_REF- valore cum'è github.com/inponomarev/csa-hbGH_TOKEN- Token di accessu à GitHub. Pudete ottene da GitHub in i vostri paràmetri di prufilu, Configurazione di Sviluppatore -> Tokens d'accessu persunale. Se caricate una presentazione à un repository publicu, allora per questu token hè abbastanza per specificà u solu livellu d'accessu "Access repository public".GH_USER_EMAIL/GH_USER_NAME- coppia nome / email in nome di quale a spinta à u filu serà realizatugh-pages.
Cusì, ogni impegnu di u codice di presentazione in GitHub si traduce in chì e diapositive sò automaticamente ricustruite in formati HTML è PDF è ricaricate in github.io. (Di sicuru, duvete carricà solu in github.io quelle presentazioni chì in fine vulete rende publicu.)
Esempii di prughjetti
Infine, quì sò ligami per un paru di esempi di prughjetti di presentazione cù scripts Maven persunalizati è cunfigurazione CI per Travis-CI, chì ponu esse clonati è utilizati quandu creanu i vostri prughjetti di presentazione:
-
(a mo discussione per JPoint 2019)
-
(u mo rapportu per Heisenbug 2019)
Addio Powerpoint! Pensu chì ùn aghju mai bisognu di voi per presentazioni tecniche :)
Source: www.habr.com