ڪوڊ جي طور تي پيش ڪرڻ، يا ڇو مان هاڻي پاور پوائنٽ استعمال نٿو ڪريان

مان سمجهان ٿو ته مون پنهنجي آئي ٽي ڪيريئر ۾ ساٿين، گراهڪن، ۽ عوامي ڳالهائڻ لاءِ درجنين پيشيون ڏنيون آهن. ڪيترن ئي سالن کان، پاور پوائنٽ منهنجي لاءِ هڪ قدرتي ۽ قابل اعتماد پسند رهيو آهي هڪ سلائيڊ پيداواري اوزار جي طور تي. پر هن سال صورتحال ڪيفيت ۾ تبديل ٿي وئي آهي. فيبروري کان مئي تائين، مون کي پنجن ڪانفرنسن ۾ ڳالهائڻ جو موقعو مليو، ۽ رپورٽن لاءِ سلائيڊون ٿوري وقت ۾ تيار ڪرڻيون هيون، پر اعليٰ معيار سان. سوال پيدا ٿيو ته ڪم جو حصو ٻين ماڻهن ڏانهن سلائڊ جي بصري ڊيزائن جي حوالي سان. مون هڪ دفعو هڪ ڊزائنر سان ڪم ڪرڻ جي ڪوشش ڪئي، ميل ذريعي .pptx فائلون موڪلڻ، پر ڪم افراتفري ۾ تبديل ٿي ويو: ڪنهن کي به خبر نه هئي ته سلائيڊ جو ڪهڙو نسخو "نئين" آهي، ۽ پاور پوائنٽ ۾ فرق جي ڪري ترتيب "هلندڙ" هئي. اسان جي مشينن تي ورجن ۽ فونٽ. ۽ مون فيصلو ڪيو ته ڪجهه نئين ڪوشش ڪرڻ جي. مون ان جي ڪوشش ڪئي، ۽ ان کان پوء مون پاور پوائنٽ ڏانهن واپس وڃڻ بابت نه سوچيو آهي.

اسان ڇا ٿا چاهيون

اٽڪل ڏيڍ سال اڳ، اسان جي ڪمپني پروجيڪٽ ڊاڪيومينٽيشن ٺاهڻ لاءِ Word استعمال ڪرڻ بند ڪري ڇڏيو، ساڳين ئي مسئلن کي منهن ڏيڻو پيو: جيتوڻيڪ Word هڪ ننڍڙو ڊاڪيومينٽ ٽائپ ڪرڻ لاءِ سٺو آهي، جيئن حجم وڌندو وڃي، تعاون سان مشڪلاتون پيدا ٿين ٿيون ۽ اعليٰ معيار حاصل ڪرڻ ۽ متحد ڊيزائن. اسان جي پسند تي اچي ويو AsciiDoctor، ۽ اسان ڪڏهن به هن چونڊ تي خوش ٿيڻ کان روڪي نه سگهندا آهيون، پر اهو هڪ الڳ مضمون لاءِ موضوع آهي. ساڳئي وقت، اسان "ڪوڊ جي طور تي هر شي" جي DevOps اصولن مان هڪ جي اثرائتي سکيا، تنهنڪري پريزنٽيشن سلائيڊ ٺاهڻ لاء نئين ٽيڪنالاجي جي گهرج جي چونڊ بلڪل واضح هئي:

1. پريزنٽيشن کي مارڪ اپ ٻولي ۾ هڪ سادي ٽيڪسٽ فائل هجڻ گهرجي.
2. اسان جون سلائڊون ڊولپمينٽ پروجيڪٽس جي باري ۾ آهن، تنهنڪري مارڪ اپ کي ان کي داخل ڪرڻ آسان بنائڻ گهرجي، بغير ڪنهن خارجي سسٽم کي استعمال ڪرڻ جي
   • نحو نمايان ڪرڻ سان ڪوڊ جا ٽڪرا،
   • تيرن سان جڙيل جاميٽري شڪلن جي شڪل ۾ سادي ڊراگرام،
   • UML ڊراگرام، فلو چارٽس ۽ وڌيڪ.
3. پيشڪش جو مسودو لازمي طور تي ورزن ڪنٽرول سسٽم ۾ محفوظ ڪيو وڃي.
4. ختم ٿيل سلائڊ جي تصديق ۽ اسيمبلي کي سي آء سسٽم ۾ ڪيو وڃي.

اڄ، مارڪ اپ ٻولين ۾ سلائڊ ٺاهڻ لاءِ ٻه بنيادي آپشن آھن: پيڪيج بيامر LaTeX لاءِ يا HTML/CSS استعمال ڪندي سلائيڊ ٺاهڻ لاءِ فريم ورڪ مان هڪ (پڌرو, تبصرو, deck.js ۽ ٻيا ڪيترائي).

جيتوڻيڪ منهنجو روح LaTeX ۾ آهي، منهنجي ذهن اهو طئي ڪيو ته هڪ حل جو انتخاب جيڪو آئون اڪيلو استعمال نه ڪندس، ماڻهن جي وسيع دائري کان واقف حل جي پاسي هجڻ گهرجي. هرڪو نه ڄاڻي ٿو LaTeX، ۽ جيڪڏهن توهان جو روزانه مشق سائنسي مضمونن لکڻ سان لاڳاپيل ناهي، ته پوءِ توهان وٽ ممڪن ناهي ته توهان پاڻ کي هن نظام جي وڏي، پيچيده دنيا ۾ غرق ڪرڻ جو وقت ڏيو.

بهرحال، HTML/CSS جي مهارت بلڪل وسيع مهارت نه آهي: مان، مثال طور، ان ۾ مڪمل مهارت کان پري آهيان. خوش قسمتي سان، اڳ ۾ ئي واقف AsciiDoctor اچي ٿو بچاء: هڪ ڪنورٽر asciidoctor- ظاهر ڪرڻ توهان کي AsciiDoctor مارڪ اپ استعمال ڪندي RevealJS سلائيڊ ٺاهڻ جي اجازت ڏئي ٿي. ۽ اهو سکڻ آسان آهي ۽ هر ڪنهن تائين رسائي آهي!

سلائڊ کي ڪيئن ڪوڊ ڪجي

AsciiDoctor تي ڪوڊنگ سلائيڊس جي جوهر کي سمجهڻ لاءِ، آسان طريقو اهو آهي ته مخصوص مثال ڏيو. اهي سڀ حقيقي سلائڊن مان آهن جيڪي مون هن سال ڪانفرنس جي پيشڪش لاءِ ڪيون آهن.

ھڪڙي سلائڊ ھڪڙي عنوان سان ۽ ھڪڙي فهرست ۾ ھڪڙي ھڪڙي ھڪڙي کان پوء کولڻ ۾:

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

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

نتيجي ۾

نحو نمايان ڪرڻ سان هيڊر ۽ ماخذ ڪوڊ جو ٽڪرو:

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

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

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

نتيجي ۾

هڪ ڳالهه ٻولهه جي تياري ۾، ڪوڊ ڊيمو بار بار ترميمن ۽ سڌارن مان گذري ٿو، تنهن ڪري جلدي ڪاپي ۽ پيسٽ ڪرڻ جي صلاحيت “خام ڪوڊ” کي سڌو سلائڊ ۾ پيسٽ ڪرڻ انمول آهي، انهي ڳالهه کي يقيني بڻائڻ ته ڊيمو تازه ترين آهي بغير نحو جي نمايان ڪرڻ بابت پريشان ٿيڻ جي.

عنوان، مثال ۽ متن (سلائڊ تي ترتيب سيلز ۾ ڪيو ويندو آهي AsciiDoctor ٽيبل):

== Kafka Streams in Action

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

نتيجي ۾

ڪڏهن ڪڏهن عنوان جي ضرورت ناهي، ۽ توهان جي نقطي کي بيان ڪرڻ لاء توهان کي صرف هڪ مڪمل اسڪرين تصوير جي ضرورت آهي:

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

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

نتيجي ۾

گهڻو ڪري هڪ خيال کي "تير سان ڳنڍيل چورس" جي صورت ۾، هڪ سادي ڊراگرام جي حمايت ڪرڻ جي ضرورت آهي. خوش قسمت، AsciiDoctor سسٽم سان ضم ٿي ويو آهي گرافڪس - هڪ ٻولي جيڪا توهان کي وضاحت ڪرڻ جي اجازت ڏئي ٿي گراف ڊاگرامس جي وضاحت جي بنياد تي انهن جي وچ ۾ ڪنيڪشن ۽ ڪنيڪشن. Graphviz هڪ سکيا وارو وکر وٺندو آهي، پر مهيا ڪيل مثالن جي بنياد تي، اهو ڪرڻ بلڪل آسان آهي! اھو اھو آھي جيڪو ڏسڻ ۾ اچي ٿو:

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

نتيجي ۾

ان صورت ۾ جڏهن تصوير تي ڪيپشن کي ايڊٽ ڪرڻ، تير جي سمت کي تبديل ڪرڻ وغيره ضروري هجي، اهو سڌو سنئون پريزنٽيشن ڪوڊ ۾ ڪري سگهجي ٿو، بجاءِ تصوير کي ڪنهن جاءِ تي ريڊر ڪرڻ ۽ ان کي سلائڊ ۾ داخل ڪرڻ جي. اهو خاص طور تي سلائڊ تي ڪم ڪرڻ جي رفتار کي وڌائي ٿو.

هڪ وڌيڪ پيچيده مثال:

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

نتيجي ۾

رستي جي ذريعي، گرافويز سان تجربو ڪرڻ ۽ صفحي تي تصويرون ڊيبگ ڪرڻ آسان آهي Graphviz آن لائن.

آخرڪار، جيڪڏهن توهان کي سلائڊ ۾ فلو چارٽ، ڪلاس ڊاگرام يا ٻيو معياري آريگرام داخل ڪرڻ جي ضرورت آهي، ته پوءِ AsciiDoctor سان ضم ٿيل هڪ ٻيو نظام بچائي سگهي ٿو، پلانٽ يو ايم ايل. منهنجو ساٿي Nikolai Potashnikov PlantUML جي وسيع صلاحيتن جي باري ۾ لکيو. الڳ پوسٽ.

پريزنٽيشن پروجيڪٽ کي ورزن ڪنٽرول سسٽم تي محفوظ ڪيل ڪوڊ ۾ تبديل ڪرڻ ممڪن بڻائي ٿو پريزنٽيشن تي گڏيل ڪم کي منظم ڪرڻ، سڀ کان پهريان، مواد ۽ ڊيزائن ٺاهڻ جي ڪم کي الڳ ڪرڻ. RevealJS ۾ سلائڊن جي ڊيزائن (فونٽ، پس منظر، انڊينٽ) CSS استعمال ڪندي بيان ڪئي وئي آھي. CSS سان منهنجي ذاتي صلاحيتن کي بهترين طور تي پهچايو ويو آهي هي gif - پر اهو خوفناڪ نه آهي جڏهن اهڙا ماڻهو آهن جيڪي سي ايس ايس سان ڪم ڪن ٿا مون کان وڌيڪ مهارت سان ۽ تيز. نتيجي طور، اهو ظاهر ٿئي ٿو ته پريزنٽيشن لاءِ تيزيءَ سان اچڻ واري آخري تاريخ سان، اسان مختلف فائلن تي ڪم ڪري سگهون ٿا هڪ ئي وقت Git ذريعي ۽ تعاون جي رفتار کي ترقي ڪري سگهون ٿا جيڪو ناممڪن آهي .pptx فائلن کي ميل ذريعي موڪلڻ وقت.

سلائڊن سان گڏ HTML صفحو ٺاھيو

سادي متن جا ذريعا عظيم آهن، پر توهان انهن کي ڪيئن ٺهرايو ٿا پريزنٽيشن ۾؟

AsciiDoctor ھڪڙو منصوبو آھي جيڪو روبي ۾ لکيل آھي، ۽ ان کي هلائڻ جا ڪيترائي طريقا آھن. پهرين، توهان روبي ٻولي کي انسٽال ڪري سگهو ٿا ۽ هلائي سگهو ٿا asciidoctor سڌو، جيڪو شايد روبي ڊولپرز جي ويجھي شيءِ آهي.

جيڪڏھن توھان نٿا چاھيو روبي کي انسٽال ڪرڻ سان، توھان استعمال ڪري سگھو ٿا ڊڪر تصوير asciidoctor/ docker- asciidoctor، جنهن ۾، جڏهن لانچ ڪيو ويو، توهان فولڊر کي پروجيڪٽ ذريعن سان VOLUME ذريعي ڳنڍي سگهو ٿا ۽ نتيجو هڪ ڏنل جڳهه تي حاصل ڪري سگهو ٿا.

اهو اختيار جيڪو مون چونڊيو آهي اهو ڪجهه غير متوقع لڳي سگهي ٿو، پر اهو مون لاءِ جاوا ڊولپر جي حيثيت ۾ سڀ کان وڌيڪ آسان آهي. ان کي روبي يا ڊاڪر جي انسٽاليشن جي ضرورت ناهي، پر توهان کي اجازت ڏئي ٿي سلائڊ ٺاهڻ لاءِ Maven اسڪرپٽ استعمال ڪندي.

ڳالهه اها آهي ته پروجيڪٽ جيربي - روبي ٻولي جي جاوا تي عمل درآمد تمام سٺو آهي ته اهو توهان کي اجازت ڏئي ٿو ته روبي لاءِ ٺاهيل تقريبن ڪنهن به شيءِ کي جاوا مشين ۾ هلائڻ، ۽ AsciiDoctor هلائڻ JRuby جي عام استعمالن مان هڪ آهي.

دستيابي asciidoctor-maven-plugin توهان کي AsciiDoctor دستاويز گڏ ڪرڻ جي اجازت ڏئي ٿي جيڪا جاوا پروجيڪٽ جو حصو آهي (جنهن کي اسين فعال طور تي استعمال ڪندا آهيون). ساڳئي وقت، AsciiDoctor ۽ JRuby Maven پاران خودڪار طور تي ڊائون لوڊ ڪيا ويا آهن، ۽ AsciiDoctor JRuby ماحول ۾ هلندو آهي: مشين تي ڪا به شيء نصب ڪرڻ جي ڪا ضرورت ناهي! (پيڪيج کانسواءِ graphvizجنهن جي ضرورت آهي جيڪڏهن توهان GraphViz يا PlantUML گرافڪس استعمال ڪرڻ چاهيو ٿا.) بس پنهنجي .adoc فائلن کي فولڊر ۾ رکو src/main/asciidoc/. هتي پومنڪ جو مثالسلائيڊس گڏ ڪرڻ سان گڏ ڊراگرام.

سلائڊ کي PDF ۾ تبديل ڪريو

جيتوڻيڪ سلائڊن جو HTML ورزن ڪافي خودمختاري آهي، پر اڃا به ضروري آهي ته سلائيڊن جو PDF ورجن هجي. پهرين، اهو ٿئي ٿو ته ڪجهه ڪانفرنسن ۾ جيڪي اسپيڪر کي پنهنجي ليپ ٽاپ کي ڳنڍڻ جو موقعو نه ڏيندا آهن، انهن کي سلائڊ جي ضرورت هوندي آهي "سختي سان pptx يا pdf فارميٽ ۾،" بغير توقع جي ته اهي پڻ HTML ۾ آهن. ٻيو، اهو سٺو فارم آهي ته آرگنائيزرن کي توهان جي سلائڊ جو اڻ ايڊٽ ٿيل نسخو موڪليو جيئن اهي رپورٽ ۾ ڏيکاريا ويا آهن، ڪانفرنس جي مواد ۾ فائل جي اشاعت لاء PDF فارميٽ ۾.

خوش قسمتي سان، Node.js افاديت هن ڪم کي سنڀاليندو آهي. ڊيڪ ٽيپ، بنياد تي ٺهيل پپ پچر - ڪروم برائوزر کي منظم ڪرڻ لاءِ آٽوميشن سسٽم. توھان تبديل ڪري سگھو ٿا RevealJS پيشڪش کي PDF ۾ حڪم سان

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

ڊيڪ ٽيپ لانچ ڪرڻ وقت ٻه چالون، جن کي اسان کي آزمائش ۽ غلطي ذريعي اچڻو پوندو:

• قرارداد ذريعي پيٽرول -s ٻه ڀيرا مارجن سان بيان ڪيو وڃي، ٻي صورت ۾ تبديلي جي نتيجن سان مسئلو ٿي سگهي ٿو

• پريزنٽيشن جي HTML ورزن جي URL ۾ توهان کي هڪ پيٽرول پاس ڪرڻ جي ضرورت آهي ?fragments=true، جيڪو توهان جي سلائيڊ جي هر وچولي حالت لاءِ هڪ الڳ PDF صفحو ٺاهيندو (مثال طور، پنج صفحا پنجن بلٽ پوائنٽن لاءِ جيڪڏهن اهي هڪ ٻئي پٺيان ڏيکاريا وڃن). اهو توهان کي اجازت ڏيندو ته توهان اهڙي پي ڊي ايف کي پنهنجي طور تي هڪ پريزنٽيشن جي طور تي رپورٽ دوران استعمال ڪري سگهو ٿا.

ويب تي خودڪار اسيمبلي ۽ اشاعت

اهو آسان آهي جڏهن سلائڊ پاڻمرادو مرتب ڪيا وڃن جڏهن ورجن ڪنٽرول سسٽم ۾ تبديليون ڪيون وڃن، ۽ اڃا به وڌيڪ آسان جڏهن خودڪار طور تي مرتب ٿيل سلائيڊس انٽرنيٽ تي عوامي استعمال لاءِ پوسٽ ڪيون وڃن. انٽرنيٽ تان سلائڊ آسانيءَ سان ”کيڏي“ سگھجن ٿيون سامعين جي سامهون انٽرنيٽ سان ڳنڍيل ڪنهن به مشين ۽ پروجيڪٽر ذريعي.

جيئن ته اسان اسان جي ڪم ۾ GitHub استعمال ڪندا آهيون، هڪ CI سسٽم جو قدرتي انتخاب آهي TravisCI، ۽ تيار ڪيل پيشيونشن جي ميزباني لاءِ - github.io. github.io جي پويان خيال اهو آهي ته ڪنهن به جامد مواد برانچ ڏانهن پوسٽ ڪئي وئي آهي gh-pages توهان جي پروجيڪٽ جي GitHub تي، دستياب ٿي ويندي <ваше имя>.gihub.io/<ваш проект>.

مڪمل TravisCI ٺاھ جوڙ واري فائل، بشمول Maven استعمال ڪندي صفحي جي HTML ورزن کي گڏ ڪرڻ، ڊيڪٽ ٽيپ استعمال ڪندي PDF ۾ تبديل ڪرڻ، ۽ نتيجن کي ھڪڙي سلسلي ۾ اپلوڊ ڪرڻ gh-pages github.io تي اشاعت لاء، ڏسڻ ۾ اچي ٿو پوء.

TravisCI پاسي تي اهڙي منصوبي کي تعمير ڪرڻ لاء، توهان کي ماحول جي متغير کي ترتيب ڏيڻ جي ضرورت آهي

• GH_REF - قدر جهڙوڪ github.com/inponomarev/csa-hb
• GH_TOKEN - GitHub رسائي ٽوڪن. توھان حاصل ڪري سگھوٿا GitHub مان توھان جي پروفائل سيٽنگن ۾، ڊولپر سيٽنگون -> ذاتي رسائي ٽوڪن. جيڪڏهن توهان هڪ پريزنٽيشن اپلوڊ ڪريو عوامي مخزن تي، ته پوءِ هن ٽوڪن لاءِ اهو ڪافي آهي ته صرف رسائي جي سطح بيان ڪرڻ لاءِ ”پبلڪ مخزن تائين رسائي“.
• GH_USER_EMAIL / GH_USER_NAME - نالو / اي ميل جوڙو جنهن جي طرفان ٿريڊ ڏانهن ڌڪ ڪيو ويندو gh-pages.

اهڙيء طرح، GitHub تي پريزنٽيشن ڪوڊ جي هر ڪمٽ جي نتيجي ۾ سلائڊ خودڪار طريقي سان HTML ۽ PDF فارميٽ ۾ ٻيهر ٺاهيا ويا آهن ۽ github.io تي ٻيهر اپ لوڊ ڪيا ويا آهن. (يقينا، توهان کي صرف github.io تي اپلوڊ ڪرڻ گهرجي اهي پيشيونٽيون جيڪي توهان آخرڪار عوامي بڻائڻ چاهيو ٿا.)

منصوبن جا مثال

آخرڪار، هتي پيش ڪيل منصوبن جي ڪجهه مثالن جا لنڪ آهن ڪسٽمائيز Maven اسڪرپٽس ۽ CI ترتيب سان Travis-CI لاءِ، جيڪي ڪلون ڪري سگهجن ٿيون ۽ استعمال ڪري سگهجن ٿيون جڏهن توهان جا پنهنجا پريزنٽيشن پروجيڪٽ ٺاهي رهيا آهن:

• https://github.com/inponomarev/kstreams-examples (منهنجي ڳالهه JPoint 2019 لاءِ)

• https://github.com/inponomarev/csa-hb (منهنجي رپورٽ Heisenbug 2019 لاءِ)

الوداع پاور پوائنٽ! مان نه ٿو سمجهان ته مون کي ڪڏهن به توهان جي ٽيڪنيڪل پيشين جي ضرورت پوندي :)

جو ذريعو: www.habr.com