Nire IT karreran lankideei, bezeroei eta jendaurrean hizketan hamaika aurkezpen eman dizkiedala uste dut. Urte askotan, Powerpoint aukera natural eta fidagarria izan da niretzat diapositibak ekoizteko tresna gisa. Baina aurten egoera kualitatiboki aldatu da. Otsailetik maiatzera, bost hitzalditan hitz egiteko aukera izan nuen, eta txostenetarako diapositibak denbora gutxian prestatu behar izan ziren, baina kalitate handiarekin. Galdera sortu zen diapositiben diseinu bisualari buruzko lanaren zati hori beste pertsona batzuen esku uzteari buruz. Behin diseinatzaile batekin lanean saiatu nintzen, .pptx fitxategiak postaz bidaltzen, baina lana kaos bihurtu zen: inork ez zekien diapositiben zein bertsio zen "berriena", eta diseinua "mugitzen" ari zen Powerpoint-en ezberdintasunagatik. bertsioak eta letra tipoak gure makinetan. Eta zerbait berria probatzea erabaki nuen. Probatu nuen, eta ordutik ez dut pentsatu Powerpointera itzultzea.
Zer nahi dugu
Duela urte eta erdi inguru, gure enpresak Word erabiltzeari utzi zion proiektuaren dokumentazioa sortzeko, arazo berdinak aurkitu baitzituzten: Word dokumentu txiki bat idazteko egokia den arren, bolumena hazi ahala, zailtasunak sortzen dira lankidetzarekin eta kalitate handiko eta lortzeko. diseinu bateratua. Gure hautua erori egin zen , eta sekula ez diogu pozten uzten aukera honekin, baina hau aparteko artikulu baterako gaia da. Aldi berean, DevOps printzipioetako baten eraginkortasuna ezagutu genuen "dena kode gisa", beraz, aurkezpen-diapositibak sortzeko teknologia berriaren eskakizunen aukera nahiko nabaria zen:
- Aurkezpenak testu arrunteko fitxategi bat izan behar du markatze-lengoaia batean.
- Gure diapositibak garapen-proiektuei buruzkoak dira, beraz, markaketak erraz txertatu behar du, kanpoko sistemetara jo gabe
- kode-zatiak sintaxia nabarmenduta,
- diagrama sinpleak gezien bidez loturiko forma geometrikoen forman,
- UML diagramak, fluxu-diagramak eta gehiago.
- Aurkezpen zirriborroa bertsio-kontrol sistema batean gorde behar da.
- Amaitutako diapositiben baliozkotzea eta muntatzea CI sisteman egin behar da.
Gaur egun, oinarrizko bi aukera daude diapositibak markatze lengoaietan sortzeko: paketea LaTeX-erako edo HTML/CSS erabiliz diapositibak sortzeko esparruetako bat (, , eta beste asko).
Nire arima LaTeX-en dagoen arren, nire gogoak erabaki zuen nik bakarrik erabiliko ez nukeen irtenbide baten aukerak jende zirkulu zabalago bati ezaguna den irtenbide baten alde egon behar zuela. Denek ez dute LaTeX ezagutzen, eta zure eguneroko jarduna ez badago artikulu zientifikoak idaztearekin lotuta, orduan nekez izango duzu denbora sistema honen mundu korapilatsu eta erraldoian murgiltzeko.
Hala ere, HTML/CSS menperatzea ez da hain hedatuta dagoen trebetasun bat: ni, adibidez, urrun nago horretan guztiz trebetasunetik. Zorionez, dagoeneko ezaguna den AsciiDoctor erreskatatzera dator: bihurgailu bat AsciiDoctor marka erabiliz RevealJS diapositibak sortzeko aukera ematen du. Eta ikasteko erraza da eta guztientzako eskuragarria!
Diapositibak nola kodetu
AsciiDoctor-en diapositibak kodetzearen funtsa ulertzeko, modurik errazena adibide zehatzak ematea da. Hauek guztiak aurten kongresuaren aurkezpenetarako egin ditudan benetako diapositibak dira.
Bata bestearen atzetik irekitzen diren elementuen izenburua eta zerrenda dituen diapositiba bat:
== ΠΠ°ΡΠ΅ΠΌ Π½Π°ΠΌ Streams API?
[%step]
* Real-time stream processing
* Stream-like API (map / reduce)
* ΠΠΎΠ΄ ΠΊΠ°ΠΏΠΎΡΠΎΠΌ:
** ΠΠ²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈΠΉ offset commit
** Π Π΅Π±Π°Π»Π°Π½ΡΠΈΡΠΎΠ²ΠΊΠ°
** ΠΠ½ΡΡΡΠ΅Π½Π½Π΅Π΅ ΡΠΎΡΡΠΎΡΠ½ΠΈΠ΅ ΠΎΠ±ΡΠ°Π±ΠΎΡΡΠΈΠΊΠΎΠ²
** ΠΠ΅Π³ΠΊΠΎΠ΅ ΠΌΠ°ΡΡΡΠ°Π±ΠΈΡΠΎΠ²Π°Π½ΠΈΠ΅Emaitza
Goiburua eta iturburu-kode zatia sintaxia nabarmenduta:
== Kafka Streams API: ΠΎΠ±ΡΠ°Ρ ΡΡΡΡΠΊΡΡΡΠ° KStreams-ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡ
[source,java]
----
StreamsConfig config = ...;
//ΠΠ΄Π΅ΡΡ ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅ΠΌ Π²ΡΡΠΊΠΈΠ΅ ΠΎΠΏΡΠΈΠΈ
Topology topology = new StreamsBuilder()
//ΠΠ΄Π΅ΡΡ ΡΡΡΠΎΠΈΠΌ ΡΠΎΠΏΠΎΠ»ΠΎΠ³ΠΈΡ
....build();
----Emaitza
Hitzaldi baterako prestatzeko, kode-demoek behin eta berriz berrikuspen eta hobekuntzak jasaten dituzte, beraz, "kode gordina" zuzenean diapositiba batean azkar kopiatu eta itsatsi ahal izatea ezinbestekoa da, demoa eguneratuta dagoela ziurtatuz sintaxia nabarmentzeaz kezkatu gabe.
Izenburua, ilustrazioa eta testua (diapositibako diseinua gelaxkatan egiten da ):
== Kafka Streams in Action
[.custom-style]
[cols="30a,70a"]
|===
|image::KSIA.jpg[]
|
* **William Bejeck**, +
βKafka Streams in Actionβ, November 2018
* ΠΡΠΈΠΌΠ΅ΡΡ ΠΊΠΎΠ΄Π° Π΄Π»Ρ Kafka 1.0
|===Emaitza
Batzuetan ez da titulurik behar, eta zure iritzia ilustratzeko pantaila osoko irudia besterik ez duzu behar:
[%notitle]
== ΠΠΈΡΡ Π² Π»Π΅Π³Π°ΡΠΈ Π½Π΅Π»Π΅Π³ΠΊΠΎ
image::swampman.jpg[canvas, size=cover]Emaitza
Askotan ideia bat diagrama sinple baten bidez lagundu behar da, "gezien bidez konektatutako karratuen" forman. Zorionez, AsciiDoctor sistemarekin integratuta dago β Diagrama grafikoak deskribatzeko aukera ematen duen lengoaia, erpinen deskribapenean eta haien arteko konexioetan oinarrituta. Graphviz-ek ikasteko kurba hartzen du, baina emandako adibideetan oinarrituta, nahiko erraza da egitea! Honela dirudi:
== ΠΠΈΡΠ΅ΠΌ β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;}
}
-----Emaitza
Irudiaren epigrafea editatu, geziaren norabidea eta abar aldatu behar denean, aurkezpen-kodean zuzenean egin daiteke, irudia nonbait berriro marraztu eta diapositiban berriro sartu beharrean. Horrek nabarmen handitzen du diapositibetan lan egiteko abiadura.
Adibide konplikatuagoa:
== ΠΠ΅Π²ΠΎΡΠΏΡΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΠΌΠ°Ρ ΡΠ±ΠΎΡΠΊΠ°
[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;}
}
-----Emaitza
Bide batez, komenigarria da Graphviz-ekin esperimentatzea eta orrialdeko irudiak araztea .
Azkenik, diapositiba batean fluxu-diagrama, klase-diagrama edo beste diagrama estandarizatu bat txertatu behar baduzu, AsciiDoctor-ekin integratutako beste sistema bat erreskatatu daiteke, . Nire lankide Nikolai Potashnikov-ek PlantUMLren gaitasun zabalei buruz idatzi zuen .
Aurkezpen-proiektua bertsio-kontrol-sistema batean gordetako kode bilakatzeak aukera ematen du aurkezpenaren lan bateratua antolatzea, lehenik eta behin, edukia eta diseinua sortzeko zereginak bereizteko. RevealJS-en diapositiben diseinua (letra-tipoak, atzeko planoak, koskak) CSS erabiliz deskribatzen da. CSS-rekin dudan trebetasun pertsonala ondoen transmititzen du - baina ez da beldurgarria CSSarekin ni baino askoz ere trebeago eta azkarrago lan egiten duen jendea dagoenean. Ondorioz, ematen da aurkezpen bat egiteko epea azkar hurbiltzen ari denean, Git bidez fitxategi desberdinak aldi berean lan egin ditzakegula eta .pptx fitxategiak postaz bidaltzean ezinezkoa den lankidetza-abiadura garatu.
HTML orri bat diapositibekin eraikitzea
Testu arrunteko iturriak bikainak dira, baina nola biltzen dituzu aurkezpenean bertan?
AsciiDoctor Ruby-n idatzitako proiektua da, eta exekutatzeko hainbat modu daude. Lehenik eta behin, Ruby hizkuntza instalatu eta zuzenean asciidoctor exekutatu dezakezu, hau da, ziurrenik, Ruby garatzaileengandik hurbilen dagoena.
Ruby instalatzearekin nahastu nahi ez baduzu, docker irudia erabil dezakezu , eta bertan, abiarazitakoan, karpeta proiektuaren iturriekin konekta dezakezu BOLUMENaren bidez eta emaitza toki jakin batean lor dezakezu.
Aukeratu dudan aukera ezusteko samarra dirudi, baina niretzat erosoena da Java garatzaile gisa. Ez du Ruby edo docker instalatu behar, baina Maven script bat erabiliz diapositibak sortzeko aukera ematen du.
Kontua da proiektua - Ruby hizkuntzaren Java inplementazioa hain da ona, non Rubyrentzat sortutako ia edozein gauza exekutatzeko aukera ematen baitu Java makina batean, eta AsciiDoctor exekutatzen JRuby-ren erabilera ohikoenetako bat da.
erabilgarritasuna Java proiektu baten parte den AsciiDoctor dokumentazioa biltzeko aukera ematen du (aktiboki erabiltzen duguna). Aldi berean, AsciiDoctor eta JRuby automatikoki deskargatzen ditu Mavenek, eta AsciiDoctor JRuby ingurunean exekutatzen da: ez dago makinan ezer instalatu beharrik! (Paketea kenduta graphviz, beharrezkoa da GraphViz edo PlantUML grafikoak erabili nahi badituzu.) Jarri zure .adoc fitxategiak karpeta batean. src/main/asciidoc/. hemen Diapositibak eskemekin biltzea.
Bihurtu diapositibak PDFra
Diapositiben HTML bertsioa nahiko autosufizientea bada ere, oraindik beharrezkoa da diapositiben PDF bertsioa izatea. Lehenik eta behin, gertatzen da hizlariari bere ordenagailu eramangarria konektatzeko aukera ematen ez dioten hitzaldi batzuetan, diapositibak βzorrotz pptx edo pdf formatuanβ eskatzen dituztela, HTMLan ere egotea espero gabe. Bigarrenik, egokia da antolatzaileei zure diapositiben bertsio editatu gabeko bat bidaltzea txostenean erakutsi ziren moduan, PDF formatuan fitxategia kongresuko materialetan argitaratzeko.
Zorionez, Node.js utilitateak kudeatzen du zeregin hau. , oinarrian eraikia β Chrome arakatzailea kudeatzeko automatizazio-sistemak. RevealJS aurkezpena PDF bihur dezakezu komandoarekin
node decktape.js -s 3200x1800 --slides 1-500
reveal "file:///index.html?fragments=true" slides.pdf Decktape abiarazteko bi trikimailu, saiakeraren bidez asmatu behar izan genituenak:
-
parametro bidezko ebazpena
-smarjina bikoitz batekin zehaztu behar da, bestela arazoak egon daitezke bihurketa-emaitzetan -
aurkezpenaren HTML bertsioaren URLan parametro bat pasatu behar duzu
?fragments=true, eta horrek PDF orri bat sortuko du zure diapositibaren tarteko egoera bakoitzerako (adibidez, bost orri bost buletetarako, bata bestearen atzetik erakusten badira). Horri esker, horrelako PDF bat bere kabuz erabili ahal izango duzu txosten batean aurkezpen gisa.
Muntaketa automatikoa eta sarean argitaratzea
Erosoa da diapositibak automatikoki konpilatzen direnean bertsioak kontrolatzeko sisteman aldaketak egiten direnean, eta are erosoagoa automatikoki konpilatutako diapositibak Interneten erabilera publikorako argitaratzen direnean. Interneteko diapositibak erraz "erreproduzitu" daitezke ikusleen aurrean Internetera konektatutako edozein makinatik eta proiektore batetik.
Gure lanean GitHub erabiltzen dugunez, CI sistema baten aukera naturala da , eta prest egindako aurkezpenak antolatzeko - . Github.ioren atzean dagoen ideia da edozein eduki estatiko adar batean argitaratzen dela gh-pages zure proiektuaren GitHub-en eskuragarri dago hemen <Π²Π°ΡΠ΅ ΠΈΠΌΡ>.gihub.io/<Π²Π°Ρ ΠΏΡΠΎΠ΅ΠΊΡ>.
TravisCI konfigurazio fitxategi osoa, orriaren HTML bertsioa Maven erabiliz konpilatzea barne, PDF bihurtzea decktape erabiliz eta emaitzak hari batera kargatzea. gh-pages github.io-n argitaratzeko, antza .
TravisCI aldean horrelako proiektu bat eraikitzeko, ingurune-aldagaiak konfiguratu behar dituzu
GH_REFβ github.com/inponomarev/csa-hb bezalako balioaGH_TOKENβ GitHub sarbide-tokena. GitHub-etik lor dezakezu zure profilaren ezarpenetan, Garatzaileen ezarpenetan -> Sarbide pertsonaleko tokenetan. Aurkezpen bat biltegi publiko batera kargatzen baduzu, token honetarako nahikoa da sarbide-maila bakarra zehaztea "Sartu biltegi publikoetan".GH_USER_EMAIL/GH_USER_NAMEβ izena/posta elektroniko bikotea zeinaren izenean harirako bultzada egingo dengh-pages.
Horrela, GitHub-en aurkezpen-kodearen konpromiso bakoitzak diapositibak automatikoki berreraiki egiten ditu HTML eta PDF formatuetan eta github.io-ra berriro kargatzen dira. (Noski, github.io-ra soilik igo behar dituzu azkenean publiko egin nahi dituzun aurkezpenak.)
Proiektuen adibideak
Azkenik, hona hemen Maven script pertsonalizatuak eta Travis-CIrako CI konfigurazioa duten aurkezpen-proiektuen adibide pare batzuetarako estekak, zure aurkezpen-proiektuak sortzerakoan klonatu eta erabil daitezkeenak:
-
(JPoint 2019rako nire hitzaldia)
-
(Heisenbug 2019rako nire txostena)
Agur Powerpoint! Ez dut uste aurkezpen teknikoetarako inoiz beharko zaitudanik :)
Iturria: www.habr.com