Presentasi salaku kode, atanapi Naha kuring henteu deui nganggo Powerpoint

Presentasi salaku kode, atanapi Naha kuring henteu deui nganggo Powerpoint

Kuring pikir kuring parantos masihan puluhan presentasi ka kolega, klien, sareng nyarios umum dina karir IT kuring. Mangtaun-taun, Powerpoint mangrupikeun pilihan anu alami sareng dipercaya pikeun kuring salaku alat produksi slide. Tapi taun ieu kaayaan geus robah qualitatively. Ti Pébruari nepi ka Méi, kuring kungsi kasempetan pikeun nyarita dina lima konferensi, sarta slides pikeun laporan kudu disiapkeun dina waktu anu singget, tapi kalawan kualitas luhur. Patarosan timbul ngeunaan delegasi éta bagian tina karya ngeunaan desain visual tina slides ka jalma séjén. Kuring sakali diusahakeun digawekeun ku desainer, ngirim file .pptx ku mail, tapi karya robah jadi rusuh: teu saurang ogé terang versi slides nu "newest", sarta perenah ieu "pindah" alatan béda dina Powerpoint. versi sareng fon dina mesin kami. Sarta kuring mutuskeun pikeun nyobaan hal anyar. Kuring diusahakeun eta, sarta saprak harita kuring teu mikir ngeunaan balik deui ka Powerpoint.

Naon urang hayang

Kira-kira satengah taun ka tukang, perusahaan urang lirén nganggo Word pikeun nyiptakeun dokuméntasi proyék, ngalaman masalah anu sami: sanaos Word saé pikeun ngetik dokumén leutik, nalika volume naék, kasusah timbul sareng kolaborasi sareng kéngingkeun kualitas luhur sareng desain ngahiji. pilihan urang murag kana AsciiDoctor, sarta kami pernah cease a girang dina pilihan ieu, tapi ieu topik pikeun artikel misah. Dina waktos anu sami, urang diajar efektivitas salah sahiji prinsip DevOps tina "sagala salaku kode", janten pilihan syarat pikeun téknologi anyar pikeun nyiptakeun slide presentasi cukup jelas:

  1. Presentasi kedah janten file téks polos dina basa markup.
  2. Slides kami ngeunaan proyék-proyék pangwangunan, janten markup kedah ngagampangkeun nyelapkeun, tanpa nganggo sistem éksternal
    • fragmen kode kalayan panyorot sintaksis,
    • diagram basajan dina wangun wangun geometri disambungkeun ku panah,
    • diagram UML, diagram alur sareng seueur deui.
  3. Draf presentasi kedah disimpen dina sistem kontrol versi.
  4. Validasi jeung assembly of slides rengse kudu dipigawé dina sistem CI.

Kiwari, aya dua pilihan dasar pikeun nyieun slide dina basa markup: pakét proyektor pikeun LaTeX atawa salah sahiji kerangka pikeun nyieun slide maké HTML/CSS (NyingkabJS, nyarios, deck.js jeung loba batur).

Sanaos jiwa kuring aya dina LaTeX, pikiran kuring didiktekeun yén pilihan solusi anu kuring henteu ngan ukur dianggo kedah aya dina sisi solusi anu akrab pikeun bunderan anu langkung lega. Henteu sadayana terang LaTeX, sareng upami prakték sadinten anjeun henteu aya hubunganana sareng nyerat tulisan ilmiah, maka anjeun henteu mungkin gaduh waktos pikeun neuleumkeun diri dina dunya anu ageung sareng rumit tina sistem ieu.

Sanajan kitu, penguasaan HTML / CSS teu persis skill nyebar: Kuring, contona, jauh ti pinuh mahér dina eta. Untungna, AsciiDoctor geus akrab datang ka nyalametkeun teh: converter a asciidoctor-revealjs ngidinan Anjeun pikeun nyieun RevealJS slides maké markup AsciiDoctor. Sareng éta gampang diajar sareng diaksés ku sadayana!

Kumaha kode slides

Pikeun ngartos hakekat slide coding dina AsciiDoctor, cara anu paling gampang nyaéta masihan conto khusus. Ieu kabeh tina slides sabenerna mah dijieun pikeun presentasi konferensi kuring taun ieu.

Slide kalayan judul sareng daptar item anu muka hiji-hiji:

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

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

hasil

Presentasi salaku kode, atanapi Naha kuring henteu deui nganggo Powerpoint

Header sareng snippet kode sumber sareng panyorot sintaksis:

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

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

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

hasil

Presentasi salaku kode, atanapi Naha kuring henteu deui nganggo Powerpoint

Dina préparasi ceramah, demo kode ngalaman sababaraha révisi sarta perbaikan, jadi kamampuhan pikeun gancang nyalin jeung nempelkeun "kode atah" langsung kana slide hiji invaluable, mastikeun yén demo téh up-to-date tanpa salempang ngeunaan panyorot sintaksis.

Judul, ilustrasi sareng téks (tata letak dina slide dilakukeun dina sél tabél AsciiDoctor):

== Kafka Streams in Action

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

hasil

Presentasi salaku kode, atanapi Naha kuring henteu deui nganggo Powerpoint

Kadang-kadang judul henteu diperyogikeun, sareng pikeun ngagambarkeun titik anjeun anjeun ngan ukur peryogi gambar layar pinuh:

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

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

hasil

Presentasi salaku kode, atanapi Naha kuring henteu deui nganggo Powerpoint

Mindeng hiji gagasan perlu didukung ku diagram basajan, dina bentuk "kuadrat disambungkeun ku panah". Untungna, AsciiDoctor terpadu sareng sistem Graphviz — basa anu ngamungkinkeun anjeun pikeun ngajelaskeun diagram grafik dumasar kana pedaran simpul sareng sambungan antara aranjeunna. Graphviz nyandak kurva diajar, tapi dumasar kana conto anu disayogikeun, éta gampang pisan dilakukeun! Ieu anu katingalina:

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

hasil

Presentasi salaku kode, atanapi Naha kuring henteu deui nganggo Powerpoint

Dina kasus nalika perlu pikeun ngédit caption dina inohong, ngarobah arah panah, jeung sajabana, ieu bisa dipigawé langsung dina kode presentasi, tinimbang redrawing gambar wae jeung reinserting kana slide nu. Ieu nyata ngaronjatkeun kagancangan gawé dina slides.

Hiji conto leuwih pajeulit:

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

hasil

Presentasi salaku kode, atanapi Naha kuring henteu deui nganggo Powerpoint

Ku jalan kitu, éta merenah pikeun ékspérimén kalawan Graphviz na debug gambar dina kaca Graphviz online.

Tungtungna, upami anjeun kedah nyelapkeun diagram alur, diagram kelas atanapi diagram standarisasi anu sanés kana slide, maka sistem anu sanés anu terintegrasi sareng AsciiDoctor tiasa nyalametkeun, PlantUML. Babaturan kuring Nikolai Potashnikov nyerat ngeunaan kamampuan éksténsif PlantUML pos misah.

Ngarobih proyék presentasi kana kode anu disimpen dina sistem kontrol versi ngamungkinkeun pikeun ngatur karya gabungan dina presentasi, mimitina, pikeun misahkeun tugas nyiptakeun kontén sareng desain. Desain slides (fonts, backgrounds, indents) dina RevealJS digambarkeun maké CSS. skill pribadi kuring jeung CSS ieu pangalusna conveyed ku gif ieu - tapi henteu pikasieuneun nalika aya jalma anu damel sareng CSS langkung dexterously sareng langkung gancang tibatan kuring. Hasilna, tétéla yén kalawan deadline gancang approaching pikeun presentasi a, urang tiasa dianggo dina file béda sakaligus via Git sarta ngamekarkeun speed kolaborasi anu teu mungkin mun ngirim file .pptx ku mail.

Ngawangun halaman HTML nganggo slide

Sumber téks polos anu hébat, tapi kumaha anjeun compile kana presentasi sorangan?

AsciiDoctor mangrupikeun proyék anu ditulis dina Ruby, sareng aya sababaraha cara pikeun ngajalankeunana. Mimiti, anjeun tiasa masang basa Ruby sareng ngajalankeun asciidoctor langsung, anu sigana mangrupikeun hal anu paling caket sareng pamekar Ruby.

Upami anjeun henteu hoyong ngaco sareng masang Ruby, anjeun tiasa nganggo gambar docker asciidoctor / docker-asciidoctor, dimana, nalika diluncurkeun, anjeun tiasa nyambungkeun polder sareng sumber proyék ngalangkungan VOLUME sareng kéngingkeun hasilna dina lokasi anu ditangtukeun.

Pilihan anu kuring pilih sigana sigana teu kaduga, tapi éta anu paling cocog pikeun kuring salaku pamekar Java. Teu merlukeun pamasangan Ruby atanapi docker, tapi ngidinan Anjeun pikeun ngahasilkeun slides maké Aksara Maven.

Intina nyaéta yén proyék JRuby - Palaksanaan Java tina basa Ruby téh jadi alus nu ngidinan Anjeun pikeun ngajalankeun ampir nanaon dijieun pikeun Ruby dina mesin Java, tur ngajalankeun AsciiDoctor mangrupakeun salah sahiji pamakéan paling umum tina JRuby.

kasadiaan asciidoctor-maven-plugin ngidinan Anjeun pikeun ngumpulkeun dokuméntasi AsciiDoctor anu mangrupa bagian ti hiji proyék Java (anu aktip kami nganggo). Dina waktos anu sami, AsciiDoctor sareng JRuby diunduh sacara otomatis ku Maven, sareng AsciiDoctor dijalankeun dina lingkungan JRuby: teu aya anu kedah dipasang dina mesin! (Kaasup pakét graphviz, anu diperlukeun upami anjeun hoyong nganggo grafik GraphViz atanapi PlantUML.) Kantun nempatkeun file .adoc anjeun dina polder. src/main/asciidoc/... Ieuh conto pomnikngumpulkeun slides kalawan diagram.

Ngarobih slide ka PDF

Sanajan versi HTML tina slides cukup mandiri, masih perlu boga versi PDF tina slides. Anu mimiti, éta kajadian yén dina sababaraha konperénsi anu henteu masihan panyatur kasempetan pikeun nyambungkeun laptopna nyalira, aranjeunna meryogikeun slide "sacara ketat dina format pptx atanapi pdf," tanpa nyangka yén aranjeunna ogé aya dina HTML. Bréh, éta formulir alus pikeun ngirim panitia versi unedited tina slides anjeun sakumaha ditémbongkeun dina laporan, dina format PDF pikeun publikasi file dina bahan konferensi.

Untungna, utiliti Node.js nanganan tugas ieu. kaset, diwangun dina dasar Dalang - sistem automation pikeun ngatur browser Chrome. Anjeun tiasa ngarobih presentasi RevealJS kana PDF kalayan paréntah

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

Dua trik nalika ngaluncurkeun decktape, anu kedah urang laksanakeun ku trial and error:

  • resolusi ngaliwatan parameter -s kudu dieusian ku margin twofold, disebutkeun meureun aya masalah jeung hasil konversi

  • dina URL versi HTML tina presentasi anjeun kedah lulus parameter ?fragments=true, nu bakal nyieun kaca PDF misah pikeun tiap kaayaan panengah slide Anjeun (contona, lima kaca keur lima titik bullet lamun aranjeunna ditémbongkeun hiji sanggeus lianna). Ieu bakal ngamungkinkeun anjeun nganggo PDF sapertos kitu nyalira salaku presentasi salami laporan.

assembly otomatis tur penerbitan on web

Éta merenah nalika slides disusun sacara otomatis nalika parobahan dijieun kana sistem kontrol versi, komo leuwih merenah lamun slides disusun otomatis dipasang dina Internet pikeun pamakéan umum. Slides ti Internet bisa gampang "diulinkeun" di hareup panongton tina sagala mesin disambungkeun ka Internet sarta projector a.

Kusabab kami nganggo GitHub dina padamelan urang, pilihan alami sistem CI nyaéta TravisCI, sarta pikeun hosting presentasi siap-dijieun - github.io. Gagasan balik github.io nyaéta yén eusi statik anu dipasang dina cabang gh-pages proyék anjeun dina GitHub, sayogi di <ваше имя>.gihub.io/<ваш проект>.

Lengkep file konfigurasi TravisCI, kalebet kompilasi versi HTML halaman nganggo Maven, ngarobih kana PDF nganggo decktape, sareng unggah hasil ka cabang. gh-pages pikeun publikasi dina github.io, Sigana mah janten.

Pikeun ngawangun proyék sapertos di sisi TravisCI, anjeun kedah ngonpigurasikeun variabel lingkungan

  • GH_REF - nilai kawas github.com/inponomarev/csa-hb
  • GH_TOKEN - token aksés GitHub. Anjeun tiasa kéngingkeun tina GitHub dina setélan profil anjeun, Setélan Pangembang -> Token Aksés Pribadi. Upami anjeun unggah presentasi ka gudang umum, maka pikeun token ieu cukup pikeun netepkeun hiji-hijina tingkat aksés "Aksés repositori umum".
  • GH_USER_EMAIL / GH_USER_NAME - pasangan ngaran / email atas nama nu push kana thread bakal dilaksanakeun gh-pages.

Ku kituna, unggal komitmen kode presentasi dina GitHub ngakibatkeun slides otomatis diwangun deui dina format HTML jeung PDF jeung ulang diunggah ka github.io. (Tangtosna, anjeun ngan ukur kedah unggah kana github.io presentasi anu tungtungna anjeun hoyong umumkeun.)

Conto proyék

Tungtungna, ieu aya tautan ka sababaraha conto proyék presentasi kalayan skrip Maven anu disesuaikan sareng konfigurasi CI pikeun Travis-CI, anu tiasa diklon sareng dianggo nalika nyiptakeun proyék presentasi anjeun nyalira:

Wilujeng sumping Powerpoint! Abdi henteu nyangka kuring bakal peryogi anjeun pikeun presentasi téknis :)

sumber: www.habr.com

Tambahkeun komentar