Mendoj se kam dhënë dhjetëra prezantime për kolegët, klientët dhe fjalimet publike në karrierën time në IT. Për shumë vite, Powerpoint ka qenë një zgjedhje e natyrshme dhe e besueshme për mua si një mjet për prodhimin e diapozitivëve. Por këtë vit situata ka ndryshuar cilësisht. Nga shkurti deri në maj pata mundësinë të flas në pesë konferenca dhe sllajdet për raportet duhej të përgatiteshin brenda një kohe të shkurtër, por me cilësi të lartë. U ngrit pyetja për delegimin e asaj pjese të punës në lidhje me dizajnin vizual të diapozitivëve te njerëzit e tjerë. Një herë u përpoqa të punoja me një projektues, duke dërguar skedarë .pptx me postë, por puna u shndërrua në kaos: askush nuk e dinte se cili version i diapozitivëve ishte "më i riu" dhe faqosja po "lëvizte" për shkak të ndryshimit në Powerpoint versionet dhe shkronjat në makinat tona. Dhe vendosa të provoj diçka të re. E provova dhe që atëherë nuk kam menduar të kthehem në Powerpoint.
çfarë duam ne
Rreth një vit e gjysmë më parë, kompania jonë ndaloi përdorimin e Word-it për të krijuar dokumentacionin e projektit, pasi u përball me të njëjtat probleme: megjithëse Word është i mirë për të shtypur një dokument të vogël, ndërsa vëllimi rritet, lindin vështirësi me bashkëpunimin dhe marrjen e cilësisë dhe cilësisë së lartë dhe dizajn të unifikuar. Zgjedhja jonë ra , dhe ne nuk pushojmë së gëzuari për këtë zgjedhje, por kjo është një temë për një artikull të veçantë. Përafërsisht në të njëjtën kohë, mësuam efektivitetin e një prej parimeve të DevOps të "çdo gjë si kod", kështu që zgjedhja e kërkesave për teknologjinë e re për krijimin e sllajdeve të prezantimit ishte mjaft e qartë:
- Prezantimi duhet të jetë një skedar teksti i thjeshtë në një gjuhë shënjimi.
- Sllajdet tona kanë të bëjnë me projektet e zhvillimit, kështu që shënimi duhet ta bëjë të lehtë futjen, pa përdorur sisteme të jashtme
- fragmente kodi me theksim sintaksor,
- diagrame të thjeshta në formën e formave gjeometrike të lidhura me shigjeta,
- Diagramet UML, diagramet e rrjedhës dhe më shumë.
- Drafti i prezantimit duhet të ruhet në një sistem kontrolli të versionit.
- Validimi dhe montimi i rrëshqitjeve të përfunduara duhet të bëhet në një sistem CI.
Sot, ekzistojnë dy opsione bazë për krijimin e rrëshqitjeve në gjuhët e shënjimit: paketa për LaTeX ose një nga kornizat për krijimin e sllajdeve duke përdorur HTML/CSS (, , dhe shume te tjere).
Megjithëse shpirti im qëndron në LaTeX, mendja ime diktoi që zgjedhja e një zgjidhjeje që nuk do të isha e vetmja që do ta përdorja, duhej të ishte në anën e një zgjidhjeje të njohur për një rreth më të gjerë njerëzish. Jo të gjithë e dinë LaTeX, dhe nëse praktika juaj e përditshme nuk lidhet me shkrimin e artikujve shkencorë, atëherë nuk ka gjasa të keni kohë për t'u zhytur në botën e madhe dhe të ndërlikuar të këtij sistemi.
Megjithatë, zotërimi i HTML/CSS nuk është saktësisht një aftësi e përhapur: unë, për shembull, nuk jam plotësisht i aftë në të. Për fat të mirë, AsciiDoctor tashmë i njohur vjen në shpëtim: një konvertues ju lejon të krijoni rrëshqitje RevealJS duke përdorur shënimin e AsciiDoctor. Dhe është e lehtë për t'u mësuar dhe e arritshme për të gjithë!
Si të kodoni sllajdet
Për të kuptuar thelbin e sllajdeve të kodimit në AsciiDoctor, mënyra më e lehtë është të jepni shembuj specifikë. Këto janë të gjitha nga sllajdet aktuale që kam bërë për prezantimet e mia në konferencë këtë vit.
Një rrëshqitje me një titull dhe një listë në artikujt që hapen njëri pas tjetrit:
== Зачем нам Streams API?
[%step]
* Real-time stream processing
* Stream-like API (map / reduce)
* Под капотом:
** Автоматический offset commit
** Ребалансировка
** Внутреннее состояние обработчиков
** Легкое масштабированиеResult
Titulli dhe fragmenti i kodit burimor me theksim të sintaksës:
== Kafka Streams API: общая структура KStreams-приложения
[source,java]
----
StreamsConfig config = ...;
//Здесь устанавливаем всякие опции
Topology topology = new StreamsBuilder()
//Здесь строим топологию
....build();
----Result
Në përgatitje për një fjalim, demonstrimet e kodit i nënshtrohen rishikimeve dhe përmirësimeve të përsëritura, kështu që aftësia për të kopjuar dhe ngjitur shpejt "kodin e papërpunuar" drejtpërdrejt në një rrëshqitje është e paçmueshme, duke siguruar që demonstrimi të jetë i përditësuar pa u shqetësuar për theksimin e sintaksës.
Titulli, ilustrimi dhe teksti (paraqitja në rrëshqitje bëhet në qeliza ):
== Kafka Streams in Action
[.custom-style]
[cols="30a,70a"]
|===
|image::KSIA.jpg[]
|
* **William Bejeck**, +
“Kafka Streams in Action”, November 2018
* Примеры кода для Kafka 1.0
|===Result
Ndonjëherë një titull nuk është i nevojshëm dhe për të ilustruar mendimin tuaj ju duhet vetëm një imazh në ekran të plotë:
[%notitle]
== Жить в легаси нелегко
image::swampman.jpg[canvas, size=cover]Result
Shpesh një ide duhet të mbështetet nga një diagram i thjeshtë, në formën e "kuadrateve të lidhura me shigjeta". Për fat të mirë, AsciiDoctor është i integruar me sistemin — një gjuhë që ju lejon të përshkruani diagramet grafike bazuar në përshkrimin e kulmeve dhe lidhjet ndërmjet tyre. Graphviz merr një kurbë mësimi, por bazuar në shembujt e dhënë, është shumë e lehtë për t'u bërë! Kështu duket:
== Пишем “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;}
}
-----Result
Në rastin kur është e nevojshme të redaktoni titullin në figurë, të ndryshoni drejtimin e shigjetës, etj., kjo mund të bëhet drejtpërdrejt në kodin e prezantimit, në vend që ta rivizatoni figurën diku dhe ta rifusni atë në rrëshqitje. Kjo rrit ndjeshëm shpejtësinë e punës në rrëshqitje.
Një shembull më i ndërlikuar:
== Невоспроизводимая сборка
[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;}
}
-----Result
Nga rruga, është e përshtatshme të eksperimentosh me Graphviz dhe të korrigjosh imazhet në faqe .
Së fundi, nëse keni nevojë të futni një diagram rrjedhash, diagram klasë ose diagram tjetër të standardizuar në një rrëshqitje, atëherë një sistem tjetër i integruar me AsciiDoctor mund të vijë në shpëtim. . Kolegu im Nikolai Potashnikov shkroi për aftësitë e gjera të PlantUML .
Shndërrimi i projektit të prezantimit në kod të ruajtur në një sistem të kontrollit të versionit bën të mundur organizimin e punës së përbashkët në prezantim, para së gjithash, për të ndarë detyrat e krijimit të përmbajtjes dhe dizajnit. Dizajni i rrëshqitjeve (fontet, sfondet, indencat) në RevealJS përshkruhet duke përdorur CSS. Shkathtësia ime personale me CSS përcillet më së miri nga - por nuk është e frikshme kur ka njerëz që punojnë me CSS shumë më me shkathtësi dhe më shpejt se unë. Si rezultat, rezulton se me një afat që afrohet me shpejtësi për një prezantim, ne mund të punojmë në skedarë të ndryshëm njëkohësisht përmes Git dhe të zhvillojmë një shpejtësi bashkëpunimi që është e pamundur kur dërgojmë skedarë .pptx me postë.
Ndërtimi i një faqe HTML me rrëshqitje
Burimet e tekstit të thjeshtë janë të shkëlqyera, por si i përpiloni ato në vetë prezantimin?
AsciiDoctor është një projekt i shkruar në Ruby, dhe ka disa mënyra për ta ekzekutuar atë. Së pari, mund të instaloni gjuhën Ruby dhe të ekzekutoni drejtpërdrejt asciidoctor, që është ndoshta gjëja më e afërt me zhvilluesit e Ruby.
Nëse nuk doni të ngatërroni me instalimin e Ruby, mund të përdorni imazhin e dokerit , në të cilin, kur të lansohet, mund të lidhni dosjen me burimet e projektit nëpërmjet VOLUME dhe të merrni rezultatin në një vendndodhje të caktuar.
Opsioni që zgjodha mund të duket disi i papritur, por është më i përshtatshmi për mua si zhvillues Java. Nuk kërkon instalimin e Ruby ose docker, por ju lejon të gjeneroni rrëshqitje duke përdorur një skript Maven.
Çështja është se projekti - Implementimi Java i gjuhës Ruby është aq i mirë sa ju lejon të ekzekutoni pothuajse çdo gjë të krijuar për Ruby në një makinë Java dhe ekzekutimi i AsciiDoctor është një nga përdorimet më të zakonshme të JRuby.
Disponueshmëria ju lejon të mbledhni dokumentacionin AsciiDoctor që është pjesë e një projekti Java (të cilin ne e përdorim në mënyrë aktive). Në të njëjtën kohë, AsciiDoctor dhe JRuby shkarkohen automatikisht nga Maven, dhe AsciiDoctor funksionon në mjedisin JRuby: nuk ka nevojë të instaloni asgjë në makinë! (Me përjashtim të paketës graphviz, e cila është e nevojshme nëse dëshironi të përdorni graphViz ose PlantUML.) Thjesht vendosni skedarët tuaj .adoc në një dosje src/main/asciidoc/. këtu mbledhja e sllajdeve me diagrame.
Konvertoni rrëshqitjet në PDF
Edhe pse versioni HTML i sllajdeve është mjaft i vetë-mjaftueshëm, është ende e nevojshme të kemi një version PDF të sllajdeve. Së pari, ndodh që në disa konferenca që nuk i japin folësit mundësinë për të lidhur laptopin e tij, ato kërkojnë rrëshqitje "rreptësisht në format pptx ose pdf", pa pritur që ato të jenë edhe në HTML. Së dyti, është mirë t'u dërgoni organizatorëve një version të pa redaktuar të sllajdeve tuaja siç u shfaqën në raport, në formatin PDF për publikimin e skedarit në materialet e konferencës.
Për fat të mirë, mjeti Node.js trajton këtë detyrë. , e ndërtuar mbi bazën — sistemet e automatizimit për menaxhimin e shfletuesit Chrome. Ju mund ta konvertoni prezantimin RevealJS në PDF me komandën
node decktape.js -s 3200x1800 --slides 1-500
reveal "file:///index.html?fragments=true" slides.pdf Dy truke kur lëshonim kasetë, të cilat na u desh të gjenim përmes provës dhe gabimit:
-
rezolucioni me anë të parametrave
-sduhet të specifikohet me një diferencë të dyfishtë, përndryshe mund të ketë probleme me rezultatet e konvertimit -
në URL-në e versionit HTML të prezantimit ju duhet të kaloni një parametër
?fragments=true, e cila do të krijojë një faqe të veçantë PDF për çdo gjendje të ndërmjetme të rrëshqitjes tuaj (për shembull, pesë faqe për pesë pika nëse ato shfaqen njëra pas tjetrës). Kjo do t'ju lejojë të përdorni një PDF të tillë më vete si një prezantim gjatë një raporti.
Montimi dhe publikimi automatik në ueb
Është i përshtatshëm kur sllajdet përpilohen automatikisht kur bëhen ndryshime në sistemin e kontrollit të versionit, dhe akoma më i përshtatshëm kur sllajdet e përpiluara automatikisht postohen në internet për përdorim publik. Sllajdet nga Interneti mund të "luhen" lehtësisht para një auditori nga çdo makinë e lidhur me internetin dhe një projektor.
Meqenëse ne përdorim GitHub në punën tonë, zgjedhja e natyrshme e një sistemi CI është , dhe për pritjen e prezantimeve të gatshme - . Ideja prapa github.io është që çdo përmbajtje statike të postohet në një degë gh-pages i projektit tuaj në GitHub, bëhet i disponueshëm në <ваше имя>.gihub.io/<ваш проект>.
Plotësoni skedarin e konfigurimit TravisCI, duke përfshirë përpilimin e versionit HTML të faqes duke përdorur Maven, konvertimin në PDF duke përdorur decktape dhe ngarkimin e rezultateve në një thread gh-pages për publikim në github.io, duket si .
Për të ndërtuar një projekt të tillë në anën TravisCI, duhet të konfiguroni variablat e mjedisit
GH_REF— vlerë si github.com/inponomarev/csa-hbGH_TOKEN— Shenja e hyrjes në GitHub. Mund ta merrni nga GitHub në cilësimet e profilit tuaj, Cilësimet e zhvilluesit -> Shenjat e hyrjes personale. Nëse ngarkoni një prezantim në një depo publike, atëherë për këtë shenjë mjafton të specifikoni nivelin e vetëm të aksesit "Qasni në depot publike".GH_USER_EMAIL/GH_USER_NAME— çifti emër/email në emër të të cilit do të kryhet shtytja në fillgh-pages.
Kështu, çdo kryerje e kodit të prezantimit në GitHub rezulton në rindërtimin automatik të rrëshqitjeve në formatet HTML dhe PDF dhe ri-ngarkuar në github.io. (Sigurisht, duhet të ngarkoni në github.io vetëm ato prezantime që në fund të fundit dëshironi t'i bëni publike.)
Shembuj të projekteve
Më në fund, këtu janë lidhjet me disa shembuj të projekteve të prezantimit me skriptet e personalizuara Maven dhe konfigurimin CI për Travis-CI, të cilat mund të klonohen dhe përdoren kur krijoni projektet tuaja të prezantimit:
-
(Biseda ime për JPoint 2019)
-
(raporti im për Heisenbug 2019)
Mirupafshim Powerpoint! Nuk mendoj se do të më duhesh ndonjëherë për prezantime teknike :)
Burimi: www.habr.com