Wasilisho kama msimbo, au Kwa nini situmii tena Powerpoint

Nadhani nimetoa mawasilisho kadhaa kwa wenzangu, wateja, na kuzungumza hadharani katika taaluma yangu ya IT. Kwa miaka mingi, Powerpoint imekuwa chaguo la kawaida na la kutegemewa kwangu kama zana ya utengenezaji wa slaidi. Lakini mwaka huu hali imebadilika kwa ubora. Kuanzia Februari hadi Mei, nilipata fursa ya kuzungumza kwenye mikutano mitano, na slaidi za ripoti zilipaswa kutayarishwa kwa muda mfupi, lakini kwa ubora wa juu. Swali lilizuka kuhusu kukabidhi sehemu hiyo ya kazi kuhusu muundo wa kuona wa slaidi kwa watu wengine. Nilijaribu kufanya kazi na mbuni, kutuma faili za .pptx kwa barua, lakini kazi iligeuka kuwa machafuko: hakuna mtu aliyejua ni toleo gani la slaidi lilikuwa "mpya zaidi", na mpangilio "ulisonga" kwa sababu ya tofauti ya Powerpoint. matoleo na fonti kwenye mashine zetu. Na niliamua kujaribu kitu kipya. Nilijaribu, na tangu wakati huo sijafikiria kurudi kwenye Powerpoint.

Tunataka nini

Takriban mwaka mmoja na nusu uliopita, kampuni yetu iliacha kutumia Neno kuunda nyaraka za mradi, baada ya kukutana na matatizo yale yale: ingawa Neno ni nzuri kwa kuandika hati ndogo, jinsi kiasi kinakua, shida hutokea kwa ushirikiano na kupata ubora wa juu. muundo wa umoja. Chaguo letu lilianguka Daktari wa Ascii, na hatuacha kamwe kufurahiya uchaguzi huu, lakini hii ni mada ya makala tofauti. Wakati huo huo, tulijifunza ufanisi wa mojawapo ya kanuni za DevOps za "kila kitu kama msimbo", kwa hivyo uchaguzi wa mahitaji ya teknolojia mpya ya kuunda slaidi za uwasilishaji ulikuwa dhahiri kabisa:

1. Wasilisho lazima liwe faili la maandishi wazi katika lugha ya alama.
2. Slaidi zetu zinahusu miradi ya maendeleo, kwa hivyo markup inapaswa kurahisisha kuingiza, bila kutumia mifumo ya nje
   • vipande vya msimbo na mwangaza wa syntax,
   • michoro rahisi katika mfumo wa maumbo ya kijiometri iliyounganishwa na mishale,
   • Michoro ya UML, chati za mtiririko na zaidi.
3. Rasimu ya uwasilishaji lazima ihifadhiwe katika mfumo wa udhibiti wa toleo.
4. Uthibitishaji na mkusanyiko wa slides za kumaliza zinapaswa kufanyika katika mfumo wa CI.

Leo, kuna chaguzi mbili za msingi za kuunda slaidi katika lugha za alama: kifurushi projector kwa LaTeX au mojawapo ya mifumo ya kuunda slaidi kwa kutumia HTML/CSS (FunuaJS, sema, sitaha.js na wengine wengi).

Ingawa roho yangu iko kwenye LaTeX, akili yangu iliamuru kwamba chaguo la suluhisho ambalo singekuwa peke yangu ningetumia linapaswa kuwa upande wa suluhisho linalojulikana kwa duru pana ya watu. Sio kila mtu anayejua LaTeX, na ikiwa mazoezi yako ya kila siku hayahusiani na kuandika nakala za kisayansi, basi hakuna uwezekano wa kuwa na wakati wa kuzama katika ulimwengu mkubwa, ngumu wa mfumo huu.

Walakini, umilisi wa HTML/CSS sio ustadi ulioenea haswa: Mimi, kwa mfano, siko na ujuzi kamili ndani yake. Kwa bahati nzuri, AsciiDoctor anayejulikana tayari anakuja kuwaokoa: kibadilishaji asciidoctor-revealjs hukuruhusu kuunda slaidi za RevealJS kwa kutumia alama ya AsciiDoctor. Na ni rahisi kujifunza na kupatikana kwa kila mtu!

Jinsi ya kuweka msimbo wa slaidi

Ili kuelewa kiini cha slaidi za kuweka alama kwenye AsciiDoctor, njia rahisi ni kutoa mifano maalum. Hizi zote ni kutoka kwa slaidi halisi nilizotengeneza kwa maonyesho yangu ya mkutano mwaka huu.

Slaidi yenye kichwa na orodha katika vipengee vinavyofungua kimoja baada ya kingine:

== Зачем нам Streams API?

[%step]
* Real-time stream processing
* Stream-like API (map / reduce)
* Под капотом:
** Автоматический offset commit
** Ребалансировка
** Внутреннее состояние обработчиков
** Легкое масштабирование

Matokeo

Kichwa na kijisehemu cha msimbo wa chanzo chenye mwangaza wa sintaksia:

== Kafka Streams API: общая структура KStreams-приложения

[source,java]
----
StreamsConfig config = ...;
//Здесь устанавливаем всякие опции

Topology topology = new StreamsBuilder()
//Здесь строим топологию
....build();
----

Matokeo

Katika kujiandaa kwa mazungumzo, onyesho la msimbo husahihishwa na kuboreshwa mara kwa mara, kwa hivyo uwezo wa kunakili na kubandika haraka "msimbo ghafi" moja kwa moja kwenye slaidi ni muhimu sana, kwa kuhakikisha kuwa onyesho ni la kisasa bila kuwa na wasiwasi kuhusu kuangazia sintaksia.

Kichwa, mchoro na maandishi (mpangilio kwenye slaidi hufanywa katika seli Jedwali la AsciiDoctor):

== Kafka Streams in Action

[.custom-style]
[cols="30a,70a"]
|===
|image::KSIA.jpg[]
|
* **William Bejeck**, +
“Kafka Streams in Action”, November 2018
* Примеры кода для Kafka 1.0
|===

Matokeo

Wakati mwingine kichwa hakihitajiki, na ili kuonyesha hoja yako unahitaji tu picha ya skrini nzima:

[%notitle]
== Жить в легаси нелегко

image::swampman.jpg[canvas, size=cover]

Matokeo

Mara nyingi wazo linahitaji kuungwa mkono na mchoro rahisi, katika mfumo wa "mraba uliounganishwa kwa mishale." Kwa bahati nzuri, AsciiDoctor imeunganishwa na mfumo Graphviz — lugha inayokuruhusu kuelezea michoro ya grafu kulingana na maelezo ya wima na miunganisho kati yao. Graphviz inachukua mkondo wa kujifunza, lakini kulingana na mifano iliyotolewa, ni rahisi sana kufanya! Hivi ndivyo inavyoonekana:

== Пишем “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;}
}
-----

Matokeo

Katika kesi wakati ni muhimu kuhariri maelezo juu ya takwimu, kubadilisha mwelekeo wa mshale, nk, hii inaweza kufanyika moja kwa moja katika msimbo wa uwasilishaji, badala ya kurejesha picha mahali fulani na kuiingiza tena kwenye slide. Hii huongeza sana kasi ya kufanya kazi kwenye slaidi.

Mfano ngumu zaidi:

== Невоспроизводимая сборка
[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;}
}
-----

Matokeo

Kwa njia, ni rahisi kujaribu na Graphviz na kurekebisha picha kwenye ukurasa Graphviz mtandaoni.

Hatimaye, ikiwa unahitaji kuingiza chati ya mtiririko, mchoro wa darasa au mchoro mwingine sanifu kwenye slaidi, basi mfumo mwingine uliounganishwa na AsciiDoctor unaweza kukusaidia. PlantUML. Mwenzangu Nikolai Potashnikov aliandika juu ya uwezo mkubwa wa PlantUML chapisho tofauti.

Kugeuza mradi wa uwasilishaji kuwa msimbo uliohifadhiwa kwenye mfumo wa udhibiti wa toleo hufanya iwezekanavyo kupanga kazi ya pamoja kwenye uwasilishaji, kwanza kabisa, kutenganisha kazi za kuunda maudhui na kubuni. Muundo wa slaidi (fonti, usuli, ujongezaji) katika RevealJS unafafanuliwa kwa kutumia CSS. Ustadi wangu wa kibinafsi na CSS unawasilishwa vyema na gif hii - lakini haiogopeshi wakati kuna watu wanaofanya kazi na CSS kwa ustadi zaidi na haraka kuliko mimi. Kwa hivyo, inabadilika kuwa kwa muda wa mwisho unaokaribia kwa kasi wa uwasilishaji, tunaweza kufanya kazi kwenye faili tofauti wakati huo huo kupitia Git na kuendeleza kasi ya ushirikiano ambayo haiwezekani wakati wa kutuma faili za .pptx kwa barua.

Kuunda ukurasa wa HTML na slaidi

Vyanzo vya maandishi wazi ni vyema, lakini unavikusanyaje kwenye wasilisho lenyewe?

AsciiDoctor ni mradi ulioandikwa katika Ruby, na kuna njia kadhaa za kuuendesha. Kwanza, unaweza kufunga lugha ya Ruby na kukimbia asciidoctor moja kwa moja, ambayo labda ni jambo la karibu zaidi kwa watengenezaji wa Ruby.

Ikiwa hutaki kusumbua na kusakinisha Ruby, unaweza kutumia picha ya kizimbani asciidoctor/docker-asciidoctor, ambayo, unapozinduliwa, unaweza kuunganisha folda na vyanzo vya mradi kupitia VOLUME na kupata matokeo katika eneo fulani.

Chaguo nililochagua linaweza kuonekana kuwa lisilotarajiwa, lakini ndilo linalofaa zaidi kwangu kama msanidi programu wa Java. Haihitaji usakinishaji wa Ruby au docker, lakini hukuruhusu kutoa slaidi kwa kutumia hati ya Maven.

Jambo ni kwamba mradi huo JRuby - Utekelezaji wa Java wa lugha ya Ruby ni nzuri sana kwamba inakuwezesha kuendesha karibu kila kitu kilichoundwa kwa Ruby kwenye mashine ya Java, na kuendesha AsciiDoctor ni mojawapo ya matumizi ya kawaida ya JRuby.

upatikanaji asciidoctor-maven-plugin hukuruhusu kukusanya hati za AsciiDoctor ambazo ni sehemu ya mradi wa Java (ambao tunautumia kikamilifu). Wakati huo huo, AsciiDoctor na JRuby hupakuliwa moja kwa moja na Maven, na AsciiDoctor inaendesha katika mazingira ya JRuby: hakuna haja ya kufunga chochote kwenye mashine! (Ukiondoa kifurushi graphviz, ambayo inahitajika ikiwa unataka kutumia michoro ya GraphViz au PlantUML.) Weka kwa urahisi faili zako za .adoc kwenye folda. src/main/asciidoc/. Hapa mfano wa pomnikkukusanya slaidi na michoro.

Badilisha slaidi kuwa PDF

Ingawa toleo la HTML la slaidi linajitosheleza, bado ni muhimu kuwa na toleo la PDF la slaidi. Kwanza, hutokea kwamba katika baadhi ya mikutano ambayo haitoi mzungumzaji fursa ya kuunganisha kompyuta yake ya mkononi, wanahitaji slaidi "madhubuti katika muundo wa pptx au pdf," bila kutarajia kuwa pia wako katika HTML. Pili, ni vyema kuwatumia waandaaji toleo ambalo halijahaririwa la slaidi zako kama zilivyoonyeshwa kwenye ripoti, katika muundo wa PDF ili faili iweze kuchapishwa katika nyenzo za mkutano.

Kwa bahati nzuri, shirika la Node.js linashughulikia kazi hii. staha, iliyojengwa kwa msingi Mwanaharakati - mifumo ya otomatiki ya kudhibiti kivinjari cha Chrome. Unaweza kubadilisha wasilisho la RevealJS kuwa PDF kwa amri

node decktape.js -s 3200x1800 --slides 1-500 
  reveal "file:///index.html?fragments=true" slides.pdf  

Mbinu mbili wakati wa kuzindua deki, ambayo tulilazimika kuja nayo kupitia majaribio na makosa:

• azimio kupitia parameter -s lazima ibainishwe kwa ukingo wa pande mbili, vinginevyo kunaweza kuwa na matatizo na matokeo ya uongofu

• katika URL ya toleo la HTML la wasilisho unahitaji kupitisha kigezo ?fragments=true, ambayo itaunda ukurasa tofauti wa PDF kwa kila hali ya kati ya slaidi yako (kwa mfano, kurasa tano kwa nukta tano za vitone ikiwa zitaonyeshwa moja baada ya nyingine). Hii itakuruhusu kutumia PDF kama hiyo peke yake kama wasilisho wakati wa ripoti.

Kukusanya na kuchapisha kiotomatiki kwenye wavuti

Ni rahisi wakati slaidi zinakusanywa kiotomatiki mabadiliko yanapofanywa kwa mfumo wa udhibiti wa toleo, na hata rahisi zaidi wakati slaidi zilizokusanywa kiotomatiki zinawekwa kwenye Mtandao kwa matumizi ya umma. Slaidi kutoka kwa Mtandao zinaweza "kuchezwa" kwa urahisi mbele ya hadhira kutoka kwa mashine yoyote iliyounganishwa kwenye Mtandao na projekta.

Kwa kuwa tunatumia GitHub katika kazi yetu, chaguo asili la mfumo wa CI ni TravisCI, na kwa ajili ya kukaribisha mawasilisho yaliyo tayari - github.io. Wazo nyuma ya github.io ni kwamba maudhui yoyote tuli yaliyotumwa kwa tawi gh-pages ya mradi wako kwenye GitHub, inapatikana kwa <ваше имя>.gihub.io/<ваш проект>.

Kamilisha faili ya usanidi ya TravisCI, pamoja na kuunda toleo la HTML la ukurasa kwa kutumia Maven, kubadilisha kuwa PDF kwa kutumia deki, na kupakia matokeo kwenye uzi. gh-pages kwa kuchapishwa kwenye github.io, inaonekana kama hivyo.

Ili kujenga mradi kama huo kwa upande wa TravisCI, unahitaji kusanidi anuwai za mazingira

• GH_REF - thamani kama github.com/inponomarev/csa-hb
• GH_TOKEN - Tokeni ya ufikiaji wa GitHub. Unaweza kuipata kutoka kwa GitHub katika mipangilio ya wasifu wako, Mipangilio ya Msanidi Programu -> Ishara za Ufikiaji wa Kibinafsi. Ikiwa unapakia wasilisho kwenye hifadhi ya umma, basi kwa ishara hii inatosha kutaja kiwango cha ufikiaji pekee "Fikia hazina za umma".
• GH_USER_EMAIL / GH_USER_NAME - jozi ya jina/barua pepe kwa niaba ambayo msukumo kwenye uzi utatekelezwa gh-pages.

Kwa hivyo, kila ahadi ya msimbo wa uwasilishaji kwenye GitHub husababisha slaidi kujengwa upya kiotomatiki katika umbizo la HTML na PDF na kupakiwa tena kwa github.io. (Bila shaka, unapaswa kupakia tu kwenye github.io mawasilisho hayo ambayo hatimaye ungependa kuyaweka hadharani.)

Mifano ya miradi

Hatimaye, hapa kuna viungo vya mifano michache ya miradi ya uwasilishaji iliyo na hati za Maven zilizobinafsishwa na usanidi wa CI wa Travis-CI, ambao unaweza kutengenezwa na kutumiwa wakati wa kuunda miradi yako ya uwasilishaji:

• https://github.com/inponomarev/kstreams-examples (mazungumzo yangu ya JPoint 2019)

• https://github.com/inponomarev/csa-hb (ripoti yangu ya Heisenbug 2019)

Kwaheri Powerpoint! Sidhani kama nitakuhitaji kwa mawasilisho ya kiufundi :)

Chanzo: mapenzi.com