Arvan, et olen oma IT-karjääri jooksul pidanud kümneid ettekandeid kolleegidele, klientidele ja avalikult esinenud. Powerpoint on olnud minu jaoks juba aastaid loomulik ja usaldusväärne valik slaidide valmistamise tööriistana. Kuid sel aastal on olukord kvalitatiivselt muutunud. Veebruarist maini oli mul võimalus esineda viiel konverentsil ning ettekannete slaidid pidid valmima lühikese ajaga, kuid kvaliteetselt. Tekkis küsimus slaidide visuaalse kujundusega seotud töö selle osa delegeerimisest teistele inimestele. Kunagi proovisin töötada disaineriga, saates .pptx-faile posti teel, kuid töö muutus kaoseks: keegi ei teadnud, milline slaidide versioon on “uusim” ja küljendus “nihkus” Powerpointi erinevuse tõttu. versioonid ja fondid meie masinates. Ja otsustasin proovida midagi uut. Proovisin seda ja pärast seda pole ma mõelnud Powerpointi naasmisele.
Mida me tahame
Umbes poolteist aastat tagasi lõpetas meie ettevõte Wordi kasutamise projektidokumentatsiooni koostamiseks, olles kokku puutunud samade probleemidega: kuigi Word sobib hästi väikese dokumendi tippimiseks, tekivad mahu kasvades raskused koostööga ning kvaliteetsete ja kvaliteetsete dokumentide hankimisega. ühtne disain. Meie valik langes edasi , ja me ei lakka selle valiku üle rõõmustamast, kuid see on eraldi artikli teema. Umbes samal ajal õppisime ühe DevOpsi põhimõtte „kõik kui kood“ tõhusust, nii et uue esitlusslaidide loomise tehnoloogia nõuete valik oli üsna ilmne:
- Esitlus peab olema märgistuskeeles lihttekstifail.
- Meie slaidid käsitlevad arendusprojekte, nii et märgistus peaks hõlbustama sisestamist ilma väliseid süsteeme kasutamata
- koodifragmendid süntaksi esiletõstmisega,
- lihtsad diagrammid geomeetriliste kujundite kujul, mis on ühendatud nooltega,
- UML-diagrammid, vooskeemid ja palju muud.
- Esitluse mustand tuleb salvestada versioonihaldussüsteemi.
- Valmis slaidide valideerimine ja kokkupanek tuleks teha CI-süsteemis.
Tänapäeval on märgistuskeeltes slaidide loomiseks kaks põhilist võimalust: pakett LaTeX-i või mõne raamistiku jaoks slaidide loomiseks HTML/CSS-i abil (, , ja paljud teised).
Kuigi mu hing peitub LaTeXis, dikteeris mu mõistus, et valik lahendust, mida ma ainsana ei kasutaks, peaks olema laiemale ringile tuttava lahenduse poolel. Mitte igaüks ei tea LaTeX-i ja kui teie igapäevane praktika pole seotud teadusartiklite kirjutamisega, pole teil tõenäoliselt aega selle süsteemi tohutusse ja keerukasse maailma sukelduda.
HTML/CSS-i valdamine ei ole aga just laialt levinud oskus: mina näiteks pole selles veel kaugeltki päris valdav. Õnneks tuleb appi juba tuttav AsciiDoctor: konverter võimaldab luua RevealJS-i slaide, kasutades AsciiDoctori märgistust. Ja seda on lihtne õppida ja see on kõigile kättesaadav!
Kuidas slaide kodeerida
AsciiDoctori slaidide kodeerimise olemuse mõistmiseks on lihtsaim viis tuua konkreetsed näited. Need kõik pärinevad tegelikelt slaididelt, mille tegin oma selle aasta konverentsiettekannete jaoks.
Slaid pealkirjaga ja üksteise järel avanevate üksuste loend:
== Зачем нам Streams API?
[%step]
* Real-time stream processing
* Stream-like API (map / reduce)
* Под капотом:
** Автоматический offset commit
** Ребалансировка
** Внутреннее состояние обработчиков
** Легкое масштабированиеTulemus
Päis ja lähtekoodilõik koos süntaksi esiletõstmisega:
== Kafka Streams API: общая структура KStreams-приложения
[source,java]
----
StreamsConfig config = ...;
//Здесь устанавливаем всякие опции
Topology topology = new StreamsBuilder()
//Здесь строим топологию
....build();
----Tulemus
Ettekande ettevalmistamisel tehakse koodidemosid korduvalt muudatusi ja täiustusi, nii et võimalus kiiresti kopeerida ja kleepida "tooreskood" otse slaidile on hindamatu, tagades demo ajakohasuse, ilma süntaksi esiletõstmiseta muretsemata.
Pealkiri, illustratsioon ja tekst (paigutus slaidil tehakse lahtrites ):
== Kafka Streams in Action
[.custom-style]
[cols="30a,70a"]
|===
|image::KSIA.jpg[]
|
* **William Bejeck**, +
“Kafka Streams in Action”, November 2018
* Примеры кода для Kafka 1.0
|===Tulemus
Mõnikord pole pealkirja vaja ja oma mõtte illustreerimiseks vajate lihtsalt täisekraanipilti:
[%notitle]
== Жить в легаси нелегко
image::swampman.jpg[canvas, size=cover]Tulemus
Sageli tuleb ideed toetada lihtsa diagrammiga, mis on "nooltega ühendatud ruutude" kujul. Õnneks on AsciiDoctor süsteemiga integreeritud — keel, mis võimaldab kirjeldada graafikuid tippude ja nendevaheliste seoste kirjelduse põhjal. Graphviz võtab õppimiskõvera, kuid esitatud näidete põhjal on seda üsna lihtne teha! See näeb välja selline:
== Пишем “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;}
}
-----Tulemus
Juhul, kui on vaja redigeerida joonisel olevat pealkirja, muuta noole suunda vms, saab seda teha otse esitluskoodis, selle asemel, et pilt kuhugi ümber joonistada ja uuesti slaidile sisestada. See suurendab oluliselt slaididega töötamise kiirust.
Keerulisem näide:
== Невоспроизводимая сборка
[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;}
}
-----Tulemus
Muide, Graphviziga on mugav katsetada ja lehel olevaid pilte siluda .
Lõpuks, kui teil on vaja slaidile sisestada vooskeemi, klassidiagrammi või muu standardskeemi, võib appi tulla mõni muu AsciiDoctoriga integreeritud süsteem, . Mu kolleeg Nikolai Potašnikov kirjutas PlantUMLi ulatuslikest võimalustest .
Esitlusprojekti muutmine versioonihaldussüsteemi salvestatud koodiks võimaldab korraldada ühistööd esitluse kallal, ennekõike eraldada sisu loomise ja kujunduse ülesanded. RevealJS-i slaidide (fondid, taustad, taanded) kujundust kirjeldatakse CSS-i abil. Minu isiklikke oskusi CSS-iga annab kõige paremini edasi - aga see pole hirmutav, kui on inimesi, kes töötavad CSS-iga palju osavamalt ja kiiremini kui mina. Selle tulemusena selgub, et kiirelt läheneva esitluse tähtajaga saame Giti kaudu korraga erinevate failidega töötada ja arendada koostöökiirust, mis .pptx failide posti teel saatmisel on võimatu.
Slaididega HTML-lehe loomine
Lihtteksti allikad on suurepärased, kuid kuidas neid esitlusse koondada?
AsciiDoctor on Ruby keeles kirjutatud projekt ja selle käivitamiseks on mitu võimalust. Esiteks saate installida Ruby keele ja käivitada otse asciidoctori, mis on Ruby arendajatele ilmselt kõige lähedasem.
Kui te ei soovi Ruby installimisega segadusse ajada, võite kasutada dokkimispilti , millesse käivitamisel saab VOLUME kaudu ühendada kausta projekti allikatega ja saada tulemuse antud asukohas.
Valik, mille valisin, võib tunduda mõnevõrra ootamatu, kuid mulle kui Java arendajale on see kõige mugavam. See ei nõua Ruby või dockeri installimist, kuid võimaldab teil luua slaide Maveni skripti abil.
Asi on selles, et projekt - Ruby keele Java juurutus on nii hea, et võimaldab Java masinas käivitada peaaegu kõike, mis Ruby jaoks loodud, ja AsciiDoctori käivitamine on JRuby üks levinumaid kasutusviise.
kättesaadavus võimaldab teil koguda AsciiDoctori dokumentatsiooni, mis on osa Java projektist (mida me aktiivselt kasutame). Samal ajal laadib AsciiDoctor ja JRuby automaatselt Maveni alla ning AsciiDoctor jookseb JRuby keskkonnas: masinasse pole vaja midagi installida! (Välja arvatud pakett graphviz, mida on vaja, kui soovite kasutada GraphVizi või PlantUML-i graafikat.) Asetage oma .adoc-failid lihtsalt kausta src/main/asciidoc/. Siin slaidide kogumine diagrammidega.
Teisendage slaidid PDF-vormingusse
Kuigi slaidide HTML-versioon on üsna isemajandav, on slaidide PDF-versioon siiski vajalik. Esiteks juhtub, et mõnel konverentsil, mis ei paku kõnelejale võimalust oma sülearvutit ühendada, nõuavad nad slaide "rangelt pptx- või pdf-vormingus", eeldamata, et need on ka HTML-vormingus. Teiseks on hea vorm saata korraldajatele oma slaidide redigeerimata versioon aruandes näidatud kujul PDF-vormingus faili avaldamiseks konverentsi materjalides.
Õnneks saab selle ülesandega hakkama utiliit Node.js. alusel ehitatud — automaatikasüsteemid Chrome'i brauseri haldamiseks. Saate teisendada RevealJS-i esitluse PDF-iks käsuga
node decktape.js -s 3200x1800 --slides 1-500
reveal "file:///index.html?fragments=true" slides.pdf Decktape'i käivitamisel kaks nippi, mille pidime katse-eksituse meetodil välja mõtlema:
-
eraldusvõime parameetri kaudu
-stuleb määrata kahekordse varuga, vastasel juhul võib teisendustulemustega probleeme tekkida -
esitluse HTML-versiooni URL-is peate edastama parameetri
?fragments=true, mis loob teie slaidi iga vaheoleku jaoks eraldi PDF-lehe (näiteks viis lehekülge viie täpi jaoks, kui neid kuvatakse üksteise järel). See võimaldab teil kasutada sellist PDF-faili eraldi esitlusena aruande ajal.
Automaatne kokkupanek ja avaldamine veebis
See on mugav, kui slaidid kompileeritakse automaatselt, kui versioonikontrollisüsteemis tehakse muudatusi, ja veelgi mugavam, kui automaatselt koostatud slaidid postitatakse Internetti avalikuks kasutamiseks. Internetist pärit slaide saab hõlpsasti publiku ees “mängida” igast internetti ühendatud masinast ja projektorist.
Kuna kasutame oma töös GitHubi, on CI-süsteemi loomulik valik ja valmis esitluste korraldamiseks - . Github.io idee seisneb selles, et mis tahes staatiline sisu postitatakse harusse gh-pages teie projekti GitHubis, muutub kättesaadavaks aadressil <ваше имя>.gihub.io/<ваш проект>.
TravisCI konfiguratsioonifaili lõpuleviimine, sealhulgas lehe HTML-versiooni koostamine Maveni abil, PDF-i teisendamine decktape'i abil ja tulemuste lõime üleslaadimine gh-pages github.io avaldamiseks näeb välja selline .
Sellise projekti ehitamiseks TravisCI poolel tuleb seadistada keskkonnamuutujad
GH_REF— väärtus nagu github.com/inponomarev/csa-hbGH_TOKEN- GitHubi juurdepääsuluba. Saate selle hankida GitHubist oma profiili seadetes Arendaja seaded -> Isiklikud juurdepääsumärgid. Kui laadite esitluse üles avalikku hoidlasse, siis piisab selle loa jaoks ainsa juurdepääsutaseme määramisest "Juurdepääs avalikele hoidlatele".GH_USER_EMAIL/GH_USER_NAME— nimi/e-posti paar, mille nimel lõimele tõuge tehaksegh-pages.
Seega iga GitHubi esitluskoodi sisestamise tulemuseks on slaidide automaatne ümberehitamine HTML- ja PDF-vormingus ning uuesti saidile github.io üleslaadimine. (Loomulikult peaksite saidile github.io üles laadima ainult need esitlused, mille soovite lõpuks avalikustada.)
Näited projektidest
Lõpuks on siin lingid paarile näitele esitlusprojektidest, mis sisaldavad kohandatud Maveni skripte ja Travis-CI jaoks mõeldud CI konfiguratsiooni, mida saab kloonida ja kasutada oma esitlusprojektide loomisel:
-
(minu jutt JPoint 2019 jaoks)
-
(minu aruanne Heisenbugi 2019 kohta)
Hüvasti Powerpoint! Ma arvan, et ma ei vaja sind kunagi tehniliste esitluste jaoks :)
Allikas: www.habr.com