https://cheroliv.com/ JBake Bootstrap šablon en-gb Thu, 8 Oct 2026 11:39:46 +0000 Thu, 8 Oct 2026 11:39:46 +0000 https://cheroliv.com/blog/2026/0126_hyperframes_asciidoc_video_post.html Sun, 31 May 2026 00:00:00 +0000 blog/2026/0126_hyperframes_asciidoc_video_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_тешњ_у_видеопроводу">Тешњ у видеопроводу</a></li> <li><a href="#_hyperframes_motor">HyperFrames : Motor</a></li> <li><a href="#_архитектура_плагина">Архитектура плагина</a> <ul class="sectlevel2"> <li><a href="#_cevod_u_četiri_koraka">Cevod u četiri koraka</a></li> <li><a href="#_dsl_asciidoc">DSL AsciiDoc</a></li> <li><a href="#_bridge_node_js">Bridge Node.js</a></li> </ul> </li> <li><a href="#_два_видео_плагина_два_употребе">Два видео плагина, два употребе</a></li> <li><a href="#_6_epics_iz_roadmape">6 EPICs iz Roadmape</a></li> <li><a href="#_zašto_radi">Zašto radi</a></li> <li><a href="#_conclusion_nedostajući_veza">Conclusion: Nedostajući veza</a></li> <li><a href="#_reference">Reference</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 8 minutes</div> <p>Pre dve nedelje, sam pokrenuo`capsule-gradle`— плагин који трансформише дек reveal.js u kapsuli WebM videa sa TTS. Danas, dodajem novi plugin : <code>hyperframes-gradle</code>. On radi nešto što capsule-gradle ne radi: претворити AsciiDoc <strong>directno</strong> у MP4 видео, без пролаза кроз reveal.js.</p> </div> <div class="paragraph"> <p>Ово је зато постоји овај додатак, како се уклapa са постојећим, i šta motor HyperFrames od HeyGen donosi u pipeline proizvodnje sadržaja.</p> </div> </div> </div> <div class="sect1"> <h2 id="_тешњ_у_видеопроводу">Тешњ у видеопроводу</h2> <div class="sectionbody"> <div class="paragraph"> <p>Moj dokumentarni pipeline proizvodi dva tipa videa:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Kapsula za reviziju</strong> (capsule-gradle) — jedan dekar reveal.js snjljen u WebM sa</p> </li> </ol> </div> <div class="paragraph"> <p>naracija TTS. Savršeno za pregled modula.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Animirani slidovi</strong> (slider-gradle) — interaktivni HTML deck reveal.js za</p> </li> </ol> </div> <div class="paragraph"> <p>trener na mestu.</p> </div> <div class="paragraph"> <p>Ali nedostaje treći format: <strong>samostalni video</strong>.</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5555%;"> <col style="width: 5.5565%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Случај употребе</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Садашње решение</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">nedostatak</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Slajdovi trenera</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">slider-gradle → reveal.js</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Kapsula revizije</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">capsule-gradle → WebM</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>teaser video</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ниједна</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Animirana tehnička demо</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ниједна</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Dokument-to-video</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ниједна</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Prvi use case je kritičan: kako generisati automatski 60-sekundni video koji predstavlja projekat ili modul, sa GSAP animacijama, narration TTS, i pozadinska muzika — sve iz istog AsciiDoc fajla а слайдовите?</p> </div> <div class="paragraph"> <p>Capsule-gradle ne može da odgovozi: mu je <strong>već</strong> potreban deck reveal.js. slider-gradle dobro pravi ovaj deck, ali nije namenjen za renderovanje videa. Trebalo je <strong>direktan</strong> pipeline: AsciiDoc → video.</p> </div> </div> </div> <div class="sect1"> <h2 id="_hyperframes_motor">HyperFrames : Motor</h2> <div class="sectionbody"> <div class="paragraph"> <p>otkrio samhttps://github.com/heygen-com/hyperframes[HyperFrames] il y a nekoliko dana. To je open-source framework (Apache 2.0) kreiran od strane HeyGen, јединорош у видеу ИИ. 22 700 zvezdica na GitHub-u. Питч се слаже у jedna rečenica :</p> </div> <div class="paragraph"> <p><strong>Napiši HTML. Prikaži video. Izgrađeno za agente.</strong></p> </div> <div class="paragraph"> <p>Princip: pišete HTML sa`data-*`atributi, referencirate GSAP animacija (ili CSS, Lottie, Three.js…), a motor renderuje sve u MP4 putem Puppeteer (bezglavog Chrome) + FFmpeg. Deterministički rezultat: isti unos, isti okviri, isto video.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><div id="stage" data-composition-id="intro" data-start="0" data-width="1920" data-height="1080"> <video class="clip" data-start="0" data-duration="6" data-track-index="0" src="background.mp4" muted playsinline></video> <h1 id="title" class="clip" data-start="1" data-duration="4" data-track-index="1"> Formation Docker & Kubernetes </h1> <audio data-start="0" data-duration="6" data-track-index="2" data-volume="0.3" src="music.wav"></audio> <script src="https://cdn.jsdelivr.net/npm/gsap@3/dist/gsap.min.js"></script> <script> const tl = gsap.timeline({ paused: true }); tl.from("#title", { opacity: 0, y: 40, duration: 0.8 }, 1); window.__timelines = window.__timelines || {}; window.__timelines.intro = tl; </script> </div></code></pre> </div> </div> <div class="paragraph"> <p>Što čini HyperFrames različit od Remotion? Bez Reacta, bez Bundler, nema JSX. Sirow HTML koji agenti AI znaju da pišu prirodno. То је <strong>точно</strong> прилагољено мојем пайп-лајну: planner-gradle са deepseek Može da generiše ovaj HTML iz plana SPG/SPD, i Gradle plugin. Може да га конвертује у MP4.</p> </div> </div> </div> <div class="sect1"> <h2 id="_архитектура_плагина">Архитектура плагина</h2> <div class="sectionbody"> <div class="paragraph"> <p>hyperframes-gradle prati isti pattern kao i svi moji plugini : <a href="0124_architecture_plugin_gradle_racine_consommateur_independant_post.html">облик « Самостални додатак + Корен потрошач »</a>.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">hyperframes-gradle/ ├── settings.gradle.kts ← racine consommateur (dogfood) ├── build.gradle.kts ← 3 lignes : apply plugin hyperframes ├── hyperframes-plugin/ ← BUILD INDÉPENDANT │ ├── gradlew ← son propre wrapper │ ├── build.gradle.kts ← java-gradle-plugin │ ├── src/main/kotlin/education/cccp/hyperframes/ │ │ ├── HyperframesPlugin.kt │ │ ├── GenerateHyperframesHtmlTask.kt │ │ ├── RenderHyperframesTask.kt │ │ └── HyperframesExtension.kt │ ├── .agents/ ← gouvernance agent │ └── doc/ │ └── HYPERFRAMES_ARCHITECTURE.adoc └── video.yml ← configuration dogfood</code></pre> </div> </div> <div class="sect2"> <h3 id="_cevod_u_četiri_koraka">Cevod u četiri koraka</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontSize 11 title Ceovod hyperframes-gradle rectangle "AsciiDoc izvor" as adoc #LightYellow rectangle "AsciidoctorJ" as asciidoctorj #LightBlue rectangle "HTML HyperFrames\n(data-* attrs)" as html #LightGreen rectangle "HyperFrames CLI (Node.js 22+)" as cli #Lavender rectangle "video.mp4" as mp4 #Gold adoc -right-> asciidoctorj : parse blocs customs asciidoctorj -right-> html : génère HTML html -right-> cli : ProcessBuilder\nnpx hyperframes render cli -right-> mp4 : Puppeteer + FFmpeg @enduml</pre> </div> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>AsciidoctorJ</strong> parsira izvorni AsciiDoc i izvlači prilagođene blokove</p> </li> </ol> </div> <div class="paragraph"> <p><code>[hyperframes-composition]</code>, <code>[hyperframes-track]</code>, <code>[hyperframes-animation]</code>.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>GenerateHyperframesHtmlTask</strong> генерише HTML HyperFrames са</p> </li> </ol> </div> <div class="paragraph"> <p>`data-*`одговарајући атрибути.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>RenderHyperframesTask</strong> poziva CLI HyperFrames putem`ProcessBuilder`:</p> </li> </ol> </div> <div class="paragraph"> <p><code>npx hyperframes render --input index.html --output video.mp4</code>.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>MP4 je raspoređen u`output/`са једным`metadata.json`za orkestraciju.</p> </li> </ol> </div> </div> <div class="sect2"> <h3 id="_dsl_asciidoc">DSL AsciiDoc</h3> <div class="paragraph"> <p>Pravi dodatna vrednost plugina je DSL AsciiDoc. Korisnik Nikada ne piše HTML. On beleži svoj postojeći AsciiDoc dokument:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">= Formation Docker & Kubernetes :hyperframes-width: 1920 :hyperframes-height: 1080 :hyperframes-fps: 30 [hyperframes-composition, id="intro"] == Introduction Le titre apparaît avec un fondu GSAP sur fond vidéo. [hyperframes-track, index=0, start=0, duration=6] video::assets/background.mp4[muted, playsinline] [hyperframes-track, index=1, start=1, duration=4] Formation Docker & Kubernetes [hyperframes-animation, type=gsap]</code></pre> </div> </div> <div class="paragraph"> <p>const tl = gsap.timeline({ paused: true }); tl.from("#title", { opacity: 0, y: 40, duration: 0.8 }, 1); window.<em>timelines = window.</em>timelines || {}; window.__timelines.intro = tl;</p> </div> <div class="paragraph"> <p>Atributi docinfo (<code>:hyperframes-width:</code>) podešavaju dimenzije. Prilagođeni blokovi definišu kompozicije i piste. Blok `[hyperframes-animation]`sadrži sirovi kod GSAP — da je agenat AI може да генерише из опис у природном језику.</p> </div> </div> <div class="sect2"> <h3 id="_bridge_node_js">Bridge Node.js</h3> <div class="paragraph"> <p>Jedini tehnički problem : HyperFrames je u Node.js/TypeScript, i moji plugini su u Kotlin/JVM. Rešenje je`ProcessBuilder` :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">class RenderHyperframesTask : DefaultTask() { @TaskAction fun render() { val process = ProcessBuilder( "npx", "hyperframes", "render", "--input", inputHtml.absolutePath, "--output", outputMp4.absolutePath ) .inheritIO() .start() val exitCode = process.waitFor() require(exitCode == 0) { "HyperFrames render failed with exit code $exitCode" } } }</code></pre> </div> </div> <div class="paragraph"> <p>Nula povezivanja koda JVM ↔ Node.js. Ugovor je putem komandne linije. i fajlovi na disku. Ovo je isti pattern kao`plantuml-gradle` (koji poziva CLI PlantUML) ili`slider-gradle`(koji poziva AsciidoctorJ). Ништа ново под сuncем — само применено на алат који је новији.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_два_видео_плагина_два_употребе">Два видео плагина, два употребе</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.7619%;"> <col style="width: 4.762%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">kapšula-gradle</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">hyperframes-gradle</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Source</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Deck reveal.js (postojeći HTML)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">AsciiDoc → HTML hiperokvirni</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Случай употребе</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Kapsula za reviziju</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">објасниво standalone видео</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">природа</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Slides → video</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Документ → видео</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">isporučen</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Playwright Java → WebM</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">HyperFrames CLI → MP4</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Анимација</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Prelazi reveal.js prirodni</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">GSAP/CSS data-attributes</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Stek</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">100% JVM (Kotlin)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">JVM + vanjski Node.js CLI</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Ne se zamenjuju. Se kompletiraju. Potpun lanac vrednosti:</p> </div> <div class="paragraph"> <p>AsciiDoc ──→ slider-gradle ──→ deck reveal.js ──→ capsule-gradle ──→ WebM капсула ревизије</p> </div> <div class="paragraph"> <p>AsciiDoc ──→ hyperframes-gradle ──→ MP4 (samostalno video)</p> </div> <div class="paragraph"> <p>Korisnik piše jedan AsciiDoc fajl. slider-gradle proizvodi slajdove. capsule-gradle производи капсулу ревизије. hyperframes-gradle производи video teaser i tehničke demo.</p> </div> </div> </div> <div class="sect1"> <h2 id="_6_epics_iz_roadmape">6 EPICs iz Roadmape</h2> <div class="sectionbody"> <div class="paragraph"> <p>plugin je strukturiran u 6 EPICs:</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1682%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">EPIC</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Опис</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Prioritet</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">HF-0</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Bootstrap upravljanje + okvirna arhitektura</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ ZAVRŠENO</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">HF-1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Plugin Gradle stub + AsciidoctorJ integracija</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">P0</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">HF-2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Bridge CLI HyperFrames (ProcessBuilder → npx → MP4)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">P1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">HF-3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">DSL AsciiDoc običaji (blokovi, docinfo, šabloni)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">P1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">HF-4</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Integracija runner-gradle (metadata.json)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">P2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">HF-5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Templates gotovi za upotrebu (title-card, code-diff, captions)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">P3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">HF-6</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">CI + objava Maven Central / Gradle Portal</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">P3</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Сесија 000 (bootstrap) већ је завршена. Сесија 001 ће нападнути на HF-1 : stub Gradle plugina i integracija AsciidoctorJ.</p> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_radi">Zašto radi</h2> <div class="sectionbody"> <div class="paragraph"> <p>Три причине :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>HyperFrames je "built for agents"</strong>. Moj pipeline se temelji na AI agentima.</p> </li> </ol> </div> <div class="paragraph"> <p>(planner-gradle + deepseek) koji generišu sadržaj. HyperFrames prima HTML neobradjen — format koji LLMs najbolje opanuju. Bez React, bez Bez JSX, nema krivulje učenja za agenta.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>DSL AsciiDoc je prirodan</strong>. Sav moj ekosistem govori AsciiDoc.</p> </li> </ol> </div> <div class="paragraph"> <p>slider-gradle, codex-gradle, training-gradle — svi potrošavaju`.adoc`. Dodaj custom blokovi`[hyperframes-composition]`је додатак logično, nije ruptura.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Node.js bridge je isprobano obrazac</strong>. ProcessBuilder izvan JVM,</p> </li> </ol> </div> <div class="paragraph"> <p>Ovo je to što već radim za PlantUML, Graphviz, Piper. Dodaj HyperFrames Ne menja ništa u arhitekturi — još jedan spoljni alat, Upravljan od Gradle.</p> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="ℹ️"></i> </td> <td class="content"> <div class="paragraph"> <p>Stvarna snaga uzorka je da nema <strong>nijedne</strong> zavisnosti npm u Gradle build. Plugin ne uvozi nikav Node.js kod. Izvršava Команда шела. Ако HyperFrames мења или се лома, плагин није повезан. — dovoljno je ažurirati naredbu.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_conclusion_nedostajući_veza">Conclusion: Nedostajući veza</h2> <div class="sectionbody"> <div class="paragraph"> <p>Sa hyperframes-gradle, moj video pipeline je kompletan. Imam :</p> </div> <div class="ulist"> <ul> <li> <p><strong>interaktivni slidovi</strong> (slider-gradle)</p> </li> <li> <p><strong>капсуле ревизије</strong> (capsule-gradle)</p> </li> <li> <p><strong>самоставни видео</strong> (hyperframes-gradle)</p> </li> </ul> </div> <div class="paragraph"> <p>Tri formata. Jedan izvorni fajl: AsciiDoc.</p> </div> <div class="paragraph"> <p>Sledeći cilj je HF-1 : kompajlirati plugin i generisati prvi HTML HyperFrames iz annotovanog AsciiDoc dokumenta. Sesija 001 je već okvirena.</p> </div> <div class="paragraph"> <p>hyperframes-gradle postoji. Upravljanje je na mestu. Pozadina napisano je. Arhitektura je dokumentovana. Plugin je rođen.</p> </div> </div> </div> <div class="sect1"> <h2 id="_reference">Reference</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="0124_architecture_plugin_gradle_racine_consommateur_independant_post.html">Article 0124 — Neovisna arhitektura plugina + korenski potrošač</a></p> </li> <li> <p><a href="https://github.com/heygen-com/hyperframes">HyperFrames — GitHub</a></p> </li> <li> <p><a href="https://hyperframes.heygen.com/introduction">HyperFrames — Dokumentacija</a></p> </li> <li> <p><code>foundry/public/hyperframes-gradle/hyperframes-plugin/doc/HYPERFRAMES_ARCHITECTURE.adoc</code>— Detaljna arhitektura</p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0125_audit_conso_opencode_methodologie_comparaison_prix_llm_post.html Mon, 18 May 2026 00:00:00 +0000 blog/2026/0125_audit_conso_opencode_methodologie_comparaison_prix_llm_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_разумевање_стека_ко_шта_ради">Разумевање стека : Ко шта ради ?</a></li> <li><a href="#_uvod_zašto_audit">Uvod: Zašto audit?</a></li> <li><a href="#_opencode_baza_podataka_zlatni_rudnik">OpenCode baza podataka: zlatni rudnik</a> <ul class="sectlevel2"> <li><a href="#_šema">Šema</a></li> <li><a href="#_kod_ekstrakcije">Kod ekstrakcije</a></li> </ul> </li> <li><a href="#_резултати_73_дана_потрошње">Резултати : 73 дана потрошње</a> <ul class="sectlevel2"> <li><a href="#_globalni_pregled">Globalni pregled</a></li> <li><a href="#_ventilacija_po_model_i_dobavljač">ventilacija po model i dobavljač</a></li> <li><a href="#_modeli_unutar_sesije_šta_tabela_sesije_ne_vidi">Modeli unutar sesije : Šta tabela sesije ne vidi</a></li> </ul> </li> <li><a href="#_тарифна_успоредба_запaдни_провајдери">Тарифна Успоредба — Запaдни Провајдери</a> <ul class="sectlevel2"> <li><a href="#_antropički_claude">antropički — Claude</a></li> <li><a href="#_openai_gpt">OpenAI — GPT</a></li> <li><a href="#_google_gemini">Google — Gemini</a></li> <li><a href="#_huggingface_inference_providers">HuggingFace Inference Providers</a></li> <li><a href="#_groq">Groq</a></li> </ul> </li> <li><a href="#_usporedba_tarifa_kineski_dobavljači">Usporedba tarifa — Kineski dobavljači</a> <ul class="sectlevel2"> <li><a href="#_deepseek_api_direct_platform_deepseek_com">DeepSeek API Direct (platform.deepseek.com)</a></li> <li><a href="#_kimi_moonshot_platform_kimi_com">Kimi Moonshot (platform.kimi.com)</a></li> <li><a href="#_alibaba_bailian_bailian_aliyun_com">Alibaba Bailian (bailian.aliyun.com)</a></li> </ul> </li> <li><a href="#_сажетна_табела_сви_пружаоци">Сажетна табела — Сви пружаоци</a></li> <li><a href="#_sakriveni_trošak_prompt_engineering_i_iteracije">Sakriveni trošak : Prompt Engineering i iteracije</a></li> <li><a href="#_кумулисање_претплата_ollama_cloud_pro_докер_метод">Кумулисање претплата Ollama Cloud Pro: Докер метод</a></li> <li><a href="#_šta_audit_ne_meri">Šta Audit Ne Meri</a></li> <li><a href="#_закључак_пресуда_бројева">Закључак: Пресуда бројева</a></li> <li><a href="#_reference">Reference</a> <ul class="sectlevel2"> <li><a href="#_izvori_tarifa">Izvori tarifa</a></li> </ul> </li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 22 minutes</div> <p>Često mi se pita koliko košta moja potrošnja AI. Odgovaram « 20 evra po mjesecu » i gledaju mi na oči kao da sam lud. Zatim danas otvaram crnu kutiju. Ovaj članak je kompletan audit mojih 73 dana vibe kodiranja: metodologija za izvadanje podataka iz SQLite baze OpenCode, SQL kod za upitivanje tabela i sveobuhvatna poređenja sa <strong>svim</strong> dobavljačima na tržišti — zapadnim kao i kineskim. Rezultat je tako asimetričan što sam morao da proveram svoje račune tri puta.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">uckucaj</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_разумевање_стека_ко_шта_ради">Разумевање стека : Ко шта ради ?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pre nego što se uručimo u brojeve, objasnimo arhitekturu. Postoje tri različita aktora u mom setup-u, i važno je da ih ne pomiješamo:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontSize 12 title Tri aktera moje LLM steka left to right direction actor "Ja (razvijalac)" as Dev package "OpenCode (github.com/anomalyco/opencode)" as OC { rectangle "CLI od vibe kodiranja Otvoreni kod, besplatno" as CLI note right of CLI C'est l'outil que j'utilise pour coder avec des agents IA. Il ne fournit AUCUN modèle. C'est un terminal + un orchestrateur. end note } package "Ollama (Lokalna instalacija)" as OL { rectangle "Klijent inferencije Instalirano na moj računar" as Client note right of Client C'est le logiciel qui fait tourner les modèles. Il peut les exécuter en local OU les déléguer au cloud selon le tag (:cloud). Il s'authentifie via clé SSH. end note } package "Ollama Cloud (ollama.com)" as OCloud { rectangle "Usluga oblačne inferencije Pro pretplata: 20€/mesec" as Cloud note right of Cloud C'est le fournisseur d'inférence. Mes modèles avec le tag :cloud sont exécutés sur LEURS serveurs. L'abonnement Pro donne accès à des quotas supérieurs. end note } Dev --> CLI : "Ја укацујем промптс" CLI --> Client : "Zovi ovaj model" Client --> Cloud : "SSH ključ + zahtev (modeli :cloud)" Client --> Client : "Локално извршавање (модели без :cloud)" @enduml</pre> </div> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p><strong>OpenCode NIJE davač modela</strong>Ovo je CLI otvorenog izvora (<a href="https://github.com/anomalyco/opencode">github.com/anomalyco/opencode</a>) koji orkestruje AI-agente. Ne prodaje pretplatu, ne pruža inferenciju. To je ekvivalent`git`за верзионирање : алат, а не услуга. <strong>Ollama Cloud je pružač inferencije.</strong>Moja lokalna instalacija Ollama radi kao <strong>klijent</strong> — authentifikuje se kod servera Ollama kroz jedinstvenu SSH ključ (Device Key) i deleguje im izvršavanje označenih modela`:cloud`. Pro abonman (20€/mesec) otključava veće kvote i omogućava kombinovanje više naloga na istoj mašini koristeći Docker.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_uvod_zašto_audit">Uvod: Zašto audit?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Prije dva meseca, koristio sam modele besplatno na svojoj lokalnoj instalaciji Ollama. Zatim sam preuzeo prvu pretplatu Ollama Cloud Pro po 20 evra mjesečno, koji mi omogućava da koristim cloud modele (oni sa tagom`:cloud`) kroz pružač`ollama-cloud`. Drugi abonnement je počeo mesec kasnije, na odvojenoj Docker instanci sa svojim nalogom i svojim SSH ključem — metoda kumulacije opisana u <a href="0120_cumuler_deux_abonnements_ollama_pro_docker_post.html">moj članak o kumulaciji abonamenta</a></p> </div> <div class="paragraph"> <p>Питање које ме мучало : <strong>Да ли су ови 20€ месечно оправдани?</strong> Не на очу. Са подацима.</p> </div> <div class="paragraph"> <p>Da bih odgovorio, mi je bilo potrebno tačnih podataka. Ne procene. Ne proseci. Moja potrošnja <strong>realna</strong>, token po token, model po model, sesija po sesiji.</p> </div> <div class="paragraph"> <p>I OpenCode — CLI — sve to čuva u SQLite bazi.</p> </div> </div> </div> <div class="sect1"> <h2 id="_opencode_baza_podataka_zlatni_rudnik">OpenCode baza podataka: zlatni rudnik</h2> <div class="sectionbody"> <div class="paragraph"> <p>OpenCode persistuje kompletan istoriju svojih sesija u SQLite fajlu koji se nalazi u`~/.local/share/opencode/opencode.db`. La mienne pèse 660 Mo pour 73 jours d’utilisation — une base de données de production tout à fait respectable.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ ls -lh ~/.local/share/opencode/opencode.db -rw-r--r-- 1 cheroliv cheroliv 660M mai 18 12:25 opencode.db</code></pre> </div> </div> <div class="sect2"> <h3 id="_šema">Šema</h3> <div class="paragraph"> <p>Baza sadrži oko dvadeset tabela, ali tri od njih su ključne za naš audit:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontSize 12 title Опрошћена шема — OpenCode SQLite entity "сесија" as S { * id : TEXT -- * model : TEXT (JSON) * cost : REAL * tokens_input : INTEGER * tokens_output : INTEGER * tokens_reasoning : INTEGER * tokens_cache_read : INTEGER * tokens_cache_write : INTEGER * time_created : INTEGER * project_id : TEXT } entity "poruka" as M { * id : TEXT -- * session_id : TEXT <<FK>> * data : TEXT (JSON) * time_created : INTEGER } entity "projekat" as P { * id : TEXT -- * worktree : TEXT * name : TEXT } S ||--o{ M : "id_sesije" S }o--|| P : "id_projekta" note right of S La table session agrège tokens + coût + modèle. C'est notre point d'entrée principal. end note note right of M Les messages individuels. Le champ data contient le modèle utilisé (format JSON) même si la session change de modèle en cours de route. end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Сто`session`savršena je za globalni audit : svaka sesija ima svoj agregirani broj token, korišćen model i trošak. Polje`model`је сировић JSON :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-json hljs" data-lang="json">{ "id": "deepseek-v4-pro:cloud", "providerID": "ollama-cloud", "variant": "default" }</code></pre> </div> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p>Polje`cost`U OpenCode bazi se odražavaju samo <strong>vanjski API troškovi</strong> plaćeni po potrošnji putem API ključa (Google Gemini, OpenAI, itd.). Pozivi kroz Ollama — bilo lokalno ili kroz Ollama Cloud Pro — su označeni.`cost=0`Jer je trošak fiksni (pretplata), a ne po tokenu. Stvarni trošak ovih poziva je mesečna pretplata.</p> </div> </td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_kod_ekstrakcije">Kod ekstrakcije</h3> <div class="paragraph"> <p>Није потребно инсталирати ништа. Node.js 22+ sadrži eksperimentalni SQLite modul (<code>node:sqlite</code>) koji savršeno funkcioniše. Ovde je skript koji mi je sve dao :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">const { DatabaseSync } = require('node:sqlite'); const db = new DatabaseSync( `${process.env.HOME}/.local/share/opencode/opencode.db`, { readonly: true } ); // 1. Statistiques globales const global = db.prepare(` SELECT COUNT(*) as sessions, SUM(tokens_input) as total_input, SUM(tokens_output) as total_output, SUM(tokens_reasoning) as total_reasoning, SUM(tokens_cache_read) as total_cache_read, SUM(cost) as total_cost FROM session `).get(); // 2. Ventilation par modèle et fournisseur const byModel = db.prepare(` SELECT json_extract(model, '$.id') as model_id, json_extract(model, '$.providerID') as provider, COUNT(*) as sessions, SUM(tokens_input) as total_input, SUM(tokens_output) as total_output, SUM(cost) as total_cost FROM session WHERE model IS NOT NULL GROUP BY model_id, provider ORDER BY SUM(tokens_input) DESC `).all(); // 3. Par mois const monthly = db.prepare(` SELECT strftime('%Y-%m', datetime(time_created/1000, 'unixepoch')) as month, COUNT(*) as sessions, SUM(tokens_input) as total_input, SUM(tokens_output) as total_output, SUM(cost) as total_cost FROM session WHERE time_created IS NOT NULL GROUP BY month ORDER BY month `).all(); // 4. Messages par modèle (détection des changements intra-session) const msgByModel = db.prepare(` SELECT json_extract(m.data, '$.model.providerID') as provider, json_extract(m.data, '$.model.modelID') as model_id, COUNT(*) as messages FROM message m WHERE json_extract(m.data, '$.model') IS NOT NULL GROUP BY provider, model_id ORDER BY COUNT(*) DESC `).all(); console.log({ global, byModel, monthly, msgByModel }); db.close();</code></pre> </div> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="ℹ️"></i> </td> <td class="content"> <div class="paragraph"> <p>Застава`--experimental-sqlite`је потребан на Node.js 22.x. Na Node.js 24+, modul je stabilan i više ne zahteva flag.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_резултати_73_дана_потрошње">Резултати : 73 дана потрошње</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_globalni_pregled">Globalni pregled</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Метрика</th> <th class="tableblock halign-left valign-top">Vrednost</th> <th class="tableblock halign-left valign-top">Контекст</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Sesije OpenCode</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">1 022</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">~14 sesija/dan u proseku</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ulažni Tokeni</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2,62 милијарде</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Od kojih 94,5M u keš pogodak</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Tokens Output</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">21 miliona</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">(Empty)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Tokens Reasoning</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">141 000</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Zanemarivo — gotovo nema razmišljanja</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Trošak vanjskog API</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>$0,22</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">naknade izvan abonmana (Gemini + besplatni nivoji)</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Ovaj iznos od \$0,22 je ključan: On predstavlja sve što sam plaćao <strong>en plus</strong> uz moje pretplate Ollama Cloud Pro. To jest, praktično ništa. Pretplata pokriva najvažnije.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontSize 12 title Mesečna evolucija — Ulazni tokeni rectangle "Mart 2026 9 sesija 37,7M tokena" as MARS #FFE082 rectangle "April 2026 486 sesija 1,33 mld tokena" as AVR #81C784 rectangle "Maj 2026 527 sesija 1,25 mld tokena" as MAI #64B5F6 MARS -right-> AVR : ×35 AVR -right-> MAI : stable (période en cours) note bottom of MAI Mai comptabilisé jusqu'au 18. Projection mois complet : ~2,1 Md tokens si la tendance se maintient. end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Ovo je prelazak od « test » korišćenja ka « production » korišćenju — kada sam počeo da neprestano pokrećem OpenCode agente za swoje Gradle plugins.</p> </div> </div> <div class="sect2"> <h3 id="_ventilacija_po_model_i_dobavljač">ventilacija po model i dobavljač</h3> <div class="paragraph"> <p>Polje`model`od stola`session`smanje JSON,`json_extract()`omogućava čisto ventiliranje :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 27.2727%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1819%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Model × pružač</th> <th class="tableblock halign-left valign-top">Sesije</th> <th class="tableblock halign-left valign-top">Suvrati sve backtick kod spanove (<code>…​</code>) tačno po originalu — nikada ne menjati sadržaj backtick-a, razmak ili poziciju.</th> <th class="tableblock halign-left valign-top">Output</th> <th class="tableblock halign-left valign-top">Trošak</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">deepseek-v4-pro @ ollama-cloud</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">63</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">220 M</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">1,94 M</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">deepseek-v4-pro @ ollama-b</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">124</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">463 M</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">4,15 M</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">deepseek-v4-pro @ ollama</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">100</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">252 M</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2,25 M</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">deepseek-v4-flash-free @ opencode</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">16</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">1,3 M</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">279 K</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">qwen3.6-plus-free @ opencode</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">369 K</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">25 K</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">gemini-2.5-flash @ google</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">211 K</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">19 K</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0,04</p></td> </tr> </tbody> </table> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p>Tri različiti provajderi za točno isti model DeepSeek V4 Pro: * <code>ollama-cloud</code>→ <strong>plaćeni Pro abonament</strong> (oblak koji upravlja Ollama) * <code>ollama-b</code>→ <strong>drugi Pro abonman</strong>, izolovan u posebnnom Docker kontejneru * <code>ollama</code>→ instanca lokalnog jezika, <strong>besplatna</strong> (se pokreće direktno na moj računar) Suma od trije daje 936M ulaz, 8,4M izlaz — to je moja ukupna potrošnja DeepSeek V4 Pro, svi provajderi uključen. Samo`ollama-cloud`(220M input) košta pretplatu. Preostalih 716M je besplatno (lokalno ili kumulacija pretplata).</p> </div> </td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_modeli_unutar_sesije_šta_tabela_sesije_ne_vidi">Modeli unutar sesije : Šta tabela sesije ne vidi</h3> <div class="paragraph"> <p>сто`session`Ne zabeležuje samo <strong>glavni</strong> model sesije. Ali tokom iste sesije, agent OpenCode može prebacivati između više modela. Tabela`message`otkriva :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">Modèles utilisés dans les messages (ollama-cloud provider) : ├─ deepseek-v4-pro 1 441 msgs (32%) ├─ qwen3.5:397b 1 217 msgs (27%) ├─ glm-5.1 712 msgs (16%) ├─ kimi-k2.6:cloud 634 msgs (14%) ├─ qwen3-coder:480b 414 msgs (9%) ├─ gpt-oss:20b 34 msgs (0,8%) ├─ qwen3-coder-next 27 msgs (0,6%) └─ gemma4:31b 7 msgs (0,2%)</code></pre> </div> </div> <div class="admonitionblock caution"> <table> <tr> <td class="icon"> <i class="fa icon-caution" title="🔒"></i> </td> <td class="content"> <div class="paragraph"> <p>Više ne koristim Qwen, GLM, Kimi ni druge modele. Pojavljuju se u istoriji jer sam testirao mnogo stvari u april. Od polovine maja, zaključan sam na DeepSeek V4 Pro — to je jedini koji drži opterećenje na dugoročnom kontekstu sa agenskom upravljanjem (cf. <a href="0112_comparaison_kimi_glm_deepseek_long_contexte_plugin_gradle_opencode_post.html">moja poređenja Kimi/GLM/DeepSeek</a>). 32% poruka DeepSeek u istoriji je zavedeško: danas je 100%.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_тарифна_успоредба_запaдни_провајдери">Тарифна Успоредба — Запaдни Провајдери</h2> <div class="sectionbody"> <div class="paragraph"> <p>Питање која узарађује: колико би ишта потрошња код традиционалних добavljaча костила?</p> </div> <div class="paragraph"> <p>Moj izračun za poređenje :<strong>220M tokena ulaz + 1,9M tokena izlaz</strong>— <strong>samo</strong> volumen prošao kroz`ollama-cloud`(jedini koji odgovara mojoj plaćenoj pretplati). Preostalih 716M je besplatno (Ollama lokalno i instanca Docker B).</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 23.0769%;"> <col style="width: 15.3846%;"> <col style="width: 15.3846%;"> <col style="width: 15.3846%;"> <col style="width: 15.3846%;"> <col style="width: 15.3847%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">dostavljač</th> <th class="tableblock halign-left valign-top">Model</th> <th class="tableblock halign-left valign-top">$/M</th> <th class="tableblock halign-left valign-top">Output \$/M</th> <th class="tableblock halign-left valign-top">Кошта/месец</th> <th class="tableblock halign-left valign-top">× moja pretplata</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Moj setup</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">DeepSeek V4 Pro</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">0</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">0</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>\~20€</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>1×</strong></p></td> </tr> </tbody> </table> <div class="sect2"> <h3 id="_antropički_claude">antropički — Claude</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 27.2727%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1819%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Model</th> <th class="tableblock halign-left valign-top">$/M</th> <th class="tableblock halign-left valign-top">Izlaz $/M</th> <th class="tableblock halign-left valign-top">Cena/mesec</th> <th class="tableblock halign-left valign-top">× moja pretplata</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Opus 4.7</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$25</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1 148</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>57×</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Sonet 4.6</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$15</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$689</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>34×</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Haiku 4.5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$230</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>11×</strong></p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Čak i Haiku 4.5, najekonomiji model Claude-a, košta 11× moju pretplatu. I on ne zna ništa o mom kodbazi, ne generiše u mom stilu, i halucinira na Gradle Kotlin DSL API-jeve.</p> </div> </div> <div class="sect2"> <h3 id="_openai_gpt">OpenAI — GPT</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 27.2727%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1819%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Модел</th> <th class="tableblock halign-left valign-top">\$/M</th> <th class="tableblock halign-left valign-top">Излаз \$/M</th> <th class="tableblock halign-left valign-top">Цена/месец</th> <th class="tableblock halign-left valign-top">× moja pretplata</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">GPT 5.5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$30</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1 157</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>58×</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">GPT 5.4</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$2,50</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$15</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$579</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>29×</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">GPT 5.4 Mini</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0,75</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$4,50</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$174</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>9×</strong></p></td> </tr> </tbody> </table> </div> <div class="sect2"> <h3 id="_google_gemini">Google — Gemini</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 27.2727%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1819%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Model</th> <th class="tableblock halign-left valign-top">$/M</th> <th class="tableblock halign-left valign-top">Изалаз \$/M</th> <th class="tableblock halign-left valign-top">Cena/mesec</th> <th class="tableblock halign-left valign-top">× moja pretplata</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Gemini 3.1 Pro</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$2,00</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$10</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$459</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>23×</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Gemini 3 Flash</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0,30</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1,50</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$69</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>3,5×</strong></p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Gemini 3 Flash po 69€ je jedini konkurent « blizu » po čistoj ceni — ali je to lagani gust model, nije MoE 1.6T kao DeepSeek V4 Pro. Kvalitet generisanog koda nema veze.</p> </div> </div> <div class="sect2"> <h3 id="_huggingface_inference_providers">HuggingFace Inference Providers</h3> <div class="paragraph"> <p>HuggingFace ne vrši inferenciju sam — on agregira <strong>providers</strong> treće strane (Novita, Together, DeepInfra, Cerebras, SambaNova, Fireworks, Groq…) putem jedinstvenog API-ja. Odabira se najjeftiniji ili najbrži provider. Evo tarifa koji su primeteni u maju 2026. za DeepSeek V4 Pro:</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 27.2727%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1819%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Провајдер HF</th> <th class="tableblock halign-left valign-top">$/M</th> <th class="tableblock halign-left valign-top">Izlaz $/M</th> <th class="tableblock halign-left valign-top">Trošak/mesec</th> <th class="tableblock halign-left valign-top">× моја преплата</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Novita (najjeftiniji)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1,67</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$3,38</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>\$374</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>19×</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">DeepInfra</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1,74</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$3,48</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>\$389</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>19×</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Zajedno</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$2,10</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$4,40</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>$470</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>23×</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">вежињаци</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">nejavni tarif</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">—</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">—</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">—</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Čak i najjeftiniji provider na HuggingFace-u (Novita) naplaćuje 19× cijenu moje pretplate. I nasuprot Ollama Cloud-u, HuggingFace naplaćuje <strong>uz to</strong> platforme trošak ako nemate PRO HF pretplatu (\$9/mois).</p> </div> </div> <div class="sect2"> <h3 id="_groq">Groq</h3> <div class="paragraph"> <p>Groq nema <strong>ni jedan</strong> od modela koje koristim — njihov katalog se ograničava na GPT-OSS, Llamu i Qwen 32B. Ne može se porediti.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_usporedba_tarifa_kineski_dobavljači">Usporedba tarifa — Kineski dobavljači</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pravi test je kineski tržište. Ako je DeepSeek kineski model, njegov nativni API bi trebao da bude jeftiniji, nije li?</p> </div> <div class="sect2"> <h3 id="_deepseek_api_direct_platform_deepseek_com">DeepSeek API Direct (platform.deepseek.com)</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 22.2222%;"> <col style="width: 22.2222%;"> <col style="width: 22.2223%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Period</th> <th class="tableblock halign-left valign-top">\$/M</th> <th class="tableblock halign-left valign-top">$/M</th> <th class="tableblock halign-left valign-top">Цена/месец</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Akcija -75% (do 31. maja)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0,435</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0,87</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>$98</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Pun tarif (od juna)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1,74</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$3,48</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>\$390</strong></p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Čak i sa agresivnom akcijom DeepSeek (-75% produžena), izravni API košta<strong>5×</strong>скожije. При обычном тарифу,<strong>20×</strong>. И то је само DeepSeek — нема приступа другим моделима.</p> </div> </div> <div class="sect2"> <h3 id="_kimi_moonshot_platform_kimi_com">Kimi Moonshot (platform.kimi.com)</h3> <div class="paragraph"> <p>Kimi nudi samo svoje modele. Bez DeepSeek.</p> </div> </div> <div class="sect2"> <h3 id="_alibaba_bailian_bailian_aliyun_com">Alibaba Bailian (bailian.aliyun.com)</h3> <div class="paragraph"> <p>Jedini dobavljač koji zagreguje sve kineske modele — ali putem reprodaje sa maržom. Cene se dinamički učitaju u JavaScriptu, čime je skraćivanje nemoguće.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_сажетна_табела_сви_пружаоци">Сажетна табела — Сви пружаоци</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 23.0769%;"> <col style="width: 15.3846%;"> <col style="width: 15.3846%;"> <col style="width: 15.3846%;"> <col style="width: 15.3846%;"> <col style="width: 15.3847%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Dobavljač</th> <th class="tableblock halign-left valign-top">Model</th> <th class="tableblock halign-left valign-top">\$/M</th> <th class="tableblock halign-left valign-top">Output \$/M</th> <th class="tableblock halign-left valign-top">Trošak/mesec</th> <th class="tableblock halign-left valign-top">× moja pretplata</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ollama Cloud Pro</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">DeepSeek V4 Pro</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">0</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">0</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>~20€</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>1×</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Gemini 3 Flash</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Gemini 3 Flash</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0,30</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1,50</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$69</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">3,5×</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">DeepSeek API (promo)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">DeepSeek V4 Pro</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0,44</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0,87</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$98</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">5×</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">GPT 5.4 Mini</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">GPT 5.4 Mini</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$0,75</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$4,50</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$174</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">9×</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Claude Haiku 4.5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Claude Haiku 4.5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$230</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">11×</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">HuggingFace/Novita</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">DeepSeek V4 Pro</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1,67</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$3,38</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$374</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">19×</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">DeepSeek API (normalno)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">DeepSeek V4 Pro</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1,74</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$3,48</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$390</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">20×</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Zajedno AI</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">DeepSeek V4 Pro</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$2,10</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$4,40</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$470</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">23×</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">GPT 5.4</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">GPT 5.4</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$2,50</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$15</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$579</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">29×</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Claude Sonnet 4.6</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Claude Sonnet 4.6</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$15</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$689</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">34×</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Claude Opus 4.7</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Claude Opus 4.7</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$25</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1 148</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">57×</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">GPT 5.5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">GPT 5.5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$30</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\$1 157</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">58×</p></td> </tr> </tbody> </table> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontSize 11 title Prognozovani mesečni trošak — 220M Input + 1,9M Output rectangle "Ollama Cloud Pro ~20 evra" as OC #4CAF50 rectangle "Gemini Flash \$69" as GF #8BC34A rectangle "DeepSeek promo \$98" as DSP #FFC107 rectangle "GPT Mini $174" as GM #FF9800 rectangle "Claude Haiku\n\$230" as CH #FF5722 rectangle "HF/Novita \$374" as HF #F44336 rectangle "DeepSeek standardno \$390" as DSN #F44336 rectangle "GPT 5.4 $579" as G4 #D32F2F rectangle "Claude Sonnet $689" as CS #D32F2F rectangle "Claude Opus \$1 148" as CO #B71C1C rectangle "GPT 5.5 \$1 157" as G5 #880E4F note bottom of OC DeepSeek V4 Pro 1.6T MoE + accès à tout le catalogue Ollama Cloud (Qwen, GLM, Kimi...) Inclus dans l'abonnement end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_sakriveni_trošak_prompt_engineering_i_iteracije">Sakriveni trošak : Prompt Engineering i iteracije</h2> <div class="sectionbody"> <div class="paragraph"> <p>Trošak tokena je samo jedan deo jednačine. Stvarni trošak je vreme programera.</p> </div> <div class="paragraph"> <p>Sa OpenCode + Ollama Cloud Pro + moj agent upravljanja (EAGER/LAZY/Hot/Warm/Cold, opisano u <a href="0108_gouvernance_agent_opencode_eager_lazy_post.html">članak o upravljanju</a>), dobijam :</p> </div> <div class="ulist"> <ul> <li> <p><strong>0 ponavljajuće inženjerstvo prompta</strong>: kontekst se automatski injektuje</p> </li> <li> <p><strong>90%+ prvi pokusaj tačan</strong>: kod se kompajlira od prvog puta</p> </li> <li> <p><strong>Нула халциноци deepseek за 8 узастопних сесија</strong>(dokumentirano u <a href="0112_comparaison_kimi_glm_deepseek_long_contexte_plugin_gradle_opencode_post.html">uporedba Kimi/GLM/DeepSeek</a>)</p> </li> </ul> </div> <div class="paragraph"> <p>Sa Claudom ili GPT <strong>bez</strong> fine-tuninga ni upravljanja:</p> </div> <div class="ulist"> <ul> <li> <p>2-3 iteracije po zadatku u proseku</p> </li> <li> <p>Sistematsko prompt inženjerstvo</p> </li> <li> <p>Halucinacije na API-je Kotlin/Gradle kada kontekst prelazi 30K tokena</p> </li> </ul> </div> <div class="paragraph"> <p>Mesečni efikasan trošak — tokens × iteracije × vreme korekcije — iznosi 27× do 54× onog mojeg rešenja, kao što sam pokazao u <code><a href="0122_ratio_efficacite_27x_45x_flotte_experts_ia_vs_claude_gpt_post.html">l’article sur le ratio d’efficacité</a></code>.</p> </div> </div> </div> <div class="sect1"> <h2 id="_кумулисање_претплата_ollama_cloud_pro_докер_метод">Кумулисање претплата Ollama Cloud Pro: Докер метод</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ako jedan abonman ne dostaća, kombinujemo ih. Princip je da se svaki abonman izoliere u sopstnoj instalaciji Ollama, sa sopstnim SSH ključem za autentifikaciju. Docker to čini trivijalnim.</p> </div> <div class="paragraph"> <p>Kompletna metoda je detaljno opisana u <a href="0120_cumuler_deux_abonnements_ollama_pro_docker_post.html">članak o kumuliranju Docker</a>, evo principa :</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontSize 12 title Arhitektura — Dva abonmana Ollama Cloud Pro na jednoj mašini left to right direction node "Moja fizička mašina" { frame "Ollama instanca A (prirodni) ulazni port :11434" as Native { database "Identitet A /usr/share/ollama/.ollama/id_ed25519" } frame "Instanca Ollama B (Docker) vrata :11435" as Docker { database "Identity B ~/ollama-b-data/id_ed25519" } } cloud "Ollama Cloud" { actor "Račun Pro A\n(e-mail 1)" as A actor "Račun Pro B\n(e‑mail 2)" as B } Native --> A : "Ključ uređaja A" Docker --> B : "Ključ uređaja B" note bottom of Docker Conteneur Docker isolé : - Clé SSH distincte - Port réseau distinct (11435) - Volume persistant (~/ollama-b-data) - restart: always end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Шема је једноставана :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Створити волуме`~/ollama-b-data`</p> </li> <li> <p>Pokreni Docker kontejner`ollama/ollama:0.20.2`мапиран на`11435:11434`</p> </li> <li> <p>Preuzeti SSH ključ iz kontejnera → ga sacuvati na ollama.com</p> </li> <li> <p>Правити`ollama signin`sa drugim e-mailom</p> </li> <li> <p>Konfigurisati OpenCode sa dva pružatelja (`ollama`на :11434,`ollama-b`на :11435</p> </li> </ol> </div> <div class="paragraph"> <p>Dva računa, plava kartica, nula konflikata.</p> </div> </div> </div> <div class="sect1"> <h2 id="_šta_audit_ne_meri">Šta Audit Ne Meri</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 40%;"> <col style="width: 60%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">слепи угао</th> <th class="tableblock halign-left valign-top">Утицај</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Kvalitet proizvedenog koda</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2,6 miliјарди tokena ne kažu da li kod kompajlira. Moje 8 sesija DeepSeek V4 Pro ima stopu prvog pokusa >90%.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>ekosistem OpenCode</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">CLI je besplatan, ali njegova vrednost (agenti, sandboxes, istorija, keširanje prompta) je ogromna. Nije uključen u cenu pretplate — to je poseban alat.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>gelekost troška</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Trošenje 2 sata dnevno na ispravljanje halucinacija manjeg modela košta više od 20€ mesečno.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>мир духа</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Fiksna cena = bez iznenađenja. Sa cenom po tokenu, skok u aktivnosti može da nanese vešta štetu.</p></td> </tr> </tbody> </table> <div class="admonitionblock warning"> <table> <tr> <td class="icon"> <i class="fa icon-warning" title="⚠️"></i> </td> <td class="content"> <div class="paragraph"> <p>Navedene cene su one od maja 2026. Za šest meseci sve će biti sniženo. Ali strukturani odnos snaga — fiksna pretplata vs. naplaćivanje po korišćenju — ostatiće pogodan za pretplatu za velike potrošače.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_закључак_пресуда_бројева">Закључак: Пресуда бројева</h2> <div class="sectionbody"> <div class="paragraph"> <p>Posle 73 dana, 1 022 sesije OpenCode, i 2,6 miljarde tokena :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 60%;"> <col style="width: 40%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">metrički</th> <th class="tableblock halign-left valign-top">вердикт</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Kumulativni vanjski trošak API</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>$0,22</strong>(skoro nula)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Cena pretplate Ollama Cloud Pro</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>~20€/mesec</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Ekvivalent Claude Opus</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>$1 148/mesec</strong>— 57× skuplje</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Ekvivalent GPT 5.5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>$1 157/месец</strong>— 58× skuplje</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Ekivalent HuggingFace/Novita</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>\$374/mesec</strong>— 19× scupije</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">direktni ekvivalent DeepSeek API</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>$390/mesec</strong>— 20 puta skuplji</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Najjeftiniji ekvivalent (Gemini Flash)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>\$69/mesec</strong>— 3,5× skuplji, niži model</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Najbolja ponuda na tržištu</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ollama Cloud Pro po 20€/mesec</strong>— neporaziv</p></td> </tr> </tbody> </table> <div class="paragraph"> <p><em>__</em> Za 20€ mesečno za pristup DeepSeek V4 Pro (1.6T parametara, MoE, CSA+HCA, 1M kontekst) putem Ollama Clouda, imam najbolji odnos cena/kvaliteta na svetskom tržištu. Čak i kineski dobavljači koji rade direktno su 5× do 20× skuplji. Čak i HuggingFace, sa svojom agregacijom low-cost provajdera, je 19× skuplji. Zapadni tržište (Claude, GPT) košta 50-60× više — to je druga planeta.</p> </div> <div class="paragraph"> <p>Ovaj odnos je toliko neujednačen da ne može da traje vekom. Iskoristite ga dok postoji. <em>__</em></p> </div> <div class="paragraph"> <p>Onda da, moj mesečni iznos od 20 para, to je najbolji tehnički ulaganje u mom životu programera. I sad imate brojeve da to dokazujete.</p> </div> <hr> </div> </div> <div class="sect1"> <h2 id="_reference">Reference</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="0108_gouvernance_agent_opencode_eager_lazy_post.html">Член 0108 — Управљање агент EAGER/LAZY/Hot/Warm/Cold</a></p> </li> <li> <p><a href="0112_comparaison_kimi_glm_deepseek_long_contexte_plugin_gradle_opencode_post.html">Clanak 0112 — DeepSeek V4 Pro vs Kimi K2.6 vs GLM 5.1</a></p> </li> <li> <p><a href="0119_benchmark_dgx_spark_vs_cloud_abonnement_llm_post.html">Članak 0119 — Benchmark DGX Spark vs Cloud vs Pretplate LLM</a></p> </li> <li> <p><a href="0120_cumuler_deux_abonnements_ollama_pro_docker_post.html">Члан 0120 — Комбиновати два преплате Ollama Cloud Pro са Docker-ом</a></p> </li> <li> <p><a href="0121_plugin_gradle_piloter_deux_instances_ollama_pro_post.html">Члан 0121 — Gradle додатак за управљање двема инстанцама Ollama</a></p> </li> <li> <p><a href="0122_ratio_efficacite_27x_45x_flotte_experts_ia_vs_claude_gpt_post.html">Članak 0122 — Odnos efikasnosti od 27× do 54×</a></p> </li> </ul> </div> <div class="sect2"> <h3 id="_izvori_tarifa">Izvori tarifa</h3> <div class="ulist"> <ul> <li> <p><a href="https://ollama.com/pricing">Ollama Cloud — Pro tarife $20/mesec</a></p> </li> <li> <p><a href="https://api-docs.deepseek.com/quick_start/pricing">DeepSeek API — Službene tarifе V4 Pro</a></p> </li> <li> <p><a href="https://platform.kimi.com/docs/pricing/chat-k26">Kimi Moonshot — Tarife K2.6</a></p> </li> <li> <p><a href="https://huggingface.co/inference/models">HuggingFace Inference Providers — Cene po provideru</a></p> </li> <li> <p><a href="https://www.anthropic.com/pricing">Anthropic — Cenovnik Claude API</a></p> </li> <li> <p><a href="https://openai.com/api/pricing/">OpenAI — cene GPT API</a></p> </li> <li> <p><a href="https://together.ai/pricing">Together AI — Cene inferencije</a></p> </li> <li> <p><a href="https://groq.com/pricing">Groq — Cene API</a></p> </li> <li> <p><a href="https://deepinfra.com/pricing">DeepInfra — Cene GPU i modeli</a></p> </li> <li> <p><a href="https://help.aliyun.com/zh/model-studio/text-generation-model/">Alibaba Bailian — Dostupni modeli</a></p> </li> <li> <p><a href="https://github.com/anomalyco/opencode">OpenCode — CLI otvorenog koda na GitHub-u</a></p> </li> </ul> </div> </div> </div> </div> https://cheroliv.com/blog/2026/0124_architecture_plugin_gradle_racine_consommateur_independant_post.html Thu, 14 May 2026 00:00:00 +0000 blog/2026/0124_architecture_plugin_gradle_racine_consommateur_independant_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_problem_tri_arhitekture_koje_su_mi_potrošile_vreme">Problem: Tri arhitekture koje su mi potrošile vreme</a> <ul class="sectlevel2"> <li><a href="#_option_1_izoljirani_plugin_bez_dogfoodinga">Option 1 : Izoljirani plugin (bez dogfoodinga)</a></li> <li><a href="#_opcija_2_klasicni_monorepo_includeplugin">Opcija 2 : Klasicni Monorepo (<code>include(":plugin")</code>)</a></li> <li><a href="#_opcija_3_kompozitni_build_includebuild">Opcija 3 : Kompozitni build (<code>includeBuild()</code>)</a></li> </ul> </li> <li><a href="#_решение_два_независних_билда_један_потрошачки_корењ">Решение: Два независних БИЛДА, Један потрошачки корењ</a> <ul class="sectlevel2"> <li><a href="#_radni_tok">Radni tok</a></li> <li><a href="#_конкретан_воркфлоу">конкретан воркфлоу</a></li> </ul> </li> <li><a href="#_zašto_mi_je_ova_arhitektura_osvojila">Zašto mi je ova arhitektura osvojila</a> <ul class="sectlevel2"> <li><a href="#_1_natvorno_dogfooding_instant_feedback">1. Natvorno dogfooding, instant feedback</a></li> <li><a href="#_2_клонирање_без_конфигурације">2. Клонирање без конфигурације</a></li> <li><a href="#_3_izolovane_gradnje_neovisni_ci">3. Izolovane gradnje, neovisni CI</a></li> </ul> </li> <li><a href="#_anatomija_poddirektorijuma_name_plugin">Anatomija poddirektorijuma `{name}-plugin/</a> <ul class="sectlevel2"> <li><a href="#_katalog_verzija_dva_različita_fajla">Katalog verzija: Dva različita fajla</a></li> </ul> </li> <li><a href="#_шта_не_радимо">Шта не радимо</a></li> <li><a href="#_uporedjenje_tri_arhitekture_protiv_dogfoodinga">Uporedjenje : Tri arhitekture protiv dogfoodinga</a></li> <li><a href="#_ugovor_dag_jedna_korenjska_izgradnja_nikada_ne_uvozi_iz_poddirektorijuma">Ugovor DAG: Jedna korenjska izgradnja nikada ne uvozi iz poddirektorijuma</a></li> <li><a href="#_zaključak_izvidljiva_duplikacija_koja_ušteda_vreme">Zaključak: Izvidljiva duplikacija koja ušteda vreme</a></li> <li><a href="#_референце">Референце</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 11 minutes</div> <p>Klonirate depo Gradle plugin-a. Otvarate terminal. Šta ukucavate zatim ?<code>./gradlew tasks</code>, naravno. Ali u kojem direktorijumu ? Koren ? Potmodul ? Треба ли прво прочитати README да бисте знали како да builder? Ако ви колебаљете се не би било Za samo sekundu, arhitektura projekta je pokvarena.</p> </div> <div class="paragraph"> <p>Ovde je kako sam rešio ovaj problem jednom za sve — i zašto ovo pattern je danas potpis svih mojih Gradle plugina u`foundry/public/`.</p> </div> </div> </div> <div class="sect1"> <h2 id="_problem_tri_arhitekture_koje_su_mi_potrošile_vreme">Problem: Tri arhitekture koje su mi potrošile vreme</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pre nego što se konvergirao ka trenutnom pattern-u, pokušavao sam između tri pristupa класични за организацију Gradle plugина. Svaka je imala fatalан недостатак.</p> </div> <div class="sect2"> <h3 id="_option_1_izoljirani_plugin_bez_dogfoodinga">Option 1 : Izoljirani plugin (bez dogfoodinga)</h3> <div class="paragraph"> <p>Projekt sadrži samo dodatak. Nema primer upotrebe. Nema Пројекат који га извршава. Да би се тестирао, треба створити споњи пројекат, y navesti dodatak preko`mavenLocal`ili jedan kompozitni build, i samo proveri tamo da radi</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-shell hljs" data-lang="shell">$ git clone mon-plugin $ cd mon-plugin $ ./gradlew build # le plugin compile $ # ... et maintenant ? comment je l'essaie ?</code></pre> </div> </div> <div class="admonitionblock warning"> <table> <tr> <td class="icon"> <i class="fa icon-warning" title="⚠️"></i> </td> <td class="content"> <div class="paragraph"> <p>Gradle dodatak bez primera konsumacije je biblioteka bez testovi integracije. Nikada ne znate da li je poslednja izmena pokvario korisničko iskustvo.</p> </div> </td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_opcija_2_klasicni_monorepo_includeplugin">Opcija 2 : Klasicni Monorepo (<code>include(":plugin")</code>)</h3> <div class="paragraph"> <p>Gradle`init`генерише`settings.gradle.kts`са`include("plugin")`. Root i potmodul dele isti demon, iste konfiguracije, исти каталози. Практično, али повезано.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">. ├── settings.gradle.kts → include("plugin") ├── build.gradle.kts → plugins { id("mon-plugin") } ├── plugin/ │ └── build.gradle.kts → java-gradle-plugin └── gradle/ └── libs.versions.toml</code></pre> </div> </div> <div class="paragraph"> <p>Шта пречи:</p> </div> <div class="ulist"> <ul> <li> <p>Корен<strong>treba</strong>imati istu verziju Gradle-ja kao podmodul</p> </li> <li> <p>`libs.versions.toml`je podeljeno — zajednički katalogi verzija, zavisnosti</p> </li> </ul> </div> <div class="paragraph"> <p>који бегу из једног модула у другом.</p> </div> <div class="ulist"> <ul> <li> <p>Nemoguće je izgraditi plugin nezavisno od root.</p> </li> <li> <p>CI mora da izgradi oba modula, čak i ako se promenio samo plugin.</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_opcija_3_kompozitni_build_includebuild">Opcija 3 : Kompozitni build (<code>includeBuild()</code>)</h3> <div class="paragraph"> <p>Podelimo ih u dva zasebna Gradle builda i povežemo ih putem <code>includeBuild("mon-plugin")`у`settings.gradle.kts</code>.</p> </div> <div class="paragraph"> <p>Већ је боље. Сграда plugina је изолирана. Али потрошач. Mora eksplicitno referencirati vanjski build — i izlaz iz `./gradlew tasks`u korenju zavisi od ispravne konfiguracije kompozitno. Kloniranje nije zero-config: moraš znati da je plugin se nalazi u posebnom folderu, što ga root referencuje, itd.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-shell hljs" data-lang="shell">. ├── settings.gradle.kts → includeBuild("plugin-build/") ├── build.gradle.kts → plugins { id("mon-plugin") } └── plugin-build/ ├── settings.gradle.kts └── build.gradle.kts</code></pre> </div> </div> <div class="paragraph"> <p>Tražio sam bolje. Mnogo bolje.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_решение_два_независних_билда_један_потрошачки_корењ">Решение: Два независних БИЛДА, Један потрошачки корењ</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovo je obrazac koji sam na kraju prihvatio:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">. ├── settings.gradle.kts ← racine consommateur ├── build.gradle.kts ← 3 lignes : apply plugin + dogfood ├── gradle/ │ └── libs.versions.toml ← catalogue du consommateur ├── {name}-plugin/ ← BUILD INDÉPENDANT │ ├── gradlew ← son propre wrapper │ ├── settings.gradle.kts ← rootProject.name = "{name}-plugin" │ ├── build.gradle.kts ← java-gradle-plugin, signing, publish │ ├── gradle/ │ │ ├── libs.versions.toml ← catalogue du plugin │ │ └── wrapper/ │ ├── src/ ← sources du plugin │ ├── .agents/ ← gouvernance agent │ └── *.adoc ← AGENT, PROMPT_REPRISE, snapshot, etc. └── site.yml / slides-context.yml / ... ← configs dogfood</code></pre> </div> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p>Кључ :`{name}-plugin/`је Gradle пројекат <strong>пун и самодостајан</strong>. On poseduje svoj wrapper, svoje postavke, svoj katalog od verzije. On se klonira, se gradi, se testira i se objavljuje bez root. da bude u toku sa njenim postojanjem</p> </div> </td> </tr> </table> </div> <div class="paragraph"> <p>Root, on, ne radi ništa osim: primene plugina.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">plugins { alias(libs.plugins.bakery) } repositories { mavenLocal() mavenCentral() } bakery { configPath = file("site.yml").absolutePath }</code></pre> </div> </div> <div class="paragraph"> <p>Три линије у случају`bakery-gradle`. Ništa više. Nula`include()<code>, nula`includeBuild()</code>, nult podprojekat. običan Gradle build koji primenjuje plugin kao bolo Koji potrošač bi ga uradio.</p> </div> <div class="sect2"> <h3 id="_radni_tok">Radni tok</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontSize 12 left to right direction package "korijen (potrošač)" #CCFFCC { usecase "Клонирај репозиторијум" as Clone usecase "Зачувај све код спанове у обратним наводнима (`...`) тако да остају не промењени — никогда не мењај садржај, размак или позицију у обратним наводнима." as Tasks usecase "./gradlew bake" as Dogfood note bottom of Dogfood Exerce le plugin Feedback immédiat Zéro config end note } package "{name}-plugin/ (Nezavisna gradnja)" #CCE5FF { usecase "./gradlew build" as BuildPlugin usecase "./gradlew publishToMavenLocal" as MavenLocal usecase "./gradlew test" as TestPlugin note bottom of BuildPlugin Cycle de vie isolé Tests unitaires + Cucumber CI dédiée possible end note } Clone -down-> Tasks Tasks -down-> Dogfood Dogfood ..> MavenLocal : "Zavisno od plugina Objavljeno lokalno" BuildPlugin -up-> MavenLocal TestPlugin -up-> BuildPlugin @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_конкретан_воркфлоу">конкретан воркфлоу</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-shell hljs" data-lang="shell"># 1. Builder le plugin $ cd codebase-plugin $ ./gradlew publishToMavenLocal # 2. L'exercer depuis la racine $ cd .. $ ./gradlew indexCodebase queryCodebase snapshot # La boucle est fermée. Le plugin est testé dans des conditions # réelles de consommation, par le projet même qui l'héberge.</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_mi_je_ova_arhitektura_osvojila">Zašto mi je ova arhitektura osvojila</h2> <div class="sectionbody"> <div class="paragraph"> <p>Tri prednosti koje, kombinovane, vredne su troška «duplikacije» :</p> </div> <div class="sect2"> <h3 id="_1_natvorno_dogfooding_instant_feedback">1. Natvorno dogfooding, instant feedback</h3> <div class="paragraph"> <p>Najbolji test Gradle plugina je da ga koristite. Nije mockovan unit test. Nije`GradleRunner`са један пројекат od test. Jedna <strong>stvarna</strong> gradnja koja primenjuje plugin na stvarne datoteke.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-shell hljs" data-lang="shell">$ git clone bakery-gradle $ cd bakery-gradle $ ./gradlew bake # ← le plugin est exercé immédiatement</code></pre> </div> </div> <div class="paragraph"> <p>Ako je plugin pokvaren, koren build to kaže. Nije potrebno ići. претрага vanjског тест пројекта. Dogfooding је <strong>први</strong> Zadatak pokrenut od novog saradnika. To je konačni smoke test.</p> </div> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="💡"></i> </td> <td class="content"> <div class="paragraph"> <p>Pravilo je jednostavno: ako koren kompajlira i`./gradlew tasks` Prikazuje vaše zadatke plugina, plugin je funkcionalan. Nema iznenađenja u proizvodnji</p> </div> </td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_2_клонирање_без_конфигурације">2. Клонирање без конфигурације</h3> <div class="paragraph"> <p>Un `git clone && ./gradlew tasks`и нови доњац види све ходети без конфигурисања. (space after period) Actually I’ll output exactly: "ходети без конфигурисања. " (including trailing space). Let’s produce that.</p> </div> <div class="paragraph"> <p></think> ходети без конфигурисања.`build.gradle.kts`koren je жива документација за коришћење додатка. Ле`site.yml`pored Prikazuje očekivanu konfiguraciju.</p> </div> <div class="paragraph"> <p>Uporedite sa alternativom: jedan README od tri paragrafa koji objasni kako da se gradi plugin i kako da se gradi projekat од тест. Један нови садарник чита README у дијагонали, greši, otvara problem — dok informacija mogla бити <strong>извршено</strong>.</p> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p>Najjača dokumentacija nije ona koju se čita. To je ona koja<strong>извршава</strong>. Корениј build je dokumentacija. Izvršni fajl plugina.</p> </div> </td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_3_izolovane_gradnje_neovisni_ci">3. Izolovane gradnje, neovisni CI</h3> <div class="paragraph"> <p>Plugin ima svoj Gradle wrapper, svoj životni ciklus, svoje testove. Možete:</p> </div> <div class="ulist"> <ul> <li> <p>Ažuriraj Gradle u pluginu bez dotaćanja root-a</p> </li> <li> <p>Dodajte zavisnost u plugin bez da protekne u koren</p> </li> <li> <p>pokvariti plugin bez uticaja na korenski build (dokle ne</p> </li> </ul> </div> <div class="paragraph"> <p>Ne objavljivajte pokvarenu verziju)</p> </div> <div class="ulist"> <ul> <li> <p>Da postoji CI koja build/test plugin, i druga koja exerce</p> </li> </ul> </div> <div class="paragraph"> <p>root — nezavisno</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">.github/workflows/ ├── test-plugin.yml → codebase-plugin/.gradlew build ├── test-root.yml → .gradlew tasks (vérifie que le plugin est consommable) └── publish.yml → codebase-plugin/.gradlew publish</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_anatomija_poddirektorijuma_name_plugin">Anatomija poddirektorijuma `{name}-plugin/</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pogledajmo bliže šta živi u folderu dodatka:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">codebase-plugin/ ├── gradlew ← wrapper indépendant ├── settings.gradle.kts ← @Suppress("UnstableApiUsage") │ + foobar-resolver-convention ├── build.gradle.kts ← java-gradle-plugin + signing + publish ├── gradle/ │ ├── libs.versions.toml ← catalogue complet (langchain4j, pgvector...) │ └── wrapper/ ├── buildSrc/ ← classes utilitaires buildSrc │ ├── build.gradle.kts │ └── src/main/kotlin/ │ ├── codebase/ ← CodebaseYmlAnonymizer, CodebaseConfiguration │ ├── benchmark/ ← BenchmarkConfig, BenchmarkProtocol │ ├── readme/ ← ReadmeYmlAnonymizer │ ├── site/ ← SiteYmlAnonymizer │ ├── slider/ ← SliderYmlAnonymizer │ └── snapshot/ ← SnapshotManager ├── src/ │ ├── main/kotlin/codebase/ │ │ ├── CodebasePlugin.kt ← class Plugin<Project> │ │ ├── rag/ ← pgvector, embedding, anonymization... │ │ ├── benchmark/ ← BenchmarkRunner, export, comparison... │ │ └── walker/ ← WorkspaceWalker │ └── test/ │ ├── kotlin/codebase/scenarios/ ← steps Cucumber │ ├── features/ ← .feature files │ └── resources/datasets/ ← fixtures .adoc, .yml, .json ├── .agents/ ← gouvernance agent (INDEX, SESSIONS, etc.) ├── AGENT.adoc ← règles agent ├── PROMPT_REPRISE.adoc ← mission session ├── BACKLOG.adoc ← backlog produit ├── snapshot.adoc ← snapshot auto-généré du projet └── embeds.yml ← config RAG embeds</code></pre> </div> </div> <div class="paragraph"> <p>Sve je ovde. Nema disperzije između korena i podfolderska. Razvijalac koji radi na pluginu nikada ne treba оставити`codebase-plugin/`. Razvojnik koji koristi plugin gleda samo koren — i`build.gradle.kts`od 3 linija on mu kaže sve što mu je potrebno znati.</p> </div> <div class="sect2"> <h3 id="_katalog_verzija_dva_različita_fajla">Katalog verzija: Dva različita fajla</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 25%;"> <col style="width: 37.5%;"> <col style="width: 37.5%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>gradle/libs.versions.toml</code>(корен)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>{name}-plugin/gradle/libs.versions.toml</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Broj zavisnosti</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2-3 (plugin + readme eventualno)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">30+ (langchain4j, pgvector, cucumber…​)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Улога</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Potrositi plugin</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Builder plugin</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Ko ga čita</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Korisnik plugina</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Развојник плагина</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Root ima namerno minimalan katalog. Plugin ima katalog kompletan. Zbunjenje je nemoguće: svaki build ima svoj opseg zavisnosti.</p> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="ℹ️"></i> </td> <td class="content"> <div class="paragraph"> <p>Ako ste već provedli sat u debagovanju kolizije zavisnosti među vašim pluginom i vašim test projekatom, razumete vrednost Ово раздвојање. Независни каталози уклањају овај проблем. po konstrukciji</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_шта_не_радимо">Шта не радимо</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovaj patern nije magičan. On postavlja ograničenje koje ja On mi volontersko zadava bol :</p> </div> <div class="paragraph"> <p><strong>Root ne gradi plugin.</strong> Morate`publishToMavenLocal` ou разврстати на репозиторијум пре него што рут може га да потроши.</p> </div> <div class="paragraph"> <p>Ovo je manji trošak, i ovo je <strong>dobar</strong> ograničenje. Korijen potrošava plugin kao vanjskog klijenta — putem Maven. Tačno kao bi to uradilo projekat treće strane. Ako plugin nije objavljiv, koren vam to odmah kaže</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-shell hljs" data-lang="shell"># La seule "friction" du pattern $ cd codebase-plugin && ./gradlew publishToMavenLocal && cd .. $ ./gradlew tasks --group=codebase</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_uporedjenje_tri_arhitekture_protiv_dogfoodinga">Uporedjenje : Tri arhitekture protiv dogfoodinga</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 20%;"> <col style="width: 20%;"> <col style="width: 20%;"> <col style="width: 20%;"> <col style="width: 20%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Izoljiran plugin</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Monorepo`include()`</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">kompozit`includeBuild()`</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Корен + независни плагин</strong></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">`git clone && gradlew tasks`даје задатке плагина</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">da</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">(Note: Since no French text was provided for translation, the output is empty.)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Izgradite plugin nezavisno od root</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"></think></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Posebne verzije kataloga</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">(nothing)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Нема`include()` ni <code>includeBuild()</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Natiran dogfood bez konfiguracije</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">⚠️</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">CI plugin nezavisna</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Root je primer realne potrošnje.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">⚠️</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Desna kolona označava sva polja. Zato što ja ne Vratiću se više unazad.</p> </div> </div> </div> <div class="sect1"> <h2 id="_ugovor_dag_jedna_korenjska_izgradnja_nikada_ne_uvozi_iz_poddirektorijuma">Ugovor DAG: Jedna korenjska izgradnja nikada ne uvozi iz poddirektorijuma</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ова архитектура се интегрише натурално у DAG-у N0→N3 mojeg radnog prostora. Oblik je : <strong>plugin N2 je hub Iz sopstvenih zavisnosti, koren N3 je terminal koji primenjuje hubove</strong></p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontSize 11 title Ugovor DAG — Korenski potrošač vs nezavisni plugin package "N3 — KORIJEN (skladište)" #FFCCCC { [build.gradle.kts (3 lignes)] as ROOT [libs.versions.toml (minimal)] as ROOT_TOML note right of ROOT plugins { bakery } bakery { configPath = ... } Aucune logique métier end note } package "N2 — {name}-додатак/" #CCFFCC { [build.gradle.kts (complet)] as PLUGIN [src/main/kotlin/] as SRC [gradle/libs.versions.toml] as PLUGIN_TOML [buildSrc/] as BUILDSRC note bottom of PLUGIN java-gradle-plugin signing + publish Tests unitaires + Cucumber CI dédiée end note } ROOT_TOML --> ROOT : "verzija plugina" ROOT -down-> PLUGIN : "publishToMavenLocal" @enduml</pre> </div> </div> <div class="paragraph"> <p>Le <code>codebase-gradle/build.gradle.kts`Pravi 6 linija. Nema`src/</code>, nema`buildSrc/<code>, nema`gradle/rag-bench.gradle.kts</code>. Тачно <code>plugins { alias(libs.plugins.codebase) }`i repozitorijumi. Sva kompleksnost živi u`codebase-plugin/</code>.</p> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak_izvidljiva_duplikacija_koja_ušteda_vreme">Zaključak: Izvidljiva duplikacija koja ušteda vreme</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kada pokazujem ovu strukturu nekom, prva reakcija je često : « Ali imaš dva`gradlew`, dva`settings.gradle.kts`, два`libs.versions.toml`— Ovo je dupliranje!</p> </div> <div class="paragraph"> <p>Да. И не.</p> </div> <div class="paragraph"> <p>Dupliciranje je reprodukcija iste informacije na dva mesta. Ovo su dva <strong>različita</strong> fajla koja sluze dva <strong>različita</strong> namena: каталог плагина (30+ зависимости за builder) и каталог od korena (2-3 zavisnosti za konzumiranje). Omotač plugina (zaključana verzija za razvoj) i omotač korena (potencijalno različita verzija, za vežbu plugina).</p> </div> <div class="paragraph"> <p>Ово није дублирање. Ово је <strong>раздвајање одговорности</strong> примењена у систем од градње. Свака градна Uradi jedno, i samo jedno. Koren konsumira. Plugin se gradi.</p> </div> <div class="paragraph"> <p>Cena? Narudžba`publishToMavenLocal`među izgradnjom plugina i izgradnja korena. Dobit? Arhitektonska jasnoća koja uklanja sate debagovanja u nizu.</p> </div> <div class="paragraph"> <p>Od kada sam primenio ovaj pattern na`bakery-gradle`, <code>plantuml-gradle</code>, <code>codebase-gradle</code>, и остали плугини`foundry/public/<code>, нисам имао Никад више није размишљао при отварању терминала у једном од мојих репозиторијума. prvi refleks —</code>./gradlew tasks`— хода увек, дај уvek добра задатке, и одмах ми каже да ли је све у redu.</p> </div> <div class="paragraph"> <p>To je to, dobra arhitektura. Ne se čita u README-u. Она се тестира у терминалу, у мање од десет секунди.</p> </div> </div> </div> <div class="sect1"> <h2 id="_референце">Референце</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="0105_integrer_graphify_workflow_gradle_post.html">Член 0105 — Интегрисати Graphify у Gradle ток</a></p> </li> <li> <p><a href="0117_granularisation_oss_css_repositorie_workspace_post.html">Članak 0117 — Granularizacija OSS/CSS</a></p> </li> <li> <p>Članak 0123 — Knowledge Graph kao motor preporuke</p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0123_knowledge_graph_moteur_recommandation_articles_connexes_post.html Tue, 12 May 2026 00:00:00 +0000 blog/2026/0123_knowledge_graph_moteur_recommandation_articles_connexes_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_сцена_уторак_12_мај_1730">Сцена: уторак 12. мај, 17:30</a></li> <li><a href="#_дијагностика_три_типа_односа_которым_шаблон_не_види">Дијагностика : Три типа односа которым шаблон не види</a></li> <li><a href="#_решење_gradle_pipeline_nije_poziv_llm_na_vruću">Решење: Gradle pipeline, nije poziv LLM na vruću</a> <ul class="sectlevel2"> <li><a href="#_arhitektura_bakery_uvozi_graphify_ne_engine">Arhitektura: Bakery uvozi Graphify, ne Engine</a></li> <li><a href="#_pipeline_scan_graf_template">Pipeline: Scan → Graf → Template</a></li> <li><a href="#_chronološki_fallback">Chronološki fallback</a></li> </ul> </li> <li><a href="#_nastajuća_ontologija_kad_članci_se_skupe_bez_da_se_poznaju">Nastajuća ontologija: Kad članci se skupe bez da se poznaju</a></li> <li><a href="#_ugovor_dag_ko_znači_za_koga">Ugovor DAG : Ko znači za koga</a></li> <li><a href="#_шта_добијамо_ишта_не_добијамо">Шта добијамо (ишта не добијамо)</a></li> <li><a href="#_perspektive_blog_kao_javni_knowledge_graph">Perspektive: Blog kao javni knowledge graph</a></li> <li><a href="#_zaključak_sistem_fajlova_zna_ono_što_template_ne_zna">Zaključak: Sistem fajlova zna ono što template ne zna</a></li> <li><a href="#_референце">Референце</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">Время читања : 14 minutes</div> <p>Читаете članak о интеграцији pgvector с LangChain4j. На дну странице, JBake Vam preporučuje « Srodni članci ». Kliknete. To je članak o…​ konfiguraciji. od Kitty Terminala. Jedina zajednička tačka između njih? Objavljeni su manje od petnaest dana razmaka. Ovo nije preporuka. Ovo je kalendar pretvaran u editorial</p> </div> </div> </div> <div class="sect1"> <h2 id="_сцена_уторак_12_мај_1730">Сцена: уторак 12. мај, 17:30</h2> <div class="sectionbody"> <div class="paragraph"> <p>Пречитам један од моjih чланaka — <a href="0106_knowledge_graph_outil_comprehension_codebase_post.html">taj o Knowledge Graphu kao alat za razumevanje codebase</a> Sadržaj je gust: čvorovi, grane, zajednice, PlantUML, uvođenje. Jedan članak tehnika čitanja od 15 minuta koja mobilizuje`graphify-gradle`, <code>plantuml-gradle</code>, i koncepti grafovne topologije</p> </div> <div class="paragraph"> <p>На дну странице, « Сродни чланкови » ми предлажу:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Један чланак о Firebase Contact Form (0113)</p> </li> <li> <p>Članak o mehanizmu Eager/Lazy (0108)</p> </li> <li> <p>Članak o migraciji Gradle skript → plugin (0102)</p> </li> <li> <p>Članak o kumulanju pretplata Ollama Pro (0120)</p> </li> </ol> </div> <div class="paragraph"> <p>Tri od ovih četiri članka nemaju <strong>ništa</strong> veze sa Knowledge Graph-om. Они су ту jer су последњи објављени — временска близост, не semantičko susjedstvo</p> </div> <div class="paragraph"> <p>Gledam šablon`post.thyme`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-xhtml hljs" data-lang="xhtml"><!-- Articles connexes (liens internes SEO) --> <th:block th:each="post,postStat : ${published_posts}"> <th:block th:if="${!post.uri.equals(content.uri) and postStat.index lt 4}"> ... </th:block> </th:block></code></pre> </div> </div> <div class="paragraph"> <p>`published_posts`је хронолошка листа.`postStat.index lt 4`uzima četiri prvi koji nisu trenutni post. To je sve. Nema logike. sličnosti. Nema pojma o sadržaju. Samo jedna petlja`for`maskirana kao препорака.</p> </div> <div class="admonitionblock warning"> <table> <tr> <td class="icon"> <i class="fa icon-warning" title="⚠️"></i> </td> <td class="content"> <div class="paragraph"> <p>Није то грешка у JBake. Ово је подразумевано понашање свих generator statičkog sajta : lista postova je ravna i uređena po datumu. Шаблон ради шта може са тим што има.</p> </div> </td> </tr> </table> </div> <div class="paragraph"> <p>Ali to nije razlog da ga prihvati.</p> </div> </div> </div> <div class="sect1"> <h2 id="_дијагностика_три_типа_односа_которым_шаблон_не_види">Дијагностика : Три типа односа которым шаблон не види</h2> <div class="sectionbody"> <div class="paragraph"> <p>Moj korpus članaka — 23 posta u 4 meseca — ima bogatu strukturu koja vremenski šablon potpuno prevlada :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Eksplicitne reference</strong> : ja koristim`xref:`масовно у мојим чланцима.</p> </li> </ol> </div> <div class="paragraph"> <p>Član 0122 referencuje 0106 (knowledge graph) i 0116 (kompartmenatizacija) epistemološki). Ove veze su uredničko <strong>hard linking</strong> — ja sam Svesno je odlučio da poveže ove koncepte.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Deljeni tagovi</strong> : svaki članak ima`:jbake-tags:`. Članak o</p> </li> </ol> </div> <div class="paragraph"> <p>Graphify + PlantUML (0105) ima`gradle, graphify, plantuml, knowledge-graph`. Članak o Knowledge Graph-u (0106) ima <code>knowledge-graph, graphify, plantuml</code>. Tri taga iz sedam su zajednička — 43% preklapanja.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Sukupne imenovane entitete</strong> : « pgvector », « RAG », « embedding</p> </li> </ol> </div> <div class="paragraph"> <p>pojavljuju se zajedno u četiri različitog članka. « LangChain4j », Ollama », « plugin Gradle » u šest ostalih. Nisu to tagovi. objavljeni — to su <strong>patterns émergents</strong> korpusa koje samo NLP може да детектује.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title Три слојеве везе између чланака package "Sloj 1 — Eksplicitne reference" #CCFFCC { [Article A] as A1 [Article B] as B1 A1 -down-> B1 : xref: note right of A1 Liens durs Déterministes Déjà dans graph.json end note } package "Sloj 2 — deljeni tagovi" #FFFFCC { [Article A] as A2 [Article C] as C2 A2 ..> C2 : tag_cooccurrence note right of A2 Poids = tags communs / tags totaux Déterministes À extraire via graphify end note } package "Слој 3 — појављива онтологија" #FFCCCC { [Corpus A] as A3 [Corpus B] as B3 A3 ..> B3 : entity_overlap note right of A3 Clusters NLP Co-occurrences d'entités nommées TF-IDF / cosine similarity end note } @enduml</pre> </div> </div> <div class="paragraph"> <p>Danas, moj sajt ne koristi <strong>nijedna</strong> od ova tri sloja. On koristi nulta sloj : redoslaganje ubacivanja u Javini listi.</p> </div> </div> </div> <div class="sect1"> <h2 id="_решење_gradle_pipeline_nije_poziv_llm_na_vruću">Решење: Gradle pipeline, nije poziv LLM na vruću</h2> <div class="sectionbody"> <div class="paragraph"> <p>Прво искушење би било да се позове LLM у време bake : « За Ovaj članak, pronađi tri najsličajnija članka u korpusu. Ne radite to.</p> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p>Један poziv LLM svakom`./gradlew bake`košta vreme, novac i Uvođenje nedeterminizma u vašu gradnju. Odgovor LLM-a može preći između dva build-a bez da se sadržaj promenio. Vaša CI postaje neponovljiv, vaši testovi postaju nestabilni.</p> </div> </td> </tr> </table> </div> <div class="paragraph"> <p>Rešenje je determinističko: Gradle pipeline koji pre-računava graf sličnosti i čuva ga u`graph.json`. Шаблон чита результат — Nikada ne pokreće izračun.</p> </div> <div class="sect2"> <h3 id="_arhitektura_bakery_uvozi_graphify_ne_engine">Arhitektura: Bakery uvozi Graphify, ne Engine</h3> <div class="paragraph"> <p>Ово је најважнија архитектурна тачка. Искушaње би било да uvezati saradnju u`engine/build.gradle.kts`: primenjen motor graphify za skeniranje, bakery za pečenje, i engine čini most između обојих.</p> </div> <div class="paragraph"> <p>Ovo je anti-patern. Engine je <strong>potrošački terminal</strong> — on primenjuje dodaci, ne implementira poslovnu logiku. Pravilo je : <strong>Teret dokaza je na vlasničkom pluginu.</strong></p> </div> <div class="listingblock"> <div class="title">Ispravna arhitektura — Bakery uvozi Graphify</div> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam packageBackgroundColor #FFF3CD title Pekara uvozi Graphify — Motor ne zna ništa. package "N3 — MOTOR" #FFCCCC { [engine/build.gradle.kts] as ENG note right of ENG plugins { bakery } Zéro connaissance de graphify 4 tâches, ~150 lignes end note } package "N2 — BAKERY" #CCFFCC { [bakery-plugin] as BAK note right of BAK plugins { graphify } ← import interne Lit graph.json Résout articles connexes Expose le modèle à JBake end note } package "N0 — GRAPHIFY" #CCE5FF { [graphify-plugin] as GRF note right of GRF Scan workspace → graph.json Enrichi avec : - xref: edges - co-occurrences de tags - entités nommées (NLP) end note } ENG -down-> BAK : "plugins { pekara }" BAK -down-> GRF : "plugins { graphify } ← N2→N0 OK" @enduml</pre> </div> </div> <div class="paragraph"> <p>Ugovor DAG je poštovan: bakery (N2) uvozi graphify (N0), N2 > N0, Није нарушење. Engine (N3) привози pekara (N2), N3 > N2, OK.</p> </div> <div class="paragraph"> <p>Engine ne ima <strong>ni jedne</strong> linije koda koja referencira`graph.json`, <code>relatedPosts</code>, или било którą другу pojam sličnosti. On primenjuje bakery, tačka. La saradnja je interna u bakery.</p> </div> </div> <div class="sect2"> <h3 id="_pipeline_scan_graf_template">Pipeline: Scan → Graf → Template</h3> <div class="paragraph"> <p>Ово је потпуни pipeline у три корака :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Скан</strong> (графишење) :`graphify-plugin`Сканира workspace. У њему</p> </li> </ol> </div> <div class="paragraph"> <p>trenutna forma, već detektuje`xref:`među`.adoc`i izlaga u`graph.json`kao ivice tipa`reference`.<br> Ono se obogaćuje za uredni sadržaj: * Прочитај metapodatke JBake (<code>:jbake-tags:</code>, <code>:jbake-description:</code>) svake`.adoc`блога * Računa ko-pojavnosti tagova → ivice`tag_cooccurrence`sa teznik * Izvlačuje imenovane entitete iz opisnika kroz TF-IDF → edges`entity_overlap` * Уметни секцију`blog_articles`u`graph.json`постојећи<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// Extrait de l'enrichissement graphify pour le blog fun enrichBlogSection(graphJson: File, blogDir: File): GraphJson { val articles = blogDir.listFiles { f -> f.extension == "adoc" } .map { parseJbakeMetadata(it) } val nodes = articles.map { ArticleNode(it.slug, it.title, it.tags) } val edges = mutableListOf<GraphEdge>() // Couche 1 : xref (déjà fait par scanWorkspace) // Couche 2 : co-occurrences de tags for (a in articles) { for (b in articles) { if (a.slug == b.slug) continue val common = a.tags.intersect(b.tags) if (common.isNotEmpty()) { edges.add(GraphEdge( source = a.slug, target = b.slug, type = "tag_cooccurrence", weight = common.size.toDouble() / (a.tags.size + b.tags.size) )) } } } return graphJson.copy( blogArticles = BlogSection(nodes, edges) ) }</code></pre> </div> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Bake</strong> (pekara) : u trenutku`./gradlew bake`, `BakeryPlugin`чита</p> </li> </ol> </div> <div class="paragraph"> <p>`graph.json`i rešava povezane članke za svaku objavu.<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// BakeryPlugin — résolution des articles connexes fun resolveRelatedPosts( currentSlug: String, graph: GraphJson, maxResults: Int = 4 ): List<RelatedPost> { val edges = graph.blogArticles.edges .filter { it.source == currentSlug || it.target == currentSlug } return edges .sortedByDescending { it.weight } .take(maxResults) .map { edge -> val relatedSlug = if (edge.source == currentSlug) edge.target else edge.source graph.blogArticles.nodes.first { it.slug == relatedSlug } } }</code></pre> </div> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Шаблон</strong> (<code>post.thyme</code>) : model JBake sada prima mapu</p> </li> </ol> </div> <div class="paragraph"> <p>strukturalna umesto ravne hronološke liste<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-xhtml hljs" data-lang="xhtml"><!-- Articles connexes basés sur le Knowledge Graph --> <th:block th:if="${relatedPosts != null and !relatedPosts.empty}"> <section class="mt-5 pt-4 border-top"> <h2 class="h4 mb-3">Articles connexes</h2> <th:block th:each="related : ${relatedPosts}"> <div class="mb-2"> <a th:href="${content.rootpath} + ${related.uri}" th:text="${related.title}" class="fw-semibold"></a> <br/> <small class="text-muted"> <th:block th:each="reason,iterStat : ${related.reasons}"> <span class="badge bg-light text-dark" th:text="${reason}"></span> </th:block> </small> </div> </th:block> </section> </th:block></code></pre> </div> </div> <div class="paragraph"> <p>Шаблон је ист — он не зна <strong>одакле</strong> подаци долажу. Samo ugovor između bakery i JBake je promenio :`published_posts`(lista хронолошки) stanie`relatedPosts`(mape ponderisane grafom).</p> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="ℹ️"></i> </td> <td class="content"> <div class="paragraph"> <p>Баџ « разлог » (пример:`xref 0122`, <code>tag:gradle</code>, <code>cluster:pgvector-rag</code>) objašnjava čitaču <strong>zašto</strong> ovaj članak je povezan. Nije samo transparencija — to je pedagogija na topologiji vaš sopstrani sadržaj. (empty)</p> </div> </td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_chronološki_fallback">Chronološki fallback</h3> <div class="paragraph"> <p>Si `graph.json`nedostupan (lokalan build bez prethodnog skeniranja, prv разврштање, CI која још није интегровала скан graphify), шаблон treba da se degraduje elegantno :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">fun resolveRelatedPosts(currentSlug: String, graph: GraphJson?): List<RelatedPost> { if (graph != null && graph.blogArticles != null) { return resolveFromGraph(currentSlug, graph) } // Fallback chronologique — même comportement qu'aujourd'hui logger.warn("[bakery] graph.json absent — fallback chronologique") return resolveFromChronology(currentSlug) }</code></pre> </div> </div> <div class="paragraph"> <p>Podrazumevano ponašanje je identično trenutnom ponašanju. On preporučni motor je <strong>postapono unapređenje</strong> — nije rušna promena</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_nastajuća_ontologija_kad_članci_se_skupe_bez_da_se_poznaju">Nastajuća ontologija: Kad članci se skupe bez da se poznaju</h2> <div class="sectionbody"> <div class="paragraph"> <p>Najzanimljiviji sloj je treći: emergentna ontologija Статије које се не цитирају, које немају исте тагове, али koji <strong>govore o istoj stvari</strong> bez da to znaju</p> </div> <div class="paragraph"> <p>Uzmimo konkretan primer. Tri članka iz mojeg korpusa:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>0119 — Benchmark DGX Spark vs Cloud абонемент LLM</p> </li> <li> <p>0121 — Gradle plugin za pokretanje dve instanci Ollama Pro</p> </li> <li> <p>0122 — Stopa efikasnosti 27x 45x Flot AI eksperata</p> </li> </ol> </div> <div class="paragraph"> <p>Ova tri članka nemaju <strong>nijedan</strong> xref medusobno. Njihove oznake ne se Preklapaju se samo do 20% (« ollama », « llm » zajednički). Ali jedan lagan NLP На описima открива се јасак кластер: « трошак », « претплата», oblak », « GPU », « ključ API », « Ollama Pro », « efikasnost », « odnosi</p> </div> <div class="paragraph"> <p>Oni čine ontološki klaster: <strong>ekonomija samodržanog LLM vs cloud</strong>. Ovaj klaster nije deklarisan nigde. Pojavljuje se iz korpusa.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam packageBackgroundColor #E8F8F5 title Cluster Ontologique Émergent — "Економија LLM Self-Hosted" package "Detektovan klaster: économie-llm" #D5F5E3 { [0119 — Benchmark DGX Spark\nvs Cloud Abonnement] as A [0121 — Plugin Gradle Piloter\nDeux Instances Ollama Pro] as B [0122 — Ratio Efficacité\n27x 45x Flotte Experts] as C } A .. B : entity_overlap (0.73) B .. C : entity_overlap (0.81) A .. C : entity_overlap (0.68) note bottom of A Aucun xref entre ces articles. Tags communs : "ollama", "llm". Cluster découvert par NLP : co-occurrences "trošak", "GPU", "pretplata", "Ollama Pro". end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Ovaj ontološki klaster postaje kompozitni edge u`graph.json`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-json hljs" data-lang="json">{ "source": "0119-benchmark-dgx-spark", "target": "cluster:economie-llm", "type": "entity_cluster", "weight": 0.73, "metadata": { "clusterLabel": "Économie LLM Self-Hosted vs Cloud", "commonEntities": ["coût", "GPU", "abonnement", "Ollama Pro", "ratio"], "articlesInCluster": [ "0119-benchmark-dgx-spark", "0121-ollama-pro-deux-instances", "0122-ratio-efficacite-flotte-experts" ] } }</code></pre> </div> </div> <div class="paragraph"> <p>NLP je namerno lako — TF-IDF + cosine similarity na Opis. Nije potrebno BERT, nije potreban model jezika. Corpus ima 23 članka, matrica sličnosti se nalazi u JSON fajl od 50 KB.</p> </div> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="💡"></i> </td> <td class="content"> <div class="paragraph"> <p>Moć NLP-a ne dolazi iz sofisticiranosti algoritma, ali <strong>veličina korpusa</strong> i <strong>kvalitet opisivanja</strong>. Jedna `:jbake-description:`dobro napisana od 150 znakova sadrži više сигнал за TF-IDF да је цео чланак од 3000 речи.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_ugovor_dag_ko_znači_za_koga">Ugovor DAG : Ko znači za koga</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovo je tačka gde arhitektonska disciplina plaća. DAG N0→N3 definisano u`engine/build.gradle.kts`daje jednostavno pravilo : Nijedan projekat ne uvozi projekat višeg nivoa.</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 18.1818%;"> <col style="width: 27.2728%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Потрошачки плагин</th> <th class="tableblock halign-left valign-top">Uvezen plugin</th> <th class="tableblock halign-left valign-top">Nivo potrošača</th> <th class="tableblock halign-left valign-top">Uvezen nivo</th> <th class="tableblock halign-left valign-top">Валидно?</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">пекара-gradle</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">graphify-gradle</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">N2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">N0</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ N2 > N0 — OK</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">motor</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">bakery-gradle</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">N3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">N2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ N3 > N2 — OK</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">мотор</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">graphify-gradle</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">N3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">N0</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ Tehnika OK, <strong>konceptualno netačno</strong> — suradnja je unutar bakery</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Motor nametni pekara. Pekara nametni graphify. To je sve. Ako jednom dan Želim da dodam vector store codebase (N1) za pretragu kros-korpusna semantika, pekara takođe uvozi. Motor se ne menja.</p> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p><strong>plugin N2 je hub svojih vlastitih zavisnosti</strong> Engine N3不是 хуб — то је терминал који примијује хубове.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_шта_добијамо_ишта_не_добијамо">Шта добијамо (ишта не добијамо)</h2> <div class="sectionbody"> <div class="paragraph"> <p>Главна користи је уредничка, а не техничка :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Pre</th> <th class="tableblock halign-left valign-top">Posle</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Srodni članci = 4 poslednjih postova</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Сродни чланци = топ 4 по тежини у графу знања</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Čitač čita iz RAG → preporuka Kitty Terminal</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Čitač čita iz RAG → preporuka pgvector, chunking, vektor skladište</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Nula transparencija zašto</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ознака`xref 0122`, <code>tag:gradle</code>, `cluster:rag`видимло</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">JBake standard, bez truda, bez vrednosti</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Pipeline Gradle deterministički, reproducibilni, testabilni</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Nema krivulje učenja za čitaoca</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Čitač otkriva <strong>topologiju</strong> mojeg sadržaja</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Шта <strong>не</strong> освајаш :</p> </div> <div class="ulist"> <ul> <li> <p>Ово није «вистински» механизам за препорuke (неколаборативна</p> </li> </ul> </div> <div class="paragraph"> <p>filtering, nema A/B testa, nema feedback petlje)</p> </div> <div class="ulist"> <ul> <li> <p>Kvalitet zavisi od bogatstva JBake metapodataka — ako vaš</p> </li> </ul> </div> <div class="paragraph"> <p>opisи су празни, TF-IDF не види ништа</p> </div> <div class="ulist"> <ul> <li> <p>NLP je offline — novi članci nisu klasterovani samo do</p> </li> </ul> </div> <div class="paragraph"> <p>sledeći sken (to je dobro : build ostaje deterministički)</p> </div> </div> </div> <div class="sect1"> <h2 id="_perspektive_blog_kao_javni_knowledge_graph">Perspektive: Blog kao javni knowledge graph</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ова функција отвара широку перспективу: и ако`cheroliv.com` postajao sam <strong>knowledge graph navigabilan</strong>?</p> </div> <div class="paragraph"> <p>Članci su čvorovi. Tagovi su zajednice. xref su rubovi. Čitač više ne čita isolovan članak — on se kreće unutar <strong>graf znalja</strong> čiji je trenutni članak ulazna tačka.</p> </div> <div class="paragraph"> <p>Претпоставите домашњу страну која не приказује хронолошку листу. последњих постова, али једна <strong>карта корпуса</strong> : онтолошки кластерe, pivotni članci (oni sa najviše grana), putevi čitanja препоручено (« ако вам је допадло чланак о Graphify, прочитајте наставик onaj o Knowledge Graphu kao alat za razumevanje )</p> </div> <div class="paragraph"> <p>Ово више није блог. Ово је <strong>семантички атрас</strong>.</p> </div> <div class="paragraph"> <p>I to nije naučna fantastika.`graph.json`већ постоји. Mu nedostaje samo navigacioni interfejs.</p> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak_sistem_fajlova_zna_ono_što_template_ne_zna">Zaključak: Sistem fajlova zna ono što template ne zna</h2> <div class="sectionbody"> <div class="paragraph"> <p>Шта сам дизајнио у уторак вечеру, то је заменa heuristike lenja (chronološki red) putem verna predstnost Struktura mojeg korpusa (Knowledge Graph).</p> </div> <div class="paragraph"> <p>Šablon`post.thyme`Не се мења. Шта се мења, то је што ми Mu hrani. Pre: Java lista uređena po`date`. Posle : ponderisan graf nastao iz tri sloja analize — xrefs, ko-pojavljivanja tagova, i emergentna ontologija putem NLP.</p> </div> <div class="paragraph"> <p>Петља је затворена. graphify скенира радњи простор. Pekara чита graf i hranjuje šablon. Čitač vidi preporuke. релевантне. И engine — диригент — чак и не зна да Sve to postoji.</p> </div> <div class="paragraph"> <p>To je to, dobra arhitektura. Svaki plugin radi jedno. I potrošački terminal ne mora da zna kako.</p> </div> </div> </div> <div class="sect1"> <h2 id="_референце">Референце</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Članak 0105 — Integracija Graphify u Gradle radni tok</p> </li> <li> <p><a href="0106_knowledge_graph_outil_compréhension_codebase_post.html">Članak 0106 — Knowledge Graph kao alat za razumevanje</a></p> </li> <li> <p>Article 0117 — Granularizacija OSS/CSS</p> </li> <li> <p><a href="0121_plugin_gradle_piloter_deux_instances_ollama_pro_post.html">Članak 0121 — Gradle dodatak za upravljanje dve instanze Ollama Pro</a></p> </li> <li> <p><a href="0122_ratio_efficacite_27x_45x_flotte_experts_ia_vs_claude_gpt_post.html">Член 0122 — 27× до 45× ефикасније : flota ИИ експерта</a></p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0122_ratio_efficacite_27x_45x_flotte_experts_ia_vs_claude_gpt_post.html Mon, 11 May 2026 00:00:00 +0000 blog/2026/0122_ratio_efficacite_27x_45x_flotte_experts_ia_vs_claude_gpt_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_problem_zašto_fine_tune_i_ne_rag">Problem: zašto fine-tune i ne RAG?</a></li> <li><a href="#_ideja_flota_eksperata_ne_samo_jedan_model">Ideja: flota eksperata, ne samo jedan model</a></li> <li><a href="#_codebase_pod_lupom_7_900_datotek_144_000_linije">Codebase pod lupom : 7 900 datotek, 144 000 linije</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">Време читања : 22 minutes</div> <p>Kada koristite LLM za dnevni razvoj softvera, uvijek se naiđete na isti zid: model ne poznaje <strong>vash</strong> bazu koda. Ne zna da koristite takav uzorakhttps://fr.wikipedia.org/wiki/Graphe_orient%C3%A9_acyclique[DAG], takav Gradle konvencija, takva epistemska stratifikacija u vašemhttps://fr.wikipedia.org/wiki/AsciiDoc[.adoc]Zatim ubačujemo mu kontekst, ponavljamo, popravljamo, iteriramo. Vreme — i novac — prolaze.</p> </div> <div class="paragraph"> <p>Zato sam bez obzira postavio pitanje: koliko bi koštala ekipa fine-tuniranih modela na mom radnom prostoru, koja bi mogla bacati koda <strong>u mom stilu</strong> bez potrebe da im se svaki put objašnjava? I najvažnije: kako se ta pristup odnosi na proprietarna rešenja — Claude, GPT, Gemini, Grok?</p> </div> <div class="paragraph"> <p>Odgovor me je iznenadio. Mnogo manje od onoga što sam mislio. I odnos troškova/efikasnosti prema gigantima sektora je nepristojan. Evo kompletan detalj.</p> </div> </div> </div> <div class="sect1"> <h2 id="_problem_zašto_fine_tune_i_ne_rag">Problem: zašto fine-tune i ne RAG?</h2> <div class="sectionbody"> <div class="paragraph"> <p>RAG je dobar. <a href="0106_knowledge_graph_outil_comprehension_codebase_post.html">Moj knowledge graph</a> i <a href="0116_compartimentage_epistemique_automatise_llm_post.html">Moj epistemijski podel</a> rade. Ali RAG ima temeljni nedostatak: pri svakom upitu moraš ponovo uvesti relevantni kontekst. Tvoj prompt se produžava, tvoja latencija eksploduje, i model nikad ne <strong>internalizuje</strong> tvoje vzorce — on ih čita svaki put kao vanjski dokument.</p> </div> <div class="paragraph"> <p>Fine-tune, to jest mišićna memorija. Model <strong>zna</strong> da pišeš.<code>build.gradle.kts`sa zadacima registrovanim preko`tasks.register</code>, tvoji`AGENTS.adoc`Следују стандардизовану синтаксу, да твој радњи простор је структуриран у boroughs. Он не потребује да га напомену.</p> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="ℹ️"></i> </td> <td class="content"> <div class="paragraph"> <p>Fine-tuning nije zamena za RAG. To je dodatni sloj. RAG ostaje relevantan za podatke koji se često menjaju (logovi, tiketski, nedavni komitovi). Fine-tuning je za <strong>strukturno</strong> i <strong>stilsatko</strong> znanje na dugoročnoj osnovi.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_ideja_flota_eksperata_ne_samo_jedan_model">Ideja: flota eksperata, ne samo jedan model</h2> <div class="sectionbody"> <div class="paragraph"> <p>Jedno fine-tunirano model na celom radnom prostoru je već dobar. Ali je podoptimalno. Moj radni prostor pokriva veoma različite domene:</p> </div> <div class="ulist"> <ul> <li> <p>Gradle pluginovi (Kotlin, konvencioni pluginovi, složeni gradivi)</p> </li> <li> <p>DAG motor (Kotlin, planiranje, izvršenje)</p> </li> <li> <p>Агенти LLM (Python, LangChain4j, RAG)</p> </li> <li> <p>Arhitektonska dokumentacija (AsciiDoc, upravljanje)</p> </li> <li> <p>Infra/DevOps (Docker, GitHub Actions, CI/CD)</p> </li> </ul> </div> <div class="paragraph"> <p>Jedinstveni model bi trebao da bude dobar svugde, odličan nigdje. Rešenje? Jedna<strong>flota specijalizovanih modela</strong>, sa orkestratorom koji svaki zahtev usmerava ka pravom ekspertu.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FAFAFA skinparam defaultFontSize 13 package "Ollama Cloud" { rectangle "DeepSeek V4-Pro 1.6T / 49B activa" as V4Pro #FF6B6B rectangle "6× V4-Flash-FT 292B / 13B imovine" as Flash #4ECDC4 rectangle "6× Gemma4 26B-FT 26B / 3.8B aktiva" as Gemma #FFE66D rectangle "5× Qwen3.6 35B-FT 35B / 3B aktivi" as Qwen36 #A8E6CF rectangle "5× Qwen3.5 35B-FT 35B / 3B aktivni" as Qwen35 #FF8B94 } note bottom of Qwen35 À partir de 17€/mois (1× Ollama Pro annual) Extensible par cumul de comptes Pro selon la méthode Docker. end note actor Utilisateur as User User --> V4Pro : Requête V4Pro --> Flash : "kompleksan Gradle zadatak" V4Pro --> Gemma : "formatiranje AsciiDoc" V4Pro --> Qwen36 : "refaktorisanje Kotlin" V4Pro --> Qwen35 : "Bash skripta" note right of V4Pro L'orkestrateur route la requête vers l'expert le plus pertinent. Zéro prompt engineering répétitif. end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Ukupna flota :<strong>1 orkestrator + 22 eksperata = 23 modela</strong>. И који је месечни троšak закључавања?<strong>17€/mesec</strong>u godišnjoj pretplati Ollama Pro — proširivo kroz kumuliranje naloga ako se kvote pređu, kao što je demonstrisano u <code><a href="0120_cumuler_deux_abonnements_ollama_pro_docker_post.html">ma méthode Docker multi-comptes</a></code>. Počinjemo od 17 €, dodajemo 20 € po nivou prema stvarnoj potrebi. Bez trošenja.</p> </div> </div> </div> <div class="sect1"> <h2 id="_codebase_pod_lupom_7_900_datotek_144_000_linije">Codebase pod lupom : 7 900 datotek, 144 000 linije</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pre nego što procenimo cenu treninga, moramo znati šta treba trenirati. Proverio sam svoj radni prostor, rigorozno isključujući sve što Git ignoriše:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">---- ---- build/ out/ node_modules/ runtimes/ .gradle/ dist/ target/ venv/ __pycache__/ .cache/ .tox/ ---- Ovo je rezultat samo za praćene datoteke: [cols="2,2"] |=== |metrički |Vrednost |Praćene izvorne datoteke |**7 896** |Redovi koda (LOC) |**143.805** |Гит репозиторијуми |**26** |Главни језици |Kotlin (1 903), AsciiDoc (2 765), Python (5 029) |=== [IMPORTANT] ==== Ovih 5 000+ Python fajlova sadrže`runtimes/`sveske i korisni skriptovi. Glavni deo aplikacije (Gradle pluginovi, DAG motor, agenti) je uglavnom na Kotlinu i AsciiDoc-u. ==== Od ove mase, pretpostavljam da mogu da generišem sintetički skup podataka od**~170 miliona tokena**putem instruktivnog LLM (distilacija kodne baze u parove instrukcija/odgovora). === Detalj dataset-a po tipu eksperta [source,text] ---- Dataset maître (généraliste V4-Flash) : 50M tokens Expert Gradle/Build : 15M tokens Expert Kotlin/DAG : 15M tokens Expert AsciiDoc/Gouvernance: 15M tokens Expert Agent/LLM/Python : 15M tokens Expert Infra/CI-CD : 15M tokens Micro-experts Qwen/Gemma : ~5M tokens chacun ---- == Izbor modela: 100% MoE, nula gusta Тама где архитектура постаје stvarно ефикасна. Gusti model *dense* aktivira sve svoje težine za svaki token. Model *MoE* (Mixture of Experts) aktivira samo frakciju svojih parametara. Trošak inferencije — i fine-tuninga — je proporcionalan parametrima.**aktivirani**, ne parametrima**складирани**. Размотримо шта тржно предложа у MoE данас на Ollama Cloud: [cols="3,2,2,1,3"] |=== |Модел |Ukupno parametara |Активирани |Активација |Ollama Cloud |DeepSeek V4-Pro |1,6t |49B |3.1% |✅ роден |DeepSeek V4-Flash |292B |13B |4.5% |✅ rodni |Gemma 4 26B-A4B |26B |3.8B |14.6% |✅ роден |Qwen3.6-35B-A3B |35B |3B |8.6% |❌ (jos nije integrisan) |Qwen3.5-35B-A3B |35B |3B |8.6% |✅ роден |❌ Qwen3.5-27B |27B |27B |100% gušt |елиминисан |❌ Qwen3.5-4B/9B |4B/9B |4B/9B |100% gušt |eliminisan |❌ Gemma 4 31B |31B |31B |100% gust |елиминисан |🧪 Gemma 4 E2B/E4B |5B/8B |5B/8B |100% gušć |validation pipeline |=== [CAUTION] ==== Stopa aktivacije je diskriminativni kriterijum. Gemma 4 26B-A4B aktivira samo 3.8B od svojih 26B parametara — to je 7× manje nego kod guštog 27B, radi uspoređive performance kod agenta za kodiranje (77.1% vs 80% na LiveCodeBench v6). ==== === Зашто остављам густи модели Izuzetak: Gemma 4 E2B i E4B. Ova dva modela, pod Apache 2.0 licencom, su idealna za testiranje i validaciju pipeline-a za učenje po nižoj ceni. Jedno pokretanje od 2-3h na E2B košta manje od $5 — ako je dataset ili hiperparametri loši, znamo to za neka dolara. Kada se pipeline podesi, mogu i služiti za ultra-mikro zadatke (trivialno ponovo formatiranje, binarna klasifikacija). Ali za eksperte iz glavne flotte, ostajem kod MoE. Zasto: .Ali ne samo: Gemma 4 E2B/E4B, stručnjaci za finu anonimizaciju [NOTE] ==== Google je dizajnirala ove male modele kao konkurentne u natavnom tool calling — oni znaju da pozivaju funkcije, manipulišu regex-om, traže obrasce. Posle fine-tuniranja na primerima anonimizacije (e-majlovi, tokeni, UUIDs, putevi do fajlova), postaju**anonimizatori dataseta**ultra-brzi. Im daju blok neformatiranog teksta, oni zovu`sed`/`regex`kroz poziv alata i vraćaju očišćen blok. Trošak inferencije je neznačajan: 5B aktiviranih, mieści se na jednoj ulaznoj GPU. Ovi modeli nisu poslovni stručnjaci — su**stručni radnici**у ланцу производње сета података ==== * Njena VRAM za obuku (iako u QLoRA) je proporcionalna na**27B укупно** * Njegovo vreme treniranja je proporcionalno na**27B aktivirani** Uporedimo sa Qwen3.6-35B-A3B (MoE) : [cols="3,2,2,2"] |=== | |Qwen3.5-27B (gušća) |Qwen3.6-35B-A3B (MoE) |Odnos |VRAM QLoRA |~55 GB |~35 GB |1.6× |GPU-sati (8M tok) |~12h |~4 sati |**3×** |Trošak po fine-tune |~$24 |~$8 |**3×** |SWE-bench Verified |75.0% |73.4% |sličan |=== MoE košta 3× manje za treniranje radi performansi agent-coding na oko 5%. Na 22 experta, razlika se izražava u hiljadama evra. == Procena treniranja: 811 H100-sati Raspodelio sam trošak treninga po modelu, u QLoRA 4-bit, sa datasetima opisanim iznad. === Mikro-eksperti MoE lagani (3-3.8B aktivirani) Ovi modeli zahtevaju 1 H100 (80 GB) po izvođenju. VRAM modela u Q4 je oko 13-18 GB, ostavljajući dovoljno prostora za stanje LoRA optimizatora i aktivacije. [cols="4,2,3,2"] |=== |Модел |Br. pokreta |GPU-h/покретање |Ukupno GPU-h |Gemma 4 26B-A4B-FT |6 |3.5 h |**21h** |Qwen3.6-35B-A3B-FT |5 |4.0 h |**20 sati** |Qwen3.5-35B-A3B-FT |5 |4.0 h |**20 sati** |Mikro subtotal | | |*61 h* |=== === Izvršni V4-Flash (13B aktivirano / 292B skladišteno) DeepSeek V4-Flash je poseban slučaj. Čak i iako samo 13B je aktivirano po tokenu, kompletan model u Q4 teži oko 142 GB — svi eksperti moraju da budu u VRAM tokom treniranja. Zato treba**3× H100**po run da bude udobno [cols="4,2,3,3,2"] |=== |model |Skup podataka |GPU |sati |Ukupno GPU-sata |V4-Flash-Base општа |50M tok |3 puta H100 |50 h |**150 h** |stručan V4-Flash ×5 |15M tok |3× H100 |40 h |**600 sati** |потпни итог изводника | | | |*750 h* |=== [cols="3,2,1"] |=== |**ukupno** | |**811 H100-h** |=== [NOTE] ==== Za usporedbu, puno podešavanje V4-Flash (bez QLoRA, svi težine) koštao bi ~4 000 H100-sati samo za 6 modela. QLoRA deli trošak na 5. To je jedini način da se projekt učini ekonomski izržljiv u ovom opsegu. ==== === Tarifi GPU: tko šta iznajmljuje u maju 2026. Benchmarkirao sam glavne iznajmljivače H100. Cena po brojaču, za 811 sati. [cols="3,2,2,2"] |=== |Izdavač |$/H100·h |Ukupno 811h |Pouzdanost |**Vast.ai mesto** |$1.60 |**$1 298** |★★☆ prekinljiv |**Crusoe oblak** |$2.00 |**$1 622** |★★★★ datacenter pouzdan |FluidStack |$1.98 |$1 606 |★★★ |TensorDock |$1.80 |$1 460 |★★☆ |RunPod |$2.29 |$1 857 |★★★ dobar kompromis |CoreWeave |$2.25 |$1 825 |★★★★ предузеће |Lambda Labs |$2.49 |$2 019 |★★★★ премијум |=== [TIP] ==== Vast.ai spot je najjeftiniji ali tvoji run-ovi mogu biti prekinuti u bilo kom trenutku. Za trening, to je rizično. Crusoe po $2,00/h je najbolji odnos pouzdanosti/cene. Navišina od $324 u odnosu na Vast vredna je mirovanja. ==== === Wall-clock : koliko vremena treba za sve obučiti? Sa jednim čvorom 3× H100, 31 pokretanja (1 opštistički + 30 ekspertski) traju oko**12 дана**sekvencijalno. Ako iznajmiš 2 čvorova paralelno, pada na**6 дана**. U praksi, mikro-eksperti mogu da se vrte na odvojenim čvorovima (po 1 H100) dok V4-Flash zauzima čvor 3× H100. Sa pametnim raspoređivanjem : ---- Nœud A (3× H100) : V4-Flash généraliste → V4-Flash experts ×5 (11 jours) Nœud B (1× H100) : Gemma 4 26B ×6 → Qwen 36 ×5 → Qwen 35 ×5 (6 jours) 7 dana iznajmljivanja, sve svačeno. == Inferencija: 23 modela na Ollama Cloud od 17€/mesec Ово је најелегантнији део архитектуре. Ollama Cloud omogućava otpremanje privatnih modela (funkcija Pro plana). Moje 22 fine-tunirani modeli su pushani u`.gguf`na moj Ollama prostor, označen kao privatni, i dostupan kroz standardni API [plantuml, inference-flow, svg] ---- @startuml skinparam backgroundColor #FAFAFA skinparam defaultFontSize 12 |Utilisateur| start :Tâche de développement; |Orkestrateur (V4-Pro)| :Classifier la tâche\n(domaine + complexité); if (Tâche simple,\nspécialisée ?) then (oui) :Router vers micro-expert\n(Gemma 4 26B-A4B-FT\n ou Qwen3.6-35B-A3B-FT); elseif (Tâche complexe,\nconventions fortes ?) then (oui) :Router vers exécutif\n(V4-Flash-FT); else (non) :Résoudre avec V4-Pro\n(architecture, décision); endif |Modèle ciblé| :Génère le code/output\n**dans mon style**,\n90%+ first-shot correct; :Retourne la réponse; stop @enduml ---- === Počinjemo sa 17€/mesec, skaliramo po potrebi Pro plan Ollama (17€/mesec godišnji) omogućava 3 konkurentna oblaka modela. U ovoj arhitekturi, nikada ne potreban je više od 2-3 eksperta istovremeno : * Faza klasifikacije (V4-Pro) zauzima 1 slot, nekoliko sekundi * Ciljan ekspert zauzima 1 slot, vreme potrebno za generisanje njegovog odgovora * Treći slot ostaje na rezervi za paralelne zadatke Ako se upotrebe povećava, dodajem dodatne Pro naloge pomoću Docker metode opisane u xref:0120_cumuler_deux_abonnements_ollama_pro_docker_post.adoc[mog članka o kumulanju pretplata]. Nema Max plana od 100€/mesec — dodajem samo ono za što stvarno imam potrebu. Jedini limitirajući faktor je**kvota GPU vremena**mesečni Ollama (50× besplatni plan za Pro). Za moj korišćenje od nekoliko stotina upita po danu, je puno dovoljno. [IMPORTANT] ==== Marginalna cena poziva na V4-Pro (49B aktiviranih) vs Gemma 4 26B-A4B (3.8B aktiviranih) je**Čak i meni : nula**. Ovo je Ollama paket koji absorbuje razliku u izračunavanju. Moj jedini indikator je latencija. ==== === Routing u praksi</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre></pre> </div> </div> <div class="paragraph"> <p>Volume de requêtes estimé : ~500/jour</p> </div> <div class="paragraph"> <p>├─ 50% → Gemma 4 26B-A4B-FT (micro, 3.8B actifs) │ Formatage AsciiDoc, scripts simples, conventions nommage │ ├─ 25% → V4-Flash-FT (exécutif, 13B actifs) │ Plugins Gradle, refactoring Kotlin, génération DAG │ ├─ 15% → Qwen 35B MoE-FT (micro, 3B actifs) │ Tâches intermédiaires, review de code, documentation │ └─ 10% → V4-Pro (orkestrateur, 49B actifs) Décisions architecturales, refactoring transverse, problèmes vraiment nouveaux</p> </div> <div class="listingblock"> <div class="content"> <pre>Masa saobraćaja prolazi kroz male. Veliki model intervenira samo kao poslednji izvor. == Uporedjenje koje boli : Claude, GPT, Gemini, Grok vs moja flota Ovo je gde razlika postaje neoprezna. Razmotrimo koliko bi koštao isti volumen rada (500 zahteva/dan, ~300 tokena ulaz + 2 000 tokena izlaz u proseku) sa proprietarnim rešenjima tržišta u maju 2026. === Anthropic — Claude (tarif maj 2026) Anthropic je nedavno *smanjilo* svoje cene. Pritisak rešavanja open-weight kao DeepSeek i Qwen se osjeća. [cols="3,2,2,2,2"] |=== |Model |$/MTok |$/MTok |Trošak/dan |**Trošak/mesec** |Opus 4.7 (najinteligentniji) |$5 |$25 |$25.75 |**$772** |Sonet 4.6 (uravnotežen) |$3 |$15 |$15.45 |**$463** |Haiku 4.5 (najbrži) |$1 |$5 |$5.15 |**$154** |=== [CAUTION] ==== Ovi tarifovi su *posle* poslednje smanjenja cene kod Anthropic (maj 2026). Pre toga, Opus je koštao $15/$75 po MTok. Strah od open-weight-a je stvaran. ==== I najjeftiniji model Claudija — Haiku 4.5 ka**154€/mesec**— Košta 9× više od moje pretplate Ollama Pro za 17€. I Haiku ne poznaje moju bazu koda, ne generiše u mom stilu, i zahteva sistematsko prompt engineering. Najinteligentniji — Opus 4.7 — eksploduje budžet na**772€/mesečno**За мањи объјем од 500 upita dnevно. То је**45× skuplji**nego moje rešenje === OpenAI — GPT (cene maj 2026) [cols="3,2,2,2,2"] |=== |Model |$/MTok |Output $/MTok |trošak/dan |**Кошт/месец** |GPT 5.5 (najinteligentniji) |$5 |$30 |$30.90 |**$927** |GPT 5.4 (standard) |$2.50 |$15 |$15.45 |**$463** |GPT 5.4 Mini |$0.75 |$4.50 |$4.64 |**$139** |=== Čak model «ekonomski» OpenAI-a — GPT 5.4 Mini za 139€/mesec — košta 8× moje pretplate, za model koji ne zna *ništa* o mojim konvencijama i zahtijeva teško prompt inženjerstvo. GPT 5.5, njihova flagman :**927€/месец**. За *zero-shot* на мојој кодбази. Са 2-3 итерација по задатак због неподешеног стила, стварни месечни трошук лако удваструје се. === Google — Gemini (cene maj 2026) [cols="3,2,2,2,2"] |=== |model |$/MTok |Izlaz $/MTok |Цена/дан |**Trošak/mesec** |Gemini 3.1 Pro (High) |$3.50 |$17.50 |$18.00 |**540 $** |Gemini 3.1 Pro |$2 |$10 |$10.30 |**$309** |Gemini 3 Flash |$0.30 |$1.50 |$1.54 |**$46** |=== Gemini 3 Flash po 46€/mesec je konkurentan po čistoj ceni — ali bez fine-tune-a, generiše kod « generički ». Nije kod *Cheroliv*. === Grok — xAI (tarife maj 2026) [cols="3,2,2,2,2"] |=== |Model |$/MTok |Output $/MTok |Тросак/дан |**Trošak/mesec** |Grok 4 |$4 |$16 |$16.48 |**$494** |Grok 4 Mini |$0.80 |$3.20 |$3.30 |**$99** |=== === Microsoft — Azure OpenAI (cene maj 2026) Azure primenjuje iste cene kao i direktna OpenAI API, ali dodatno naplačuje infrastrukturu i mrežu. Morate računati na dodatni trošak od 10-20% za administrirajući servis. [cols="3,2,2,2,2"] |=== |Модела |$/MTok |$/MTok |Цена/дан |**Trošak/mesec** |GPT 5.4 (Azure, Global) |$2.50 |$15 |$15.45 |**$463** |GPT 5.4 + infrastruktura |dodatni trošak 15% |dodatni trošak 15% |$17.77 |**$533** |=== [NOTE] ==== Tarifovi gore navedeni odnose se na API, a ne na « chat » pretplate (Claude Pro po $20/mesec, ChatGPT Plus po $20/mesec). Ovde se poredi *razvijac* korišćenje, ono gde nizu stotine zahteva dnevno kroz API da bi se generisalo, refaktorisalo i dokumentovalo. Javne pretplate imaju kvote koje eksplodiru daleko pre od 500 zahteva/dan. ==== === Konačna tabela poređenja [cols="3,2,2,2,2,2"] |=== |Решение |Znanje codebase |integrovani stil |Cena/mesec |итерације |**Stvarni trošak** |**Moja flota (Ollama Pro)** |✅ Podešeno |✅ У тежестима |**17€** |0-1 |**17€** |Claude Opus 4.7 |❌ Zero-shot |❌ Potrebna naredba |$772 |2-3 |$1 500-2 300 |Claude Haiku 4.5 |Zero-shot |❌ Неопходан промпт |$154 |3-4 |$460-615 |GPT 5.5 |❌ Nulta učenja |❌ Potребан промпт |$927 |2-3 |$1 854-2 781 |GPT 5.4 |❌ Zero-shot |❌ Потребан промт |$463 |2-3 |$925-1 390 |GPT 5.4 Mini |❌ Zero-shot |❌ потребан промпт |$139 |3-5 |$417-695 |Gemini 3.1 Pro High |нулшот |❌ Potreban prompt |$540 |2-3 |$1 080-1 620 |Grok 4 |❌ Zero-shot |❌ Potребan prompt |$494 |2-3 |$988-1 482 |**Azure GPT 5.4** |нули-шот |❌ neophodan prompt |$533 |2-3 |$1 066-1 600 |=== [plantuml, cost-comparison, svg]</pre> </div> </div> <div class="paragraph"> <p>@startuml skinparam backgroundColor #FAFAFA</p> </div> <div class="paragraph"> <p>title Izveštaj trošak/efikasnost — moj flot protiv tržište (maj 2026) rectangle "17€/mesec" as OURS #4ECDC4 rectangle "Opus 4.7\n772€" as OPUS #FF6B6B rectangle "Сонета 4.6 463€" as SONNET #FF8B94 rectangle "GPT 5.5 927€" as GPT #FFD93D rectangle "Gemini 3.1 Pro 540€" as GEMINI #6C5CE7 rectangle "Grok 4 494€" as GROK #A8E6CF rectangle "Хайку 4.5 154€" as HAIKU #DFE6E9 rectangle "GPT 5.4 Mini 139€" as MINI #B2BEC3</p> </div> <div class="paragraph"> <p>note bottom of OURS Avec fine-tune intégré. Zéro prompt engineering. 90%+ first-shot correct. end note</p> </div> <div class="paragraph"> <p>@enduml</p> </div> <div class="listingblock"> <div class="content"> <pre>17€/mesec za 23 finodešenih stručnjaka veštačke inteligencije. Flagship Claude Opus 4.7 košta**45 puta skuplje**за nižu kvalitetu na *mom* kodnoj bazi. GPT 5.5 košta**54× skuplji**. Čak i najjeftiniji model na tržištu (Gemini Flash po 46€) košta**2,7× više**без знања о mom radnom prostoru. Verdikt je bez povratka: fine-tune na MoE arhitekturama, 2026. godina, nije samo 'jeftiniji'. To je faktor efikasnosti de**27× do 54×**ономе односу цена/квалитета у односу са сопственним решењима. Anthropic, OpenAI, Google — svi to znaju, i zato smanjuju svoje cене у panicи. == Faktor efikasnosti : 5-8× protiv korišćenja V4-Pro sam Uporedimo dva ekstremuma. === Scenario A: V4-Pro samo za sve [cols="3,2"] |=== |метрички |Vrednost |Познание код базе |0 (nulta verzija) |Konvencija imenovanja |40-60% tačno na prvom pokušaju |neophodno Prompt engineering |Da, sistematski |Iteracije po zadatku |2-3 |Кошта инференце |$100/mesec (Ollama Max) |Prosečna kašnjenje |~20 tok/s + mreža |=== === Сценарио B : Оркестрована флота MoE [cols="3,2"] |=== |Metrički |Vrednost |Poznavanje kodne baze |Integrovana (fine-tune) |Konvencija imenovanja |90-95% tačno na prvom pokušaju |Inženjerstvo promptova |Ne (stil je u tezini) |Iteracije po zadatku |0-1 |Кошта inferencije |$60/mesec (3× Ollama Pro) |Prosečna latencija |~50 tok/s (lagani modeli) |=== [cols="4,2,2,2"] |=== |dimenzija |V4-Pro jedan |Flot MoE |Фактор |Mesečni trošak oblaka |$100 |**$60** |1.7× |Контекст за убацивање |Visok (prompt) |**Nula** |∞ |Prosečne iteracije |2-3 |**0-1** |2-3× |osjećana latencija |20 t/s |50 tok/s |**2.5×** |Први покушај исправан |50% |90%+ |**1.8×** |=== **Ukupan faktor efikasnosti : 5-8×**— u osjećanoj produktivitosti developera. [NOTE] ==== Faktor se ne meri u tokenima ni u dolarima. On se meri u «koliko vremena provodim da objasním modelu što on već treba da zna». Sa fine-tuniranim modelima, to vreme ide ka nuli. ==== == Pun budžet: jednorazna investicija, smesna naknada [cols="3,2"] |=== |Пост |iznos |Obuka GPU (811 H100-h, Crusoe $2/h) |**$1.622** |Generisanje sintetičkog dataseta (API LLM) |**$400** |Izvodjenje (Ollama Pro godišnje, $17/mesec) |**$204** |**Ukupno prva godina** |**$2 226** |**Месечни эквивалент** |**$186** |**Procijenjen trošak po zahtevu** |< $0.01 |=== [plantuml, budget-breakdown, svg]</pre> </div> </div> <div class="paragraph"> <p>@startuml skinparam backgroundColor #FAFAFA</p> </div> <div class="paragraph"> <p>rectangle "Budžet godina 1: $2 226" as Total #E8E8E8 { rectangle "Obuka GPU $1 622 (73%)" as Train #FF6B6B rectangle "Dataset distilacija $400 (18%)" as Data #FFE66D rectangle "Ollama Pro $204 (9%)" as Cloud #4ECDC4 }</p> </div> <div class="paragraph"> <p>note bottom of Total $186/mois équivalent année 1. Dès l’an 2 : $17/mois. Amorti par ~$235 de CA mensuel avec marge 95%. end note</p> </div> <div class="paragraph"> <p>@enduml</p> </div> <div class="listingblock"> <div class="content"> <pre>$186/mesec prva godina,**$17/mesec**Од 2. године. Цена премиум претплате на Netflix, за тим од 23 вештачког интелекта експерта доступних 24/7, који пишу код *у моjem стилу* без потребе да им објашњем своје конвенције. === Прерачун прибиљности Sa edster.cloud i njegovom maržom od ~95%, tacka bez dobitka je na**~$2 340 dodatnog CA**на годину. U praksi: * 1 misija pilotovanja softvera → $3 000-5 000 → pokrivena investicija + profit * 1 korporativni trening → $5 000-10 000 → udobno * Implicitni upsell : `mon équipe d'IA maîtrise ma forge logicielle` → komercijalna diferencijalnost Од године 2, обука више није плаћивана (искључено ажурирање dataseta). Годишњи трошкови padaju do**$204**($17/mesec). Odnos troškova i vrednosti je kao kod jednorožca: skoro nula. == Granice vežbe Ово остаје *оцена прстом у воде*. Променљиве могу да утичу на буџет: [cols="2,3"] |=== |Varijabla |Uticaj |Генерација синтетичног податковог скупа |Ако API за дистилизацију је гадна (халуцинације, лоше форматоване парове), потребно је човечко време за курирање. Сакривени трошок. |Kvoti GPU vremena Ollama |Ako korišćenje pretigne kvote Pro plana, treba će se nadogradi ili preći na poseban GPU. |Efektivna kvaliteta fine-tunes |Neuspešno fine-tune → da se ponovi. Stvarni rizik su hiperparametri, ne lokacija GPU. |Brza evolucija modela |Qwen3.6/Gemma 4 su izasli manje od 1 mesec pre. Za 6 meseci, sledeća generacija će biti bolja i jeftinija za fine-tuning. |=== [WARNING] ==== Ne pokrećite 811 sati treninga bez prvo testiranja pipelinea na *jedan* mikromodel. Jedno pokretanje 3-4h na Qwen 35B-A3B košta $8. Ako je dataset oštećen, saznate će to za $8, a ne za $1 622. ==== == Conclusion: fine-tune je postao dostupan luksuz Prije godine, fine-tunirati model od 292B parametara ( čak i u QLoRA) bilo je za istraživanje. Danas, u maju 2026., ovo je izvršivi projekat za samostalnog programera : * **811 H100-sati**obuke — $1 622 kod Crusoe * **23 specijalizovani modeli**Učitani na Ollama Cloud —**$17/mesec** * **0 server, 0 local GPU, 0 maintenance infrastructure** Demokratizacija je potekla od tri konvergenta faktora: 1. **MoE arhitekture**— koji omogućavaju efikasno fine-tuniranje modela kod kojih je aktivirana samo frakcija težina 2. **Fiksni planovi Ollama Cloud**— koji pretvaraju varijabilni trošak (per-token) u fiksni trošak (abonnement) 3. **Visokokvalitetni modeli open-weight**— DeepSeek V4, Qwen3.6, Gemma 4 su pod licencama MIT/Apache 2.0 Civilizacija se napreduje proširivanjem broja važnih operacija koje možemo da izvršimo bez razmišljanja o njima. Fine-tune, to je točno to: operacija koju deleguješ mašini da ne moraš više da o tome misliš. I 2026. godini, je jeftinije od mjesečno plaćenog mlađeg programera. --- _Чланак objavljen {jbake-date}_ == Finom podešavani modeli flotile [cols="2,2,2,2,3"] |=== |Уключена величина |broj |Osnovni model |домен |skup podataka |13B |1 |DeepSeek-V4-Flash-Base |општ radni prostor |50M tokens |13B |5 |DeepSeek-V4-Flash |Gradle, Kotlin, DAG, Doc, Infra |15M tokena |3.8B |6 |Gemma 4 26B-A4B |Mikro-zadaci, formatiranje, skriptovi |5M tokena |3B |5 |Qwen3.6-35B-A3B |Refactoring, review, intermediarni dokument |5M žetona |3B |5 |Qwen3.5-35B-A3B |Legacy zadaci, kompatibilnost |5M tokeni |=== == Resursi === Modeli otvorenih težina na HuggingFace * https://huggingface.co/deepseek-ai/DeepSeek-V4-Flash-Base[DeepSeek V4-Flash-Base — 292B parametara, licenca MIT] * https://huggingface.co/Qwen/Qwen3.6-35B-A3B[Qwen3.6-35B-A3B — 35B/3B aktivirani, license Apache 2.0] * https://huggingface.co/Qwen/Qwen3.5-35B-A3B[Qwen3.5-35B-A3B — 35B/3B aktivirani, licence Apache 2.0] * https://huggingface.co/google/gemma-4-26B-A4B-it[Gemma 4 26B-A4B — 26B/3.8B aktivirani, licenca Apache 2.0] === Izvor tarifa (maj 2026) * https://ollama.com/pricing[Cene Ollama Cloud — plan Pro $17/mesec godišnji] * https://www.anthropic.com/pricing[Tarifi Anthropic — Claude API (Opus 4.7 $5/$25, Sonnet 4.6 $3/$15, Haiku 4.5 $1/$5)] * https://openai.com/api/pricing/[Cene OpenAI — GPT API (GPT 5.5 $5/$30, GPT 5.4 $2.50/$15)] * https://deepinfra.com/pricing[Cene DeepInfra — GPU instance H100 $1,79/h, B200 $2,79/h] * Vast.ai, Crusoe Cloud, FluidStack, TensorDock, RunPod, CoreWeave, Lambda Labs — ručni izveštaji o cenama, datirani maj 2026. === Службене оглашења * https://qwen.ai/blog?id=qwen3.6-35b-a3b[Službeno obaveštenje Qwen3.6-35B-A3B — blog Qwen]— agentic kodiranje, Apache 2.0, kontekst 262K</pre> </div> </div> </div> </div> https://cheroliv.com/blog/2026/0120_cumuler_deux_abonnements_ollama_pro_docker_post.html Fri, 8 May 2026 00:00:00 +0000 blog/2026/0120_cumuler_deux_abonnements_ollama_pro_docker_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_увод">Увод</a></li> <li><a href="#_zašto_dvaput_isto">Zašto dvaput isto?</a></li> <li><a href="#_srce_problema_device_key">Srce problema: Device Key</a></li> <li><a href="#_sve_na_svom_mestu_korak_po_korak">Sve na svom mestu — korak po korak</a> <ul class="sectlevel2"> <li><a href="#_preduvjet">preduvjet</a></li> <li><a href="#_корак_1_створите_волуме">Корак 1 : Створите волуме</a></li> <li><a href="#_корак_2_покрени_docker_контејнер">Корак 2: покрени Docker контејнер</a></li> <li><a href="#_корак_3_преузети_јавни_кључ">Корак 3: Преузети јавни кључ</a></li> <li><a href="#_korak_4_sačuvajte_ključ_na_ollama_com">Korak 4: Sačuvajte ključ na Ollama.com</a></li> <li><a href="#_korak_5_testirati_sa_besplatnim_malim_modelom">Korak 5: Testirati sa besplatnim malim modelom</a></li> </ul> </li> <li><a href="#_ловушка_api_v1models">Ловушка API `/v1/models</a></li> <li><a href="#_резултат_две_сесије_два_налога_нула_конфликата">Резултат: Две сесије, Два налога, нула конфликата</a></li> <li><a href="#_научени_уроци">Научени уроци</a></li> <li><a href="#_za_dalji_napredak">Za dalji napredak</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 14 minutes</div> <p>Dva Pro pretplate, jedna mašina, jedna bankovna kartica i nula mrežnih konflikata. Kako mi je Docker omogućio da uduplim moj kapacitet oblačnog inferencije bez kupovine drugog računara.</p> </div> </div> </div> <div class="sect1"> <h2 id="_увод">Увод</h2> <div class="sectionbody"> <div class="paragraph"> <p>Koristim Ollama Pro već nekoliko meseci da napajam svoje OpenCode sesije oblackim modelima. Stvar je u tome što, čak i sa Pro pretplatom, brzo smo ograničeni zbog <strong>rate limiting</strong> kada pokrenemo više agente paralelno. Očigledno rešenje: druga pretplata.</p> </div> <div class="paragraph"> <p>Ali tu je drama.</p> </div> <div class="paragraph"> <p>Ollama svaku mašinu identifikuje jedinstvenim SSH ključem — njena poznata <strong>Device Key</strong>. Dve instance na istom OS dele istu identitet, a nemoguće je povezati dva Pro naloga na istom uređaju. I kao što verovatno sumnjate, ne bih kupio drugi laptop samo iz tog razloga.</p> </div> <div class="paragraph"> <p>Решење: да лажемо. Да заставимо Олама да мисли да се извршава на два različita рачунара, иако деле ист CPU, ист RAM и ист мрежни конекција. Docker će nam ponuditi savršenu izolacionu bušku.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain skinparam BoxPadding 10 skinparam DefaultFontSize 12 left to right direction node "физичка машина" { frame "Ollama инстанца A (Нативна)" as Native { database "Идентитет /usr/share/ollama/.ollama/id_ed25519" as KeyA portin "API\n:11434" as PortA } frame "Ollama Instanca B (Docker)" as Docker { database "Идентитет ~/ollama-b-data/id_ed25519" as KeyB portin "API\n:11435" as PortB } } cloud "Ollama oblak" { actor "Pro nalog A\n(email 1)" as AccountA actor "Pro B nalog\n(email 2)" as AccountB } KeyA --> AccountA : "SSH ključ A" KeyB --> AccountB : "SSH ključ B" PortA --> AccountA : "Zahtevi A" PortB --> AccountB : "Захтеви B" note bottom of Docker Conteneur isolé : identité SSH distincte, port réseau distinct, volume persistant end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_dvaput_isto">Zašto dvaput isto?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pre nego što me nazvete duševno bolesnim, slušajte me da vam objašnjam slučaj upotrebe.</p> </div> <div class="paragraph"> <p>Sa jednom Pro pretplatom, mogu da pokrenem model kao`deepseek-v4-pro:cloud`У сесії OpenCode. Проблема се јавља када желим <strong>две</strong> симултанне сессии. Квоте ограничења темпа доведу до тога да друга сесија застаје или је потпуно одбијена.</p> </div> <div class="paragraph"> <p>Sa dva nezavisna Pro pretplate:</p> </div> <div class="ulist"> <ul> <li> <p>Sesija OpenCode 1 → Profesionalni račun A`localhost:11434`)</p> </li> <li> <p>Sesija OpenCode 2 → Pro Račun B`localhost:11435`)</p> </li> </ul> </div> <div class="paragraph"> <p>Svaka sesija ima svoj kvotu, svoj kontekst i ne ometava drugog. To je ljudsko multiprocesiranje.</p> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p>Dva Pro pretplate = dva različita e‑maila. Ista bankarska karta radi — sistem plaćanja Ollama ne blokira više pretplata iz istog plaćnog sredstva. Proverio sam.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_srce_problema_device_key">Srce problema: Device Key</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kada instalirate Ollama, par SSH ed25519 ključeva se generiše u direktorijumu identiteta:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ cat /usr/share/ollama/.ollama/id_ed25519.pub ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAI...</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj ključ se prenosi na servere Ollama tokom`ollama signin`. Она је та која каже « овај рачунар pripada Pro nalogu ». Ако ваша две инстанце деле исту датотеку.<code>id_ed25519</code>, они деле исту идентитет. Крај игры.</p> </div> <div class="paragraph"> <p>Prevara : dati nasoj drugoj instanzi svoj direktorijum za identitet, izolovan u Docker volumen.</p> </div> </div> </div> <div class="sect1"> <h2 id="_sve_na_svom_mestu_korak_po_korak">Sve na svom mestu — korak po korak</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_preduvjet">preduvjet</h3> <div class="ulist"> <ul> <li> <p>Funkcionalna nativna instalacija Ollama (službeni skript`curl | sh`)</p> </li> <li> <p>Docker instaliran i funkcionalan</p> </li> <li> <p>Portainer ili docker-compose za rozvrštanje</p> </li> <li> <p>Два акаунта Ollama са два различита имејла</p> </li> </ul> </div> <div class="paragraph"> <p>Ja sam koristio verziju`0.20.2`— ta koja je pružena zvaničnim skriptom i odgovarajuća Docker slika.</p> </div> </div> <div class="sect2"> <h3 id="_корак_1_створите_волуме">Корак 1 : Створите волуме</h3> <div class="paragraph"> <p>Jednostavni direktorijum na gazdi će služiti kao trajni volumen za identitet instance B :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">mkdir -p ~/ollama-b-data</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj direktorijum će biti montiran u Docker kontejneru kao`/root/.ollama`, gde Ollama čuva svoje identitetne ključeve, svoju istoriju i svoje modele.</p> </div> </div> <div class="sect2"> <h3 id="_корак_2_покрени_docker_контејнер">Корак 2: покрени Docker контејнер</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml"># docker-compose.yml services: ollama-instance-b: image: ollama/ollama:0.20.2 container_name: ollama-instance-b ports: - "11435:11434" volumes: - /home/cheroliv/ollama-b-data:/root/.ollama environment: - OLLAMA_HOST=0.0.0.0 restart: always</code></pre> </div> </div> <div class="paragraph"> <p>Šta se deje ovde :</p> </div> <div class="ulist"> <ul> <li> <p>luka<strong>11435</strong>домаћина је мапирано на<strong>11434</strong>unutrašnji deo kontejnera. Zato, instanca Docker sluša na`:11435`bez sukoba sa nativnom instancom koja zauzima`:11434`.</p> </li> <li> <p>volumen`~/ollama-b-data`je montirano na`/root/.ollama`— tamo će se SSH identitet sačuvati.</p> </li> <li> <p>`OLLAMA_HOST=0.0.0.0`omogućuje kontejneru da prihvata vanjske konekcije</p> </li> </ul> </div> <div class="paragraph"> <p>Разврстао сам свој стек пре Portainer-а, али једноставан`docker compose up -d`функционише једнако dobro.</p> </div> </div> <div class="sect2"> <h3 id="_корак_3_преузети_јавни_кључ">Корак 3: Преузети јавни кључ</h3> <div class="paragraph"> <p>Контејнер будучи празан при првом покретању, Ollama аутоматски генерише нову пару SSH-ключева у волуму. Преуземемо јавни ключ :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ docker exec ollama-instance-b cat /root/.ollama/id_ed25519.pub ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIDDQ+dvnfmuo49q5O8LOlvgZ39SKORFw47ry9k4H2jPc</code></pre> </div> </div> <div class="paragraph"> <p>Proveravam da je ovaj ključ <strong>različit</strong> od onog nativne instance:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Instance native $ cat /usr/share/ollama/.ollama/id_ed25519.pub ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIGyF...(différente) # Instance Docker $ cat ~/ollama-b-data/id_ed25519.pub ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIDDQ...(différente)</code></pre> </div> </div> <div class="paragraph"> <p>Dva različita ključa, dva odvojena identiteta. Igra je završena.</p> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="ℹ️"></i> </td> <td class="content"> <div class="paragraph"> <p>Ako vaš kontejner se ponovo pokrene, on <strong>ponovo koristi</strong> ključeve prisutne u volumu. Identitet je stalni. Nećete izgubiti vezu sa Pro nalogom.</p> </div> </td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_korak_4_sačuvajte_ključ_na_ollama_com">Korak 4: Sačuvajte ključ na Ollama.com</h3> <div class="paragraph"> <p>Smer <a href="https://ollama.com/settings/keys" class="bare">https://ollama.com/settings/keys</a> → Dodaj SSH ključ. Zalepimo javni ključ Docker instance i potvrdimo.</p> </div> <div class="paragraph"> <p>Zatim, povežemo ovaj identitet sa nalogom Pro B:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ docker exec -it ollama-instance-b ollama signin</code></pre> </div> </div> <div class="paragraph"> <p>Preglednik se otvara, prijavimo se koristeći e‑mail naloga B, a token je povezan sa SSH ključem kontejnera. Proveravamo da je sve u redu:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ docker exec -it ollama-instance-b ollama signin User: cherolivpro</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_korak_5_testirati_sa_besplatnim_malim_modelom">Korak 5: Testirati sa besplatnim malim modelom</h3> <div class="paragraph"> <p>Pre nego što izgovorim cenu Pro pretplate, želim da budem siguran da cevovod radi. Povučem mali lokalni i besplatan model da proverim konektivnost:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ docker exec ollama-instance-b ollama pull qwen3:0.6b pulling manifest pulling 7f4030143c1c: 100% ▕██████████████████▏ 522 MB success $ curl -s http://localhost:11435/api/tags {"models":[{"name":"qwen3:0.6b","model":"qwen3:0.6b",...}]}</code></pre> </div> </div> <div class="paragraph"> <p>luka`11435`Odgovara, model je serviran. Instanca B je živa.</p> </div> <div class="paragraph"> <p>Jednom da se uverim, pređem na pull pravog modela cloud Pro :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ docker exec ollama-instance-b ollama pull deepseek-v4-pro:cloud pulling manifest pulling 31c3059e137e: 100% ▕██████████████████▏ 344 B success</code></pre> </div> </div> <div class="paragraph"> <p>344 bajtova za manifest modela u oblačnom okruženju — normalno, inferencija se vrši na strani servera, a ne lokalno. I evo konačnog testa :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ curl -s http://localhost:11435/v1/chat/completions \ -H "Content-Type: application/json" \ -d '{"model":"deepseek-v4-pro:cloud","messages":[{"role":"user","content":"Dis bonjour en une phrase courte."}]}' { "id": "chatcmpl-480", "model": "deepseek-v4-pro", "choices": [{ "message": { "content": "Bonjour !" }, "finish_reason": "stop" }], "usage": { "total_tokens": 181 } }</code></pre> </div> </div> <div class="paragraph"> <p>Zdravo i tebi, instanca B.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_ловушка_api_v1models">Ловушка API `/v1/models</h2> <div class="sectionbody"> <div class="paragraph"> <p>Изгубих 20 минута на глупом детаљу. када сам подешио провајдер`ollama-b`U OpenCode-u, ništa se nije pojavilo u selektoru modela. Ništa. Uopšte ništa.</p> </div> <div class="paragraph"> <p>Razlog ? API`/v1/models`instanca B je vraćala`{"object":"list","data":null}`umesto`{"object":"list","data":[]}`kada nije bilo povučeno ni jedan model. Vrednost`null`prouzrokovao je slom parsiranja na strani OpenCode, koji nije prikazivao provider.</p> </div> <div class="paragraph"> <p>Решение: декларисати моделе <strong>експлицитно</strong> у конфигурацији OpenCode умesto da se oslonite na dinamičko otkrivanje.</p> </div> <div class="listingblock"> <div class="title">~/.config/opencode/opencode.json</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-json hljs" data-lang="json">{ "$schema": "https://opencode.ai/config.json", "provider": { "ollama": { "npm": "@ai-sdk/openai-compatible", "name": "Ollama (local)", "options": { "baseURL": "http://localhost:11434/v1" }, "models": { "gemma4:e2b": { "name": "Gemma 4 E2B (local)" } } }, "ollama-b": { "npm": "@ai-sdk/openai-compatible", "name": "Ollama Instance B (Docker)", "options": { "baseURL": "http://localhost:11435/v1" }, "models": { "qwen3:0.6b": { "name": "Qwen3 0.6B (B)" }, "deepseek-v4-pro:cloud": { "name": "DeepSeek V4 Pro (B)" } } } } }</code></pre> </div> </div> <div class="paragraph"> <p>Sa ovom eksplicitnom deklaracijom, OpenCode odmah vidi provider B i njegove modele. Restart sesije, i selektor`/models`Prikazuje obje instance pored jedne strane druge.</p> </div> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="💡"></i> </td> <td class="content"> <div class="paragraph"> <p>Ako ne vidite svoj prilagođeni provider u`/models`, Ne gubite tri sata na ponovo pokretanje terminala. Deklarišete modele ručno u`opencode.json`— Rešava problem odmah.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_резултат_две_сесије_два_налога_нула_конфликата">Резултат: Две сесије, Два налога, нула конфликата</h2> <div class="sectionbody"> <div class="paragraph"> <p>Na kraju, mogu pokrenuti dve sesije OpenCode istovremeno:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">Session 1 → /models → Ollama (local) → deepseek-v4-pro:cloud → Compte A Session 2 → /models → Ollama Instance B (Docker) → deepseek-v4-pro:cloud → Compte B</code></pre> </div> </div> <div class="paragraph"> <p>Svaka sesija ima svoj kvotu, svoj rate limit i ne stepaju jedno drugom na nože. Ista mašina, ista plava kartica, dva različita mejla.</p> </div> <div class="paragraph"> <p>I najbolji? Docker kontejner je u`restart: always`. Он прежива ребуте систему без ручног вмешательства.</p> </div> </div> </div> <div class="sect1"> <h2 id="_научени_уроци">Научени уроци</h2> <div class="sectionbody"> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Docker izoliše sve, čak i identitet</strong>— Jednostavan bind mount toma je dovoljno da kontejneru da svoj sopstveni skup SSH ključeva, čineći ga neodvojivim od drugog fizičkog stroja u očima Ollama.</p> </li> <li> <p><strong>Dva emaila, ista CB</strong>— Ollama ne blokira višestruke pretplate iz istog načina plaćanja. Jedino e-mail mora biti različit.</p> </li> <li> <p><strong>Бесплатно тестирајте пре плаћања</strong> — Un <code>ollama pull qwen3:0.6b</code> (modèle libre, 522 Mo) permet de valider toute la chaîne réseau sans débourser un centime. Vous validez le plomberie d’abord, vous activez le Pro ensuite.</p> </li> <li> <p><strong>/v1/models` sa <code>data: null</code> ometa OpenCode</strong>— Ako podesite custom provider sa`"models": {}`, OpenCode pokušava da otkrije modele putem API-a. Ako API odgovori`data: null`, provider se ne pojavljuje. Izrazite modeli eksplicitno.</p> </li> <li> <p><strong>Два naloga, то је човечки мулти-процесинг</strong>— Jedan Pro nalog = jedna aktivna sesija OpenCode. Dva naloga = dve paralelne sesije. Za nekoga ko rukovodi više Gradle projekata u isto vreme, ovo je igra menjač.</p> </li> </ol> </div> </div> </div> <div class="sect1"> <h2 id="_za_dalji_napredak">Za dalji napredak</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="https://ollama.com/settings/keys">Ollama Settings — Upravljanje SSH ključeva</a></p> </li> <li> <p><a href="https://docs.ollama.com/">Službena dokumentacija Ollama</a></p> </li> <li> <p><a href="https://hub.docker.com/r/ollama/ollama">Slika Docker Ollama na Docker Hub</a></p> </li> <li> <p><a href="https://opencode.ai/docs/providers/#ollama">OpenCode — Pružač konfiguracije Ollama</a></p> </li> </ul> </div> <hr> <div class="paragraph"> <p><em>Članak objavljen u 2026-05-08</em></p> </div> </div> </div> https://cheroliv.com/blog/2026/0121_plugin_gradle_piloter_deux_instances_ollama_pro_post.html Fri, 8 May 2026 00:00:00 +0000 blog/2026/0121_plugin_gradle_piloter_deux_instances_ollama_pro_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_увод">Увод</a></li> <li><a href="#_zašto_gradle_za_infrastrukturu">Zašto Gradle za infrastrukturu?</a></li> <li><a href="#_пуна_build_gradle_kts">Пуна build.gradle.kts</a></li> <li><a href="#_anatomija_ključnih_zadataka">Anatomija ključnih zadataka</a> <ul class="sectlevel2"> <li><a href="#_startollamab_pokretač">startOllamaB` — Pokretač</a></li> <li><a href="#_signinb_interaktivni">signInB` — Interaktivni</a></li> <li><a href="#_pullmodelb_конфигуришиво">pullModelB` — Конфигуришиво</a></li> <li><a href="#_statusollamaall_dijagnostika">statusOllamaAll` — Dijagnostika</a></li> <li><a href="#_cleanollamab_čišćenje_koje_čuva_identitet">cleanOllamaB` — Čišćenje koje čuva identitet</a></li> </ul> </li> <li><a href="#_kompletan_radni_tok_od_nule_do_dve_sesije">Kompletan radni tok — Od nule do dve sesije</a></li> <li><a href="#_zašto_ne_napraviti_pravi_gradle_plugin">Zašto ne napraviti pravi Gradle plugin?</a></li> <li><a href="#_научене_лекције">Научене лекције</a></li> <li><a href="#_zaključak">Zaključak</a></li> <li><a href="#_ресурси">Ресурси</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">време за читање : 18 minutes</div> <p>Zašto kucati docker komande ručno kada možemo sve da encapsulamo u Gradle zadatke? Ovde je kako sam industrializovao svoju dual-Ollama Pro konfiguraciju bez vanjskih shell skriptova. Pokretanje, zaustavljanje, identitet, sign-in, pull — sve ide kroz`./gradlew`.</p> </div> </div> </div> <div class="sect1"> <h2 id="_увод">Увод</h2> <div class="sectionbody"> <div class="paragraph"> <p>U prethodnom članku sam pokazao kako učiniti dva Ollama Pro naloga da koexistiraju na istoj mašini isolovanjem druge instance u Docker kontejneru. Podešavanje radi, ali svakodnevno upravljanje postaje brzo mučno: zapamtiti ime kontejnera, ponovo pokrenuti ispravne komande.<code>docker exec</code>, proveri koji port je aktivan…​</p> </div> <div class="paragraph"> <p>Знаеш овај момент када имаш 14 отворених терминала и укуцаш`docker exec ollama-instance-b ollama list`за четврти пут, и да говорите самог с себе: « мора постојати чистији начин » ?</p> </div> <div class="paragraph"> <p>Ovo sredstvo, to je Gradle.</p> </div> <div class="paragraph"> <p>Nije samo za izgradnju koda. Gradle kao dirigent lokalne infrastrukture. Zadaci koji provisioniraju, proveravaju, testiraju i čiste. Sve to verzionisano u`build.gradle.kts`koji živi pored`docker-compose.yml`.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain skinparam handwritten false skinparam shadowing false skinparam BoxPadding 8 skinparam DefaultFontSize 11 skinparam ArrowThickness 1.5 left to right direction actor "Razvijalac" as Dev package "build.gradle.kts" as GradleFile { usecase "startOllamaB" as Start usecase "stopOllamaB" as Stop usecase "checkIdentity" as Check usecase "signInB" as SignIn usecase "pullModelB" as Pull usecase "testOllamaB" as Test usecase "statusOllamaAll" as Status usecase "cleanOllamaB" as Clean } package "Docker demon" as DockerDaemon { node "ollama-instance-b" as ContainerB { component ":11435" as Port database "~/ollama-b-data" as Volume } } package "Ollama Native" as Native { component ":11434" as NatPort } Dev --> Start Dev --> SignIn Dev --> Pull Dev --> Test Dev --> Status Dev --> Check Dev --> Stop Dev --> Clean Start ..> ContainerB : docker run -d Stop ..> ContainerB : docker stop Check ..> Volume : cat id_ed25519.pub SignIn ..> ContainerB : ollama signin Pull ..> ContainerB : ollama pull Test ..> ContainerB : curl /v1/chat/completions Status ..> ContainerB : docker ps Status ..> Native : curl :11434 Clean ..> ContainerB : docker rm -f note bottom of GradleFile Zéro script bash externe. Tout est dans le build.gradle.kts, versionné avec le projet. end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_gradle_za_infrastrukturu">Zašto Gradle za infrastrukturu?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pitanje je legitimno. Gradle, to je alat za gradnju. Normalno, on kompajlira, testira i pakuje. Ne pokreće Docker kontejnere.</p> </div> <div class="paragraph"> <p>Osim toga, Gradle je i motor za graf zavisnosti — i to je mesto gde postaje zanimljivo za naš slučaj.</p> </div> <div class="paragraph"> <p>Hoćemo:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Neka kontejner bude pokrenut pre prijave</p> </li> <li> <p>Neka se identitet proveri pre preuzimanja modela</p> </li> <li> <p>Da test API tiho ne uspe ako je kontejner iskљуčen</p> </li> </ol> </div> <div class="paragraph"> <p>Iz čistog grafa zavisnosti. Gradle je prilagođen za to. Kotlin DSL čini pisanje zadataka fluidnim, i`doLast`Omogućava izvršavanje sistemskih komandi kao da je to aplikativni kod.</p> </div> <div class="paragraph"> <p>I najvažnije: ne treba održavati bashrc, nema skriptova koji se povaljaju u`~/bin`, nema Makefile uz docker-compose. Sve se nalazi u jednom fajlu, na istom mestu kao i kod projekta.</p> </div> </div> </div> <div class="sect1"> <h2 id="_пуна_build_gradle_kts">Пуна build.gradle.kts</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovo je fajl koji sam na kraju napisao. Sve radi, od dodeljivanja volumena do curl proveravanja, uključujući interaktivni sign-in.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">import java.io.ByteArrayOutputStream plugins { base } // ------------------------------------------------------------------------- // Configuration // ------------------------------------------------------------------------- val instanceName = "ollama-instance-b" val instancePort = 11435 val instanceImage = "ollama/ollama:0.20.2" val dataDir = file("${System.getProperty("user.home")}/ollama-b-data") val nativePort = 11434 // Modèles à gérer — cloud Pro + un modèle local gratuit pour les tests val proModels = listOf("deepseek-v4-pro:cloud", "gemma4:31b-cloud") val freeModels = listOf("qwen3:0.6b") // ------------------------------------------------------------------------- // Tâche préparatoire — création du volume si absent // ------------------------------------------------------------------------- val prepareVolume by tasks.registering { group = "ollama" description = "Crée le répertoire de volume pour l'instance B si absent" doLast { if (!dataDir.exists()) { dataDir.mkdirs() println("Volume créé : ${dataDir.absolutePath}") } else { println("Volume existant : ${dataDir.absolutePath}") } } } // ------------------------------------------------------------------------- // Démarrage du conteneur Docker // ------------------------------------------------------------------------- val startOllamaB by tasks.registering(Exec::class) { group = "ollama" description = "Lance le conteneur Docker pour l'instance Ollama B" dependsOn(prepareVolume) commandLine( "docker", "run", "-d", "--name", instanceName, "-p", "$instancePort:11434", "-v", "${dataDir.absolutePath}:/root/.ollama", "-e", "OLLAMA_HOST=0.0.0.0", "--restart", "always", instanceImage ) isIgnoreExitValue = true doLast { val alreadyRunning = executionResult.get().exitValue != 0 if (alreadyRunning) { logger.lifecycle("Le conteneur '$instanceName' existe déjà — tentative de démarrage") } else { logger.lifecycle("Conteneur '$instanceName' lancé") } } } // ------------------------------------------------------------------------- // Arrêt du conteneur // ------------------------------------------------------------------------- val stopOllamaB by tasks.registering(Exec::class) { group = "ollama" description = "Arrête le conteneur Docker de l'instance B" commandLine("docker", "stop", instanceName) isIgnoreExitValue = true doLast { logger.lifecycle("Conteneur '$instanceName' arrêté") } } // ------------------------------------------------------------------------- // Affichage de la clé publique (Device Key) // ------------------------------------------------------------------------- val checkIdentity by tasks.registering(Exec::class) { group = "ollama" description = "Affiche la clé publique SSH de l'instance B" dependsOn(startOllamaB) commandLine("docker", "exec", instanceName, "cat", "/root/.ollama/id_ed25519.pub") standardOutput = ByteArrayOutputStream() doLast { val pubKey = standardOutput.toString().trim() println("=".repeat(60)) println("Device Key (Instance B)") println("=".repeat(60)) println(pubKey) println("=".repeat(60)) println("→ Enregistre cette clé sur https://ollama.com/settings/keys") println("→ Puis exécute : ./gradlew signInB") println("=".repeat(60)) } } // ------------------------------------------------------------------------- // Sign-in interactif (Ouvrira le navigateur) // ------------------------------------------------------------------------- val signInB by tasks.registering(Exec::class) { group = "ollama" description = "Lance l'authentification interactive Ollama pour le compte B" dependsOn(startOllamaB) standardInput = System.`in` standardOutput = System.out errorOutput = System.err commandLine("docker", "exec", "-it", instanceName, "ollama", "signin") doFirst { logger.lifecycle("Authentification pour le Compte Pro B...") logger.lifecycle("Ouvre ton navigateur et connecte-toi avec l'email du compte B") } } // ------------------------------------------------------------------------- // Pull d'un modèle (paramétrable via propriété Gradle) // ------------------------------------------------------------------------- val pullModelB by tasks.registering(Exec::class) { group = "ollama" description = "Pull un modèle sur l'instance B. Usage : ./gradlew pullModelB -Pmodel=nom:tag" dependsOn(startOllamaB) val modelName = project.findProperty("model") as? String ?: "qwen3:0.6b" commandLine("docker", "exec", instanceName, "ollama", "pull", modelName) doFirst { logger.lifecycle("Pull du modèle '$modelName' sur l'instance B...") } doLast { logger.lifecycle("Modèle '$modelName' pullé avec succès") } } // ------------------------------------------------------------------------- // Pull de tous les modèles Pro (batch) // ------------------------------------------------------------------------- val pullAllProModels by tasks.registering { group = "ollama" description = "Pull tous les modèles cloud Pro sur l'instance B" dependsOn(startOllamaB) doLast { proModels.forEach { model -> logger.lifecycle("→ Pull $model...") val process = ProcessBuilder("docker", "exec", instanceName, "ollama", "pull", model) .inheritIO() .start() process.waitFor() } logger.lifecycle("Tous les modèles Pro pullés") } } // ------------------------------------------------------------------------- // Pull de tous les modèles gratuits (batch / première install) // ------------------------------------------------------------------------- val pullAllFreeModels by tasks.registering { group = "ollama" description = "Pull tous les modèles locaux gratuits sur l'instance B" dependsOn(startOllamaB) doLast { freeModels.forEach { model -> logger.lifecycle("→ Pull $model...") val process = ProcessBuilder("docker", "exec", instanceName, "ollama", "pull", model) .inheritIO() .start() process.waitFor() } logger.lifecycle("Tous les modèles gratuits pullés") } } // ------------------------------------------------------------------------- // Liste des modèles disponibles sur l'instance B // ------------------------------------------------------------------------- val listModelsB by tasks.registering(Exec::class) { group = "ollama" description = "Liste les modèles disponibles sur l'instance B" dependsOn(startOllamaB) commandLine("docker", "exec", instanceName, "ollama", "list") } // ------------------------------------------------------------------------- // Health check — test API sur les deux instances // ------------------------------------------------------------------------- val testOllamaB by tasks.registering { group = "ollama" description = "Teste la connectivité API de l'instance B avec un simple chat" dependsOn(startOllamaB) doLast { val model = project.findProperty("model") as? String ?: "qwen3:0.6b" logger.lifecycle("Test de l'instance B avec le modèle '$model'...") val payload = """ { "model": "$model", "messages": [{"role": "user", "content": "Réponds uniquement par OK"}], "max_tokens": 5 } """.trimIndent() val process = ProcessBuilder( "curl", "-s", "http://localhost:$instancePort/v1/chat/completions", "-H", "Content-Type: application/json", "-d", payload ).start() val response = process.inputStream.bufferedReader().readText() process.waitFor() if (response.contains("\"id\":\"chatcmpl") || response.contains("\"choices\"")) { println("✓ Instance B OK — port $instancePort répond") println(" Response: ${response.take(120)}...") } else { println("✗ Instance B INACTIVE — vérifie le conteneur avec './gradlew statusOllamaAll'") println(" Raw: $response") } } } // ------------------------------------------------------------------------- // Health check sur les deux instances simultanément // ------------------------------------------------------------------------- val statusOllamaAll by tasks.registering { group = "ollama" description = "Vérifie le statut des deux instances Ollama (native + Docker)" doLast { // Instance native runCatching { val process = ProcessBuilder( "curl", "-s", "-o", "/dev/null", "-w", "%{http_code}", "http://localhost:$nativePort/api/tags" ).start() val code = process.inputStream.bufferedReader().readText().trim() process.waitFor() println(if (code == "200") "✓ Instance Native — port $nativePort OK (HTTP $code)" else "✗ Instance Native — port $nativePort (HTTP $code)") }.getOrElse { println("✗ Instance Native — injoignable sur le port $nativePort") } // Instance Docker runCatching { val process = ProcessBuilder( "curl", "-s", "-o", "/dev/null", "-w", "%{http_code}", "http://localhost:$instancePort/api/tags" ).start() val code = process.inputStream.bufferedReader().readText().trim() process.waitFor() println(if (code == "200") "✓ Instance Docker B — port $instancePort OK (HTTP $code)" else "✗ Instance Docker B — port $instancePort (HTTP $code)") }.getOrElse { println("✗ Instance Docker B — injoignable sur le port $instancePort") } // Info conteneur runCatching { val process = ProcessBuilder("docker", "ps", "--filter", "name=$instanceName", "--format", "table {{.Names}}\\t{{.Status}}\\t{{.Ports}}").start() val status = process.inputStream.bufferedReader().readText() process.waitFor() println() println("Conteneur Docker :") println(status) } } } // ------------------------------------------------------------------------- // Nettoyage complet // ------------------------------------------------------------------------- val cleanOllamaB by tasks.registering(Exec::class) { group = "ollama" description = "Arrête et supprime le conteneur Docker de l'instance B" dependsOn(stopOllamaB) commandLine("docker", "rm", instanceName) isIgnoreExitValue = true doLast { logger.lifecycle("Conteneur '$instanceName' supprimé") logger.lifecycle("Le volume ${dataDir.absolutePath} est conservé (identité persistante)") } } // ------------------------------------------------------------------------- // Affichage des instructions // ------------------------------------------------------------------------- val helpOllama by tasks.registering { group = "ollama" description = "Affiche l'aide des tâches Ollama disponibles" doLast { println(""" ╔══════════════════════════════════════════════════════════════╗ ║ Tâches Gradle — Pilotage Dual Ollama Pro ║ ╠══════════════════════════════════════════════════════════════╣ ║ ./gradlew startOllamaB Démarrer l'instance Docker B ║ ║ ./gradlew stopOllamaB Arrêter l'instance Docker B ║ ║ ./gradlew checkIdentity Afficher la clé SSH publique ║ ║ ./gradlew signInB Sign-in interactif compte B ║ ║ ./gradlew pullModelB Pull un modèle (-Pmodel=...) ║ ║ ./gradlew pullAllProModels Pull tous les modèles Pro ║ ║ ./gradlew pullAllFreeModels Pull tous les modèles gratuits ║ ║ ./gradlew listModelsB Lister les modèles instance B ║ ║ ./gradlew testOllamaB Test API avec un chat simple ║ ║ ./gradlew statusOllamaAll Santé des 2 instances ║ ║ ./gradlew cleanOllamaB Supprimer le conteneur ║ ║ ./gradlew helpOllama Cette aide ║ ╚══════════════════════════════════════════════════════════════╝ """.trimIndent()) } }</code></pre> </div> </div> <div class="paragraph"> <p>Evo. dvanaest zadataka, jedna ulazna tačka i nula trenja.</p> </div> </div> </div> <div class="sect1"> <h2 id="_anatomija_ključnih_zadataka">Anatomija ključnih zadataka</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_startollamab_pokretač">startOllamaB` — Pokretač</h3> <div class="paragraph"> <p>Ništa čudno : jedan`docker run -d`с правилним параметрима. Савјет је у`isIgnoreExitValue = true`.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">isIgnoreExitValue = true</code></pre> </div> </div> <div class="paragraph"> <p>Ako kontejner već postoji, komanda`docker run`neuspešno (exit code ≠ 0). Bez ove svojstva, Gradle bi prekinuo cijeli build zbog greške. Ovdje, neuspeh je tiho — i`doLast`detektuje da li je bio 'već postojeći' ili prava greška.</p> </div> <div class="paragraph"> <p>Le `doLast`Bitno: Pokreće se <strong>posle</strong> izvršenja komande, što omogućava inspekciju`executionResult.get().exitValue`и да се логова adekvatna poruka.</p> </div> </div> <div class="sect2"> <h3 id="_signinb_interaktivni">signInB` — Interaktivni</h3> <div class="paragraph"> <p>Ово је jedini zadatak koji zahteva interakciju čoveka. Gradle prenosi`System.in`za proces kako bi prompt`ollama signin`da se normalno prikaže :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">standardInput = System.`in` standardOutput = System.out errorOutput = System.err</code></pre> </div> </div> <div class="paragraph"> <p>Bez toga, sign-in bi se blokirao jer bi stdin bio zatvoren i nikada ne biste videli prompt.</p> </div> </div> <div class="sect2"> <h3 id="_pullmodelb_конфигуришиво">pullModelB` — Конфигуришиво</h3> <div class="paragraph"> <p>Opšti zadatak koji prima parametar putem`-P`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew pullModelB -Pmodel=deepseek-v4-pro:cloud ./gradlew pullModelB # fallback : qwen3:0.6b</code></pre> </div> </div> <div class="paragraph"> <p>Fallback je važan:`project.findProperty("model") as? String ?: "qwen3:0.6b"`garantuje da zadatak ne eksplodira ako se zaboravi parametar.</p> </div> </div> <div class="sect2"> <h3 id="_statusollamaall_dijagnostika">statusOllamaAll` — Dijagnostika</h3> <div class="paragraph"> <p>dva`curl`у здрављу на пристаништима`11434` et <code>11435</code>, sa rezervnim u`runCatching`Да не падне ако је једна од инстанци down. Излаз је структуриран :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">✓ Instance Native — port 11434 OK (HTTP 200) ✓ Instance Docker B — port 11435 OK (HTTP 200) Conteneur Docker : NAMES STATUS PORTS ollama-instance-b Up 3 hours 0.0.0.0:11435->11434/tcp</code></pre> </div> </div> <div class="paragraph"> <p>Jedan pogled, i znaš tačno što se okreće i što nije u redu.</p> </div> </div> <div class="sect2"> <h3 id="_cleanollamab_čišćenje_koje_čuva_identitet">cleanOllamaB` — Čišćenje koje čuva identitet</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">commandLine("docker", "rm", instanceName) isIgnoreExitValue = true</code></pre> </div> </div> <div class="paragraph"> <p>Kontejner je obrisan, ali volumen`~/ollama-b-data`je<strong>sačuvan</strong>. SSH identitet prežive čišćenje. U sledećem`startOllamaB`, isti kljućevi će se ponovo koristiti — nije potrebno ponovo uraditi sign-in ni ponovo sačuvati Device Key.</p> </div> <div class="admonitionblock caution"> <table> <tr> <td class="icon"> <i class="fa icon-caution" title="🔒"></i> </td> <td class="content"> <div class="paragraph"> <p><code>cleanOllamaB`Ne dodiruj volumen. Ako želiš da obrišeš identitet B (i da ponovo počneš od nule), moraš da ga obrišeš.</code>~/ollama-b-data`ručno. To je dobrovoljno — jedan`clean`Не треба да брише учетнике.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_kompletan_radni_tok_od_nule_do_dve_sesije">Kompletan radni tok — Od nule do dve sesije</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovo je idealna sekvenca za nekoga ko stiže na projekat i želi da sve podesi bez otvaranja dokumentacije :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text"># 1. Premier contact — que faire ? $ ./gradlew helpOllama # 2. On démarre l'instance B $ ./gradlew startOllamaB # 3. On récupère la Device Key et on l'enregistre sur ollama.com $ ./gradlew checkIdentity # → copier-coller de la clé sur https://ollama.com/settings/keys # 4. Authentification interactive $ ./gradlew signInB # 5. Pull d'un petit modèle gratuit pour tester la plomberie $ ./gradlew pullModelB # 6. Test API $ ./gradlew testOllamaB # 7. Si tout est vert, pull des modèles Pro $ ./gradlew pullAllProModels # 8. Vérification finale des deux instances $ ./gradlew statusOllamaAll</code></pre> </div> </div> <div class="paragraph"> <p>Manje od dva minuta, sve je obezbeđeno. Nema README za čitanje, nema varijabli okruženja za postavljanje. Zadatak`helpOllama`služi kao integrisana dokumentacija.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain skinparam DefaultFontSize 11 actor Développeur as Dev participant "Gradle\n(build.gradle.kts)" as Gradle participant "Docker\ndajmon" as Docker participant "Ollama Instanca B" as OllamaB participant "Ollama Oblak" as Cloud == Provisionnement == Dev -> Gradle : helpOllama Gradle --> Dev : Aide et instructions Dev -> Gradle : startOllamaB Gradle -> Docker : docker run -d ollama/ollama:0.20.2 Docker -> OllamaB : Génération clés SSH (id_ed25519) Docker --> Gradle : conteneur lancé Gradle --> Dev : OK Dev -> Gradle : checkIdentity Gradle -> Docker : cat id_ed25519.pub Gradle --> Dev : Clé publique SSH Dev -> Cloud : Enregistrement clé SSH\n(sur ollama.com/settings/keys) == Authentification == Dev -> Gradle : signInB Gradle -> Docker : ollama signin (interactif) Dev <-> Cloud : Login navigateur (compte B) Docker -> Cloud : Échange token ⇔ Device Key Gradle --> Dev : Authentifié == Vérification == Dev -> Gradle : pullModelB Gradle -> Docker : ollama pull qwen3:0.6b Gradle --> Dev : Modèle pullé Dev -> Gradle : testOllamaB Gradle -> Docker : curl /v1/chat/completions Gradle --> Dev : ✓ Instance B OK == Production == Dev -> Gradle : pullAllProModels Gradle -> Docker : ollama pull deepseek-v4-pro:cloud Gradle -> Docker : ollama pull gemma4:31b-cloud Gradle --> Dev : Modèles Pro pullés Dev -> Gradle : statusOllamaAll Gradle --> Dev : ✓ Native ✓ Docker B @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_ne_napraviti_pravi_gradle_plugin">Zašto ne napraviti pravi Gradle plugin?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Питање оправдано. Извуци овај`build.gradle.kts`Samostalni Gradle plugin bi imao prednosti: ponovna upotreba između projekata, deklarativna konfiguracija, proširenje DSL.</p> </div> <div class="paragraph"> <p>Ali za sada, to nema smisla. Ovaj build nema složenu poslovnu logiku — je omotač oko Docker i curl komandi. Dodatni sloj potpunog Gradle plugin-a (sa ekstenzijom, unit testovima, publikacijom) bi bio nepomerano za 12 utilitarnih zadataka.</p> </div> <div class="paragraph"> <p>Le `build.gradle.kts`inline живи у пројекту који га потребује. Тривијално га је копирати где и да. Ако једног дана имам три пројекта која на њему зависе, претраћу га у додатак. За сада, KISS.</p> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="ℹ️"></i> </td> <td class="content"> <div class="paragraph"> <p>Дан када имаш три`build.gradle.kts`идентични у три пројекта, овај сигнал да се извече плагин. Пре toga, дуплирање је јефтиније од абстракције. Мудрост девелопера.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_научене_лекције">Научене лекције</h2> <div class="sectionbody"> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Gradle nije samo alat za gradnju</strong>— Механизам графа зависности чини из њега страшњи оркестратор инфраструктуре.<code>doLast</code>, <code>isIgnoreExitValue</code>, `dependsOn`Ove tri primitivne operacije su dovoljne za upravljanje Docker kontejnerom sa istom pouzdanošću kao i CI pipeline.</p> </li> <li> <p><strong>isIgnoreExitValue` je tvoj prijatelj</strong>— U idealnom svetu,<code>docker run`na već postojećem kontejneru vratio bi upozorenje umesto koda greške. U stvarnom svetu, staviš`isIgnoreExitValue = true`и ти управљаш дијагностиком у`doLast</code>.</p> </li> <li> <p><strong>Parametrizabilni zadaci ubijavaju nejednoznačnost</strong> — Un <code>pullModelB`generički sa</code>-Pmodel=…​`Zamenjuje N specijalizovanih zadataka. Jedan zadatak, jedna dokumentacija, jedno ponašanje.</p> </li> <li> <p><strong>runCatching` za proveru zdravlja</strong>— Kada testiraš N endpointa, pad prvog ne sme da spriječava testiranje ostalih.<code>runCatching</code>+`getOrElse`po endpoint, i dijagnostika ostaje kompletna čak i u slučaju delimičnog kvara.</p> </li> <li> <p><strong>Zadatak <code>helpOllama</code> kao izvršna dokumentacija</strong> — Un `println()`Dobro formatiran zamena za README od tri pasusa. On je samodokumentovan, uvek ažuriran i pristupačan bez izlaska iz terminala.</p> </li> </ol> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Prešli smo od ručnog upisivanja Docker komandi do kompletog, verzionisanog i ponovnog korišćenja Gradle workflowa. Dvanaest zadataka pokriva ceo životni ciklus: provisioniranje, identitet, prijava, pull, testiranje, dijagnostika, čišćenje.</p> </div> <div class="paragraph"> <p>Kombinacija docker-compose + build.gradle.kts + opencode.json čini čistu trojku: Docker za izolaciju, Gradle za orkestraciju, OpenCode za konzumaciju. Svaki sloj ima svoju odgovornost, i nijedan ne prelazi na drugi.</p> </div> <div class="paragraph"> <p>Sledeći korak? Automatizovati ciklus života u CI da bi Ollama instance bile dostupne u privremenim razvojnim okruženjima. Ali to je tema za drugi članak.</p> </div> </div> </div> <div class="sect1"> <h2 id="_ресурси">Ресурси</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="https://docs.gradle.org/current/userguide/tutorial_using_tasks.html">Priručnik korisnika Gradle — Zadaci</a></p> </li> <li> <p><a href="https://docs.gradle.org/current/userguide/custom_tasks.html">User Manual Gradle — Prilagođeni zadaci</a></p> </li> <li> <p><a href="https://hub.docker.com/r/ollama/ollama">Slika Docker Ollama na Docker Hub</a></p> </li> <li> <p><a href="https://kotlinlang.org/docs/gradle.html">Gradle DSL Kotlin — Dokumentacija</a></p> </li> </ul> </div> <hr> <div class="paragraph"> <p><em>Članak objavljen 2026-05-08</em></p> </div> </div> </div> https://cheroliv.com/blog/2025/0080_kitty_term_post.html Thu, 7 May 2026 00:00:00 +0000 blog/2025/0080_kitty_term_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_zašto_odabrati_kitty_i_zsh">Zašto odabrati Kitty i Zsh?</a></li> <li><a href="#_preduvjeti_sistema">Preduvjeti sistema</a></li> <li><a href="#_preuzimanje_i_instalacija_kitty">Preuzimanje i instalacija Kitty</a> <ul class="sectlevel2"> <li><a href="#_preuzmite_skriptu_instalacije">Preuzmite skriptu instalacije</a></li> <li><a href="#_креирање_симболичких_веза">Креирање симболичких веза</a></li> </ul> </li> <li><a href="#_интеграција_kitty_у_xubuntu">Интеграција Kitty у Xubuntu</a> <ul class="sectlevel2"> <li><a href="#_копирај_фајл_desktop">Копирај фајл desktop</a></li> <li><a href="#_izmeni_fajl_desktop">Izmeni fajl desktop</a></li> <li><a href="#_postavite_kitty_kao_podrazumevani_terminal_opciono">Postavite Kitty kao podrazumevani terminal (opciono)</a></li> </ul> </li> <li><a href="#_instalacija_zsh">Instalacija Zsh</a></li> <li><a href="#_поставити_zsh_као_подразумевани_шел">Поставити Zsh као подразумевани шел</a> <ul class="sectlevel2"> <li><a href="#_globalna_metoda_za_sve_terminale">Globalna metoda (za sve terminale)</a></li> <li><a href="#_specifična_metoda_za_kitty">Specifična metoda za Kitty</a></li> </ul> </li> <li><a href="#_конфигурација_zsh_опционно">Конфигурација Zsh (опционно)</a> <ul class="sectlevel2"> <li><a href="#_kreirati_datoteku_zshrc">Kreirati datoteku .zshrc</a></li> <li><a href="#_пример_минималне_конфигурације">Пример минималне конфигурације</a></li> </ul> </li> <li><a href="#_sažetak_kompletnog_workflow">Sažetak kompletnog workflow</a></li> <li><a href="#_finalna_proverka">Finalna proverka</a> <ul class="sectlevel2"> <li><a href="#_отвори_датотеку_конфигурације">📂 Отвори датотеку конфигурације</a></li> <li><a href="#_️_додати_или_изменити_font_size">🖋️ Додати или изменити `font_size</a></li> <li><a href="#_зачувај_и_рестартуј_kitty">💾 Зачувај и рестартуј Kitty</a></li> <li><a href="#_dinamičko_podešavanje_privremeni_zoom">✅ Dinamičko podešavanje (privremeni zoom)</a></li> </ul> </li> <li><a href="#_instalacija_i_konfiguracija_oh_my_zsh">Instalacija i konfiguracija Oh My Zsh</a> <ul class="sectlevel2"> <li><a href="#_instalacija_oh_my_zsh">Instalacija Oh My Zsh</a></li> <li><a href="#_промени_тему">Промени тему</a></li> <li><a href="#_проверка">Проверка</a></li> <li><a href="#_dijagram_služaja_korišćenja">Dijagram služaja korišćenja</a></li> </ul> </li> <li><a href="#_omogućite_translucentnost_u_kitty">Omogućite translucentnost u Kitty</a> <ul class="sectlevel2"> <li><a href="#_preduvjeti_za_prozirnost">Preduvjeti za prozirnost</a></li> <li><a href="#_конфигурација_прозрачности_у_kitty_conf">Конфигурација прозрачности у kitty.conf</a></li> <li><a href="#_рестартуј_кити">Рестартуј Кити</a></li> <li><a href="#_mogući_dodatci">Mogući dodatci</a></li> <li><a href="#_дијаграм_секвенце_иницијализација_kitty_са_прозрачношћу">Дијаграм секвенце - Иницијализација Kitty са прозрачношћу</a></li> <li><a href="#_poznata_ograničenja">poznata ograničenja</a></li> </ul> </li> <li><a href="#_onemogući_zvuk_zvono_za_čujno">Onemogući zvuk (zvono za čujno)</a></li> <li><a href="#_ажурирање_kitty">Ажурирање Kitty</a></li> <li><a href="#_референце">Референце</a></li> <li><a href="#_zaključak">Zaključak</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <p>Ovaj vodič objašnjava korak po korak kako instalirati terminal <strong>kitty</strong> na Xubuntu, pravilno ga konfigurisati i zamijeniti bash sa <strong>zsh</strong> kao podrazumevani shell. Projekt kitty je dostupan ovde: <a href="https://github.com/kovidgoyal/kitty" class="bare">https://github.com/kovidgoyal/kitty</a>.</p> </div> <div class="paragraph"> <p>(Empty) Kitty je modern, brz i podešiv terminal, posebno namijenjen zahtevnim programerima. <em>__</em></p> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_odabrati_kitty_i_zsh">Zašto odabrati Kitty i Zsh?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kitty se razlikuje po:</p> </div> <div class="ulist"> <ul> <li> <p>Bolje performanse zahvaljujući ubrzanje GPU,</p> </li> <li> <p>konfiguracija koja je potpuno bazirana na jednome tekstualnom fajlu,</p> </li> <li> <p>Odlična podrška za fontove i ligature.</p> </li> </ul> </div> <div class="paragraph"> <p>Zsh je, s druge strane, moćni interaktivni shell koji nudi:</p> </div> <div class="ulist"> <ul> <li> <p>Pametno dovršavanje,</p> </li> <li> <p>Прилагођен prompt,</p> </li> <li> <p>Velika kompatibilnost sa bash.</p> </li> </ul> </div> <div class="paragraph"> <p>Kombinovanjem Kitty i Zsh, dobijate produktivno i estetsko okruženje.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml title Опросчена архитектура Kitty + Zsh actor User User --> Kitty : Lance le terminal Kitty --> Zsh : Initialise le shell interactif Zsh --> System : Interagit avec le système (fichiers, commandes) @enduml</pre> </div> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p>Ovaj uputnik je namerno ograničen na instalaciju preko skripte i na Xubuntu.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_preduvjeti_sistema">Preduvjeti sistema</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pre nego što počnete, uverite se da imate:</p> </div> <div class="ulist"> <ul> <li> <p>Xubuntu instaliran,</p> </li> <li> <p>pristup internetu,</p> </li> <li> <p>funkcionalna bash ljuska za pokretanje skripte.</p> </li> </ul> </div> <div class="paragraph"> <p>Proverite vaše okruženje :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">uname -a lsb_release -a</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_preuzimanje_i_instalacija_kitty">Preuzimanje i instalacija Kitty</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kitty preporučuje instalaciju putem zvaničnog skripta koji smešta fajlove u`~/.local/kitty.app`.</p> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="Important"></i> </td> <td class="content"> <div class="paragraph"> <p>Ova metoda je nezavisna od menadžera paketa (bez`apt`).</p> </div> </td> </tr> </table> </div> <div class="sect2"> <h3 id="_preuzmite_skriptu_instalacije">Preuzmite skriptu instalacije</h3> <div class="paragraph"> <p>Izvršite sledeću komandu:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">curl -L https://sw.kovidgoyal.net/kitty/installer.sh | sh /dev/stdin</code></pre> </div> </div> <div class="paragraph"> <p>Ова команда изврши :</p> </div> <div class="ulist"> <ul> <li> <p>преузимање бинарних фајлова,</p> </li> <li> <p>ekstrakcija u`~/.local/kitty.app`,</p> </li> <li> <p>Kreiranje simboličkih veza.</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre>@startuml title Preuzimanje i instalacija Kitty start :curl -L installer.sh; :sh /dev/stdin; :Décompression dans ~/.local/kitty.app; :create symlinks; stop @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_креирање_симболичких_веза">Креирање симболичких веза</h3> <div class="paragraph"> <p>Da bi se moglo pozvati`kitty`od terminala, napravite simbolički link :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">ln -s ~/.local/kitty.app/bin/kitty ~/.local/bin/kitty</code></pre> </div> </div> <div class="paragraph"> <p>Додајте`~/.local/bin`Додајте у ваш PATH ако није већ урађен :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">echo 'export PATH="$HOME/.local/bin:$PATH"' >> ~/.zshrc source ~/.zshrc</code></pre> </div> </div> <div class="paragraph"> <p>Možete proveriti instalaciju :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">kitty --version</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_интеграција_kitty_у_xubuntu">Интеграција Kitty у Xubuntu</h2> <div class="sectionbody"> <div class="paragraph"> <p>Aby se Kitty pojavila u meniju aplikacija:</p> </div> <div class="sect2"> <h3 id="_копирај_фајл_desktop">Копирај фајл desktop</h3> <div class="paragraph"> <p>Копирајте фајл`.desktop`обеспечен :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">cp ~/.local/kitty.app/share/applications/kitty.desktop ~/.local/share/applications/</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_izmeni_fajl_desktop">Izmeni fajl desktop</h3> <div class="paragraph"> <p>Uredite fajl :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">nano ~/.local/share/applications/kitty.desktop</code></pre> </div> </div> <div class="paragraph"> <p>Проверните или измените следеће линије :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">[Desktop Entry] Version=1.0 Type=Application Name=Kitty Terminal Comment=Fast GPU-based terminal emulator Exec=/home/$USER/.local/kitty.app/bin/kitty Icon=kitty Categories=System;TerminalEmulator;</code></pre> </div> </div> <div class="paragraph"> <p>Zamenite`YOURUSER`вашим корисничким именом.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml title Proces integracije Kitty u meni Xubuntu start :Copier .desktop; :Editer les chemins; :Sauvegarder; :Menu Applications; stop @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_postavite_kitty_kao_podrazumevani_terminal_opciono">Postavite Kitty kao podrazumevani terminal (opciono)</h3> <div class="paragraph"> <p>Da bi Kitty bio podrazumevani terminal koji se pokreće:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo update-alternatives --install /usr/bin/x-terminal-emulator x-terminal-emulator ~/.local/kitty.app/bin/kitty 50 sudo update-alternatives --config x-terminal-emulator</code></pre> </div> </div> <div class="paragraph"> <p>Изберите`kitty`у понуђеном мениу.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_instalacija_zsh">Instalacija Zsh</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ако Zsh није још инсталиран, покрените:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo apt install zsh</code></pre> </div> </div> <div class="paragraph"> <p>Проверите инсталацију :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">zsh --version</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_поставити_zsh_као_подразумевани_шел">Поставити Zsh као подразумевани шел</h2> <div class="sectionbody"> <div class="paragraph"> <p>Mozete promeniti vash shell globalno ili samo u Kitty.</p> </div> <div class="sect2"> <h3 id="_globalna_metoda_za_sve_terminale">Globalna metoda (za sve terminale)</h3> <div class="paragraph"> <p>Identifikujte apsolutni put :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">which zsh</code></pre> </div> </div> <div class="paragraph"> <p>Opšte`/usr/bin/zsh`.</p> </div> <div class="paragraph"> <p>Promenite podrazumevani shell:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">chsh -s /usr/bin/zsh</code></pre> </div> </div> <div class="paragraph"> <p>Odjavite se i ponovo se prijavite.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml title Globalna promena shell actor User User --> Bash : Session actuelle User --> System : chsh -s /usr/bin/zsh System --> "/etc/passwd" : Modifie le shell note right of "/etc/passwd" : Shell par défaut mis à jour @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_specifična_metoda_za_kitty">Specifična metoda za Kitty</h3> <div class="paragraph"> <p>Ako želite da izmenite samo shell u Kitty-u, izmenite fajl konfiguracije :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">nano ~/.config/kitty/kitty.conf</code></pre> </div> </div> <div class="paragraph"> <p>Dodajte ovu liniju:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">shell zsh</code></pre> </div> </div> <div class="paragraph"> <p>Зачувајте и рестартујте Кити</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_конфигурација_zsh_опционно">Конфигурација Zsh (опционно)</h2> <div class="sectionbody"> <div class="paragraph"> <p>Za prilagođavanje vašeg Zsh :</p> </div> <div class="sect2"> <h3 id="_kreirati_datoteku_zshrc">Kreirati datoteku .zshrc</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">touch ~/.zshrc nano ~/.zshrc</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_пример_минималне_конфигурације">Пример минималне конфигурације</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">export ZSH_THEME="robbyrussell" export PATH="$HOME/.local/bin:$PATH" alias ll="ls -la"</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_sažetak_kompletnog_workflow">Sažetak kompletnog workflow</h2> <div class="sectionbody"> <div class="paragraph"> <p>Shema ispod sažima cijeli proces:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml title Radni tok instalacije i konfiguracije start :Téléchargement script Kitty; :Installation dans ~/.local; :Création symlink; :Ajout ~/.local/bin au PATH; if (Zsh installé ?) then (non) :sudo apt install zsh; endif :Configurer Kitty.desktop; :Optionnel - changer terminal par défaut; :Optionnel - chsh -s /usr/bin/zsh; stop @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_finalna_proverka">Finalna proverka</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pokrenite Kitty :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">kitty</code></pre> </div> </div> <div class="paragraph"> <p>Trebali biste da vidite da`zsh`је активан :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">echo $SHELL</code></pre> </div> </div> <div class="paragraph"> <p>Очекиван резултат :</p> </div> <div class="paragraph"> <p>/usr/bin/zsh</p> </div> <div class="paragraph"> <p>Za promenu veličine fonta u<strong>Kitty</strong>, treba podesiti parametar`font_size`у конфигурациском фајлу. Ево детаљног поступка:</p> </div> <div class="sect2"> <h3 id="_отвори_датотеку_конфигурације">📂 Отвори датотеку конфигурације</h3> <div class="paragraph"> <p>Главна конфигурацијска датотека се обично налази у :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">~/.config/kitty/kitty.conf</code></pre> </div> </div> <div class="paragraph"> <p>Ако тај файл још не постоји, можете га да креирате. Пример :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">nano ~/.config/kitty/kitty.conf</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_️_додати_или_изменити_font_size">🖋️ Додати или изменити `font_size</h3> <div class="paragraph"> <p>Dodajte sledeću direктивu, ili je izmenite ako već postoji:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">font_size 14.0</code></pre> </div> </div> <div class="paragraph"> <p>ovde`14.0`Odgovara željenoj veličini. Možete uneti bilo kterou decimalnu vrednost, na primer`12.0`, <code>15.5</code>, i.t.d.</p> </div> </div> <div class="sect2"> <h3 id="_зачувај_и_рестартуј_kitty">💾 Зачувај и рестартуј Kitty</h3> <div class="ulist"> <ul> <li> <p>Sačuvajte (<code>Ctrl + O</code>, zatim`Entrée`) i ostavite (<code>Ctrl + X`Ako vi koristite`nano</code>.</p> </li> <li> <p>Zatvorite sve prozore Kitty, a zatim ponovo pokrenite terminal da bi promena stupila na snagu.</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_dinamičko_podešavanje_privremeni_zoom">✅ Dinamičko podešavanje (privremeni zoom)</h3> <div class="paragraph"> <p>Ako želite privremeno da povećate/umanjite približanje bez menjanja konfiguracije, koristite podrazumevanе prečice na tastaturi :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Повећај величину фонта</strong>:</p> </li> </ul> </div> <div class="paragraph"> <p><code>Ctrl + Shift + =</code></p> </div> <div class="ulist"> <ul> <li> <p><strong>Smanji veličinu fonta</strong>:</p> </li> </ul> </div> <div class="paragraph"> <p><code>Ctrl + Shift + -</code></p> </div> <div class="ulist"> <ul> <li> <p><strong>Ponovno postaviti veličinu</strong>:</p> </li> </ul> </div> <div class="paragraph"> <p><code>Ctrl + Shift + Backspace</code></p> </div> <div class="paragraph"> <p>Ove podešavanja ne ostaju posle zatvaranja terminala.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_instalacija_i_konfiguracija_oh_my_zsh">Instalacija i konfiguracija Oh My Zsh</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kada Zsh instalirate i podesite kao podrazumevani shell, možete poboljšati svoje okruženje pomoću <strong>Oh My Zsh</strong>, okvira za upravljanje Zsh konfiguracijom, koji nudi:</p> </div> <div class="ulist"> <ul> <li> <p>kolekcija tema za prompt</p> </li> <li> <p>mnogi pluginovi,</p> </li> <li> <p>jasna organizacija konfiguracije.</p> </li> </ul> </div> <div class="sect2"> <h3 id="_instalacija_oh_my_zsh">Instalacija Oh My Zsh</h3> <div class="paragraph"> <p>Uverite se da je Zsh aktivan:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">zsh --version</code></pre> </div> </div> <div class="paragraph"> <p>Ako je potrebno, pokrenite:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">zsh</code></pre> </div> </div> <div class="paragraph"> <p>Zatim preuzmite i pokrenite službeni skript za instalacija :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"</code></pre> </div> </div> <div class="paragraph"> <p>Ova skripta:</p> </div> <div class="ulist"> <ul> <li> <p>Napravi folder`~/.oh-my-zsh`,</p> </li> <li> <p>eventualno sačuvajte svoj fajl`~/.zshrc`,</p> </li> <li> <p>automatski aktivira novi prompt</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_промени_тему">Промени тему</h3> <div class="paragraph"> <p>Отворите ваш конфигурационни фајл:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">nano ~/.zshrc</code></pre> </div> </div> <div class="paragraph"> <p>Izmenite promenljivu`ZSH_THEME`za izbor druge teme (na primer`agnoster`) :</p> </div> <div class="paragraph"> <p>ZSH_THEME="agnoster</p> </div> <div class="paragraph"> <p>Зачувајте онда поновите учитавање конфигурације:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">source ~/.zshrc</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_проверка">Проверка</h3> <div class="paragraph"> <p>Pokrenite Kitty i proverite da li se prompt dobro promenio. Можете потврдити да је Oh My Zsh активан извршавањем :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">echo $ZSH</code></pre> </div> </div> <div class="paragraph"> <p>Резултат треба да буде сличан:</p> </div> <div class="paragraph"> <p>/home/tvoj_korisnik/.oh-my-zsh</p> </div> </div> <div class="sect2"> <h3 id="_dijagram_služaja_korišćenja">Dijagram služaja korišćenja</h3> <div class="listingblock"> <div class="content"> <pre>@startuml title Use case instalacija i uporaba Oh My Zsh actor Utilisateur as User package "Kitty Terminal" { component "Zsh ljus" as Zsh } component "Oh My Zsh okvir" as OhMyZsh User --> Kitty : Lance Kitty Kitty --> Zsh : Initialise Zsh Zsh --> OhMyZsh : Charge configuration (~/.zshrc, thèmes, plugins) User --> OhMyZsh : Personnalise le thème et les plugins @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_omogućite_translucentnost_u_kitty">Omogućite translucentnost u Kitty</h2> <div class="sectionbody"> <div class="paragraph"> <p>Jedna od najomiljenijih funkcija Kitty-ja je mogućnost dodavanja <strong>transparencija</strong> na pozadini terminala. Ovo omogućava da se lagano vidi podređeno okruženje (prozor, radna površina, itd.), što je poseban korisno pri multitaskingu.</p> </div> <div class="sect2"> <h3 id="_preduvjeti_za_prozirnost">Preduvjeti za prozirnost</h3> <div class="paragraph"> <p>Preglednost u Kitty-ju je zasnuta na<strong>kompozitor prozora</strong>korišćeno od strane grafičkog okruženja. Na Xubuntu (baziran na XFCE), uverite se da je<strong>Kompozicija je aktivirana.</strong>.</p> </div> <div class="ulist"> <div class="title">Проверити :</div> <ul> <li> <p>desni klik na radnu površinu > Podešavanja ><strong>Podešavanja menadžera prozora</strong>,</p> </li> <li> <p>tab<strong>Kompozitor</strong>: polje <strong>"Omogući kompoziciju"</strong> mora biti označeno.</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre>@startuml title Slucaj korišćenja - Aktiviranje providnosti u Kitty actor Utilisateur rectangle "Графичко окружење (XFCE/Xubuntu)" { usecase "Uključi kompoziciju" as UC1 } rectangle "Kitty Terminal" { usecase "Postaviti prozračnost u kitty.conf" as UC2 } Utilisateur --> UC1 Utilisateur --> UC2 @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_конфигурација_прозрачности_у_kitty_conf">Конфигурација прозрачности у kitty.conf</h3> <div class="paragraph"> <p>Otvorite vašu datoteku konfiguracije`~/.config/kitty/kitty.conf` :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">nano ~/.config/kitty/kitty.conf</code></pre> </div> </div> <div class="paragraph"> <p>Додајте или промените следеће линије:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-conf hljs" data-lang="conf">background_opacity 0.85</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj parametar prihvata vrednosti između:</p> </div> <div class="ulist"> <ul> <li> <p><code>1.0</code>→ непрозоран (без прозирности)</p> </li> <li> <p><code>0.0</code>→ potpuno prozirno (neupotrebljivo),</p> </li> <li> <p>srednje vrednosti kao`0.90`, <code>0.75</code>, itd.</p> </li> </ul> </div> <div class="paragraph"> <p>Dobar vizuelni kompromis je obično između`0.85` et <code>0.95</code>.</p> </div> </div> <div class="sect2"> <h3 id="_рестартуј_кити">Рестартуј Кити</h3> <div class="paragraph"> <p>Zatvorite sve primere Kitty, zatim pokrenite novi prozor da bi promene učinile efekat :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">kitty</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_mogući_dodatci">Mogući dodatci</h3> <div class="paragraph"> <p>Если користите прилагођен фон терминала, можете ebenfalls подесити боју фуда са прозорношћу (у RGBA) :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-conf hljs" data-lang="conf">background #1e1e2eff</code></pre> </div> </div> <div class="paragraph"> <p>Последна компонента (<code>ff</code>) ukazuje na opačnost (od`00` à <code>ff</code>).</p> </div> </div> <div class="sect2"> <h3 id="_дијаграм_секвенце_иницијализација_kitty_са_прозрачношћу">Дијаграм секвенце - Иницијализација Kitty са прозрачношћу</h3> <div class="listingblock"> <div class="content"> <pre>@startuml title Sekvenca pokretanja Kittya sa transparentnošću actor User participant "Kitty" as Kitty participant "XFCE kompozitor" as XFCE participant "GPU/Menedžer Prozora" as WM User -> Kitty : Lance Kitty Kitty -> kitty.conf : Lit configuration Kitty -> XFCE : Vérifie composition activée XFCE --> Kitty : Composition = active Kitty -> WM : Demande allocation fenêtrée transparente WM --> Kitty : OK (rendu avec alpha < 1) Kitty -> User : Affiche terminal translucide @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_poznata_ograničenja">poznata ograničenja</h3> <div class="admonitionblock warning"> <table> <tr> <td class="icon"> <i class="fa icon-warning" title="Warning"></i> </td> <td class="content"> <div class="paragraph"> <p>Prozirnost ne radi ako: - kompozitor XFCE je onemogućen, - nekompatibilan menadžer prozora se koristi - Koristite Kitty u <strong>tmux</strong> modu u pozadini bez podrške za transparentnost.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_onemogući_zvuk_zvono_za_čujno">Onemogući zvuk (zvono za čujno)</h2> <div class="sectionbody"> <div class="paragraph"> <p>Podrazumevano, Kitty izda zvuk <strong>bip</strong> kada se unese pogrešna komanda ili kada terminal događaj pokrene taj zvuk. Ovaj zvuk može brzo postati nervozirajući, posebno u okruženju intenzivnog razvoja.</p> </div> <div class="paragraph"> <p>Da biste onemogućili ovo ponašanje, dodajte sledeću direktivu u datoteku`~/.config/kitty/kitty.conf`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-conf hljs" data-lang="conf">audible_bell no</code></pre> </div> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p>Можете такође да активирате <strong>визуелни поврат</strong> уместо звучног бипа са :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-conf hljs" data-lang="conf">visual_bell yes</code></pre> </div> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_ажурирање_kitty">Ажурирање Kitty</h2> <div class="sectionbody"> <div class="paragraph"> <p>Jer je Kitty instaliran putem skripta i ne putem menadžera paketa, ažuriranje se vrši ponovnim pokretanjem zvaničnog skripta instalacije. Ovo omogućuje preuzimanje najnovije verzije i ažuriranje vaše postojeće instalacije u`~/.local/kitty.app`.</p> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p>Sufiks`.app`на путу`~/.local/kitty.app`Ово је конвенција инсталације Kitty на Linux преко његове официјалне скрипте, и не указује никако на изузетну савмесност са macOS.</p> </div> </td> </tr> </table> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="Important"></i> </td> <td class="content"> <div class="paragraph"> <p>Pre pokretanja komande za ažuriranje, uverite se da ste u svojom domaćem direktorijumu (<code>~</code>).</p> </div> </td> </tr> </table> </div> <div class="paragraph"> <p>Izvršite sledeću komandu iz vašeg domaćeg direktorijuma :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">curl -L https://sw.kovidgoyal.net/kitty/installer.sh | sh /dev/stdin</code></pre> </div> </div> <div class="paragraph"> <p>Ova skripta će se zadužiti :</p> </div> <div class="ulist"> <ul> <li> <p>Preuzmite binarne datoteke nove verzije.</p> </li> <li> <p>Извлекти датотеке у`~/.local/kitty.app`.</p> </li> <li> <p>Ažurirajte simboličke veze ako je potrebno.</p> </li> </ul> </div> <div class="paragraph"> <p>Posle ažuriranja preporučuje se da se zatvore sve instance Kitty-ja i ponovo pokrenu, da bi se osiguralo da je nova verzija pravilno primenjena.</p> </div> </div> </div> <div class="sect1"> <h2 id="_референце">Референце</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ako želite da duboko proučite prilagođavanje, konsultujte zvaničnu dokumentaciju:</p> </div> <div class="ulist"> <ul> <li> <p>Kitty : <a href="https://sw.kovidgoyal.net/kitty/" class="bare">https://sw.kovidgoyal.net/kitty/</a></p> </li> <li> <p><a href="https://sw.kovidgoyal.net/kitty/conf/#opt-kitty.background_opacity" class="bare">https://sw.kovidgoyal.net/kitty/conf/#opt-kitty.background_opacity</a></p> </li> <li> <p><a href="https://sw.kovidgoyal.net/kitty/conf/#opt-kitty.audible_bell" class="bare">https://sw.kovidgoyal.net/kitty/conf/#opt-kitty.audible_bell</a></p> </li> <li> <p>Zsh : <a href="https://zsh.sourceforge.io/" class="bare">https://zsh.sourceforge.io/</a></p> </li> <li> <p>Github: <a href="https://github.com/kovidgoyal/kitty" class="bare">https://github.com/kovidgoyal/kitty</a></p> </li> <li> <p>Zsh: <a href="https://zsh.sourceforge.io/" class="bare">https://zsh.sourceforge.io/</a></p> </li> <li> <p><a href="https://ohmyz.sh/" class="bare">https://ohmyz.sh/</a></p> </li> <li> <p><a href="https://github.com/ohmyzsh/ohmyzsh/wiki" class="bare">https://github.com/ohmyzsh/ohmyzsh/wiki</a></p> </li> <li> <p><a href="https://docs.xfce.org/xfce/xfwm4/compositor" class="bare">https://docs.xfce.org/xfce/xfwm4/compositor</a></p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Imate sada :</p> </div> <div class="ulist"> <ul> <li> <p>jedan moderni i efikasan terminal (Kitty)</p> </li> <li> <p>од моћног и прилагодељивог шелла (Zsh)</p> </li> <li> <p>čistog i nezavisnog podešavanja od sistemskih paketa</p> </li> <li> <p>jednog estetskog i funkcionalnog terminała opremljenog Oh My Zsh</p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0119_benchmark_dgx_spark_vs_cloud_abonnement_llm_post.html Wed, 6 May 2026 00:00:00 +0000 blog/2026/0119_benchmark_dgx_spark_vs_cloud_abonnement_llm_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_le_contexte_un_marché_qui_a_basculé">Le Contexte : Un Marché Qui a Basculé</a></li> <li><a href="#_le_panel_des_options">Le Panel des Options</a> <ul class="sectlevel2"> <li><a href="#_ce_que_jai_exclu_et_pourquoi">Ce Que J’ai Exclu (et Pourquoi)</a></li> </ul> </li> <li><a href="#_inférence_simple_la_mort_du_hardware_local">Inférence Simple : La Mort du Hardware Local</a> <ul class="sectlevel2"> <li><a href="#_le_calcul">Le Calcul</a></li> <li><a href="#_même_avec_un_usage_intensif">Même avec un Usage Intensif</a></li> </ul> </li> <li><a href="#_fine_tuning_le_cloud_est_imbattable">Fine-Tuning : Le Cloud Est Imbattable</a> <ul class="sectlevel2"> <li><a href="#_le_coût_réel_dun_fine_tune">Le Coût Réel d’un Fine-Tune</a></li> <li><a href="#_les_acteurs_spécialisés">Les Acteurs Spécialisés</a></li> </ul> </li> <li><a href="#_la_seule_vraie_raison_la_souveraineté_des_données">La Seule Vraie Raison : La Souveraineté des Données</a> <ul class="sectlevel2"> <li><a href="#_le_vrai_calcul_de_la_confidentialité">Le Vrai Calcul de la Confidentialité</a></li> </ul> </li> <li><a href="#_synthèse_la_matrice_de_décision">Synthèse : La Matrice de Décision</a></li> <li><a href="#_le_cas_particulier_labonnement_pro_face_aux_modèles_chinois">Le Cas Particulier : L’Abonnement Pro Face aux Modèles Chinois</a> <ul class="sectlevel2"> <li><a href="#_pourquoi_les_modèles_chinois_changent_tout">Pourquoi les Modèles Chinois Changent Tout</a></li> <li><a href="#_ce_que_ça_veut_dire_pour_le_hardware">Ce Que Ça Veut Dire pour le Hardware</a></li> </ul> </li> <li><a href="#_et_huawei">Et Huawei ?</a></li> <li><a href="#_conclusion_le_luxe_de_la_proximité">Conclusion : Le Luxe de la Proximité</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">temps de lecture : 14 minutes</div> <p>NVIDIA vend le DGX Spark comme un « supercalculateur IA de bureau » à $4 699. Ollama propose ses modèles cloud à $20/mois. Un H100 se loue $1.38/h chez Vast.ai. Et les modèles chinois open-source — DeepSeek, Qwen, GLM — sont disponibles partout, gratuitement, sans avoir à acheter une carte. Alors, ce Spark, il sert à quoi au juste ? J’ai fait les maths.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">toc</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_le_contexte_un_marché_qui_a_basculé">Le Contexte : Un Marché Qui a Basculé</h2> <div class="sectionbody"> <div class="paragraph"> <p>En mai 2026, le paysage de l’IA a radicalement changé par rapport à l’annonce du DGX Spark au CES 2025. Trois forces ont convergé pour rendre le hardware local de plus en plus difficile à justifier :</p> </div> <div class="ulist"> <ul> <li> <p><strong>L’effondrement des prix du cloud GPU</strong> : un H100 se loue entre $1.38 et $3/h, contre $5-8/h il y a 18 mois</p> </li> <li> <p><strong>L’explosion des modèles chinois open-source</strong> : DeepSeek-V4, Qwen-3, GLM-5 sont compétitifs avec les modèles occidentaux, disponibles gratuitement</p> </li> <li> <p><strong>La montée des plateformes d’inférence managée</strong> : Ollama, Groq, Together AI proposent des API à des tarifs agressifs, avec des paliers gratuits généreux</p> </li> </ul> </div> <div class="paragraph"> <p>Le DGX Spark, annoncé à $2 999 puis monté à $4 699, arrive dans un monde qui n’a plus besoin de lui.</p> </div> </div> </div> <div class="sect1"> <h2 id="_le_panel_des_options">Le Panel des Options</h2> <div class="sectionbody"> <div class="paragraph"> <p>Voici les solutions disponibles en mai 2026 pour faire tourner des LLMs, de la plus légère à la plus lourde :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> <col style="width: 2.5%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Option</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Coût</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">VRAM / Capacité</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Modèles accessibles</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Contrainte principale</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ollama Free</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">$0/mois</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Cloud léger</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tous modèles publics</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Usage limité, 1 modèle simultané</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Claude Pro</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">$20/mois (~$240/an)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">N/A (API fermée)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Claude 4.x uniquement</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Modèle unique, pas d’open-source</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ollama Pro</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">$20/mois (~$200/an)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Cloud medium</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tous modèles publics</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">3 modèles simultanés max</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ollama Max</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">$100/mois (~$1 200/an)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Cloud heavy</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tous modèles publics</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">10 modèles simultanés</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Cloud GPU (H100)</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">$1.38-3/h</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">80 Go HBM</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tous modèles, fine-tuning</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Facturation horaire, setup requis</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>DGX Spark</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">$4 699 (achat)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">128 Go unifié</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tous modèles <128 Go</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Lent (~10x moins qu’un H100), fixe</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Mac Studio M3 Ultra</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">~$5 000+</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">192 Go unifié</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tous modèles <192 Go</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Pas CUDA, écosystème MLX</p></td> </tr> </tbody> </table> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="💡"></i> </td> <td class="content"> <div class="paragraph"> <p>Les prix cloud GPU cités sont ceux de Vast.ai et RunPod en mai 2026 — du spot/on-demand, pas du réservé. Les prix des hyperscalers (AWS, GCP, Azure) restent 2-3x plus élevés.</p> </div> </td> </tr> </table> </div> <div class="sect2"> <h3 id="_ce_que_jai_exclu_et_pourquoi">Ce Que J’ai Exclu (et Pourquoi)</h3> <div class="paragraph"> <p>J’ai volontairement exclu les options suivantes de ce benchmark :</p> </div> <div class="ulist"> <ul> <li> <p><strong>API OpenAI / Anthropic / Google</strong> : le sujet ici est de faire tourner des modèles <strong>open-source</strong> qu’on peut choisir, fine-tuner, et ne pas être dépendant d’un vendor unique</p> </li> <li> <p><strong>Huawei Ascend / Atlas</strong> : Huawei ne commercialise pas d’équivalent desktop au DGX Spark. La gamme Ascend (910C, 910D) et Atlas (300I Duo, 350) est orientée datacenter — cartes PCIe, serveurs rack — pas des boîtiers compacts prêts à brancher. La puce Ascend 910C embarque 128 Go HBM mais c’est une puce serveur, pas un système autonome. L’Atlas 300I Duo offre 96 Go pour ~$1 400 mais nécessite une machine hôte</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_inférence_simple_la_mort_du_hardware_local">Inférence Simple : La Mort du Hardware Local</h2> <div class="sectionbody"> <div class="paragraph"> <p>Commençons par le cas d’usage le plus commun : chatter avec un LLM, faire du code review, générer du texte. Pas de fine-tuning, pas de batch processing, juste de l’inférence interactive.</p> </div> <div class="sect2"> <h3 id="_le_calcul">Le Calcul</h3> <div class="paragraph"> <p>Un DGX Spark à $4 699. Divisons par le coût annuel de chaque abonnement :</p> </div> <div id="diag-breakeven" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title Seuil de Rentabilité — DGX Spark ($4 699) vs Abonnements rectangle "DGX Spark\n$4 699" as spark #FFCDD2 rectangle "Ollama Pro\n$200/an" as opro #C8E6C9 rectangle "Claude Pro\n$240/an" as cpro #C8E6C9 rectangle "Ollama Max\n$1 200/an" as omax #FFF9C4 rectangle "Cloud H100\n$3/h × 10h/sem" as cloud #BBDEFB spark --> opro : 23.5 années ⏳ spark --> cpro : 19.6 années ⏳ spark --> omax : 3.9 années spark --> cloud : 3.0 années (à 10h/semaine, intermittent) note bottom of spark Sans compter l'électricité (~$150/an) Sans compter l'obsolescence hardware Sans compter qu'il est 10x plus lent end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Le verdict est brutal. Pour de l’inférence :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Ollama Pro</strong> : il vous faudrait <strong>23 ans</strong> pour amortir un DGX Spark. Le Spark sera obsolète depuis 20 ans.</p> </li> <li> <p><strong>Ollama Max</strong> : <strong>4 ans</strong> — à condition d’utiliser le Spark 24/7, ce que personne ne fait</p> </li> <li> <p><strong>Claude Pro</strong> : même problème, <strong>20 ans</strong> pour du single-model fermé</p> </li> </ul> </div> <div class="paragraph"> <p><em><em>_ La promesse du « supercalculateur IA de bureau » se heurte à une réalité comptable élémentaire : $4 699 / $20 par mois = jamais rentable pour un usage individuel. </em>_</em></p> </div> </div> <div class="sect2"> <h3 id="_même_avec_un_usage_intensif">Même avec un Usage Intensif</h3> <div class="paragraph"> <p>Prenons le pire scénario pour le cloud : vous faites tourner un H100 8h/jour, 5 jours/semaine, 52 semaines/an.</p> </div> <div class="ulist"> <ul> <li> <p>8 × 5 × 52 = 2 080 heures/an</p> </li> <li> <p>2 080 × $2/h (prix moyen spot H100) = <strong>$4 160/an</strong></p> </li> </ul> </div> <div class="paragraph"> <p>Le Spark ($4 699) est rentabilisé en <strong>13 mois</strong>. Sauf que :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Le H100 est <strong>~10x plus rapide</strong> que le GB10 du Spark. Vous faites en 1h ce que le Spark fait en 10h. Pour le même volume de travail, le H100 vous coûte $416/an, pas $4 160.</p> </li> <li> <p>Le H100 a 80 Go HBM à 3.35 To/s de bande passante. Le Spark a 128 Go LPDDR5X à 273 Go/s. Pour les gros modèles, la bande passante compte plus que la capacité.</p> </li> </ol> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p>Comparer 1h de H100 à 1h de Spark n’a pas de sens. Le H100 fait le travail 10x plus vite. Le vrai coût cloud pour un workload donné est donc ~10x inférieur au calcul naïf basé sur les heures.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_fine_tuning_le_cloud_est_imbattable">Fine-Tuning : Le Cloud Est Imbattable</h2> <div class="sectionbody"> <div class="paragraph"> <p>L’argument classique des défenseurs du Spark : « oui mais pour le fine-tuning, c’est différent ».</p> </div> <div class="paragraph"> <p>Non, ça ne l’est pas.</p> </div> <div class="sect2"> <h3 id="_le_coût_réel_dun_fine_tune">Le Coût Réel d’un Fine-Tune</h3> <div class="paragraph"> <p>Un fine-tune LoRA/QLoRA sur Unsloth d’un modèle 7B :</p> </div> <div class="ulist"> <ul> <li> <p>~2-3h sur un H100 = <strong>$5 à $9</strong></p> </li> <li> <p>Même chose sur le Spark = <strong>20-30h</strong> (10x plus lent), bloque la machine</p> </li> </ul> </div> <div class="paragraph"> <p>Avec les $4 699 du Spark, vous pouvez financer :</p> </div> <div class="ulist"> <ul> <li> <p><strong>~500 à ~900 fine-tunes</strong> en cloud H100</p> </li> <li> <p>Ou <strong>~23 ans</strong> d’Ollama Pro</p> </li> <li> <p>Ou <strong>~4 ans</strong> d’Ollama Max</p> </li> </ul> </div> <div class="paragraph"> <p>Et pour des modèles plus gros (70B+) :</p> </div> <div class="ulist"> <ul> <li> <p>Le Spark avec ses 128 Go peut charger un 70B en Q4 — mais le fine-tune sera extrêmement lent</p> </li> <li> <p>Un H100 avec 80 Go peut fine-tuner un 70B en QLoRA 4-bit en quelques heures</p> </li> <li> <p>Pour du full fine-tune, il faut du multi-GPU de toute façon — le Spark est hors course</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_les_acteurs_spécialisés">Les Acteurs Spécialisés</h3> <div class="paragraph"> <p>En 2026, des plateformes comme Unsloth, Modal, Replicate, et Together AI proposent du fine-tuning serverless :</p> </div> <div class="ulist"> <ul> <li> <p>Pas de gestion de GPU</p> </li> <li> <p>Pas de configuration d’environnement</p> </li> <li> <p>Paiement à la minute</p> </li> <li> <p>Optimisations intégrées (flash attention, quantization automatique)</p> </li> </ul> </div> <div id="diag-fine-tuning-cost" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title <size:20>Coût d'un Fine-Tune LoRA 7B — Comparaison</size> note as N |= Option |= Coût par fine-tune |= Fine-tunes possibles avec $4 699 | | **Replicate** | $3-5 | ~1 000 | | **Modal (serverless)** | $2-4 | ~1 500 | | **Unsloth + Vast.ai H100** | $5-9 | ~500-900 | | **Together AI** | $4-8 | ~600-1 000 | | **DGX Spark** | « gratuit » mais 20-30h | ∞ (en théorie) | end note note bottom Le Spark est « gratuit » par fine-tune seulement si votre temps vaut $0/h et que vous n'avez pas besoin de la machine pour autre chose pendant 30h end note @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_la_seule_vraie_raison_la_souveraineté_des_données">La Seule Vraie Raison : La Souveraineté des Données</h2> <div class="sectionbody"> <div class="paragraph"> <p>Après avoir éliminé l’inférence, le fine-tuning, et le rapport qualité/prix — que reste-t-il au Spark ?</p> </div> <div class="paragraph"> <p><strong>La confidentialité absolue.</strong></p> </div> <div class="paragraph"> <p>Pas la confidentialité « je ne veux pas que mes prompts soient lus par un employé d’OpenAI ». Ça, c’est un faux problème en 2026 : Ollama, Groq, et la plupart des providers respectables ont des politiques de zéro log et zéro rétention.</p> </div> <div class="paragraph"> <p>La vraie confidentialité, c’est :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Air-gap réglementaire</strong> : défense, diplomatie, santé — les données ne peuvent <strong>physiquement</strong> pas quitter le bâtiment</p> </li> <li> <p><strong>Données propriétaires critiques</strong> : code source d’un produit non publié, secrets industriels, algorithmes de trading</p> </li> <li> <p><strong>Résilience réseau</strong> : l’IA doit continuer à fonctionner même si Internet tombe</p> </li> </ul> </div> <div class="admonitionblock caution"> <table> <tr> <td class="icon"> <i class="fa icon-caution" title="🔒"></i> </td> <td class="content"> <div class="paragraph"> <p>Mais soyons honnêtes : quel pourcentage des acheteurs de DGX Spark est réellement dans ce cas ? 1% ? Le reste, c’est du « nice to have » transformé en dépense à $4 699.</p> </div> </td> </tr> </table> </div> <div class="sect2"> <h3 id="_le_vrai_calcul_de_la_confidentialité">Le Vrai Calcul de la Confidentialité</h3> <div class="paragraph"> <p>Pour un usage individuel :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Ollama Pro</strong> ($20/mois) + modèles open source chinois = solution pragmatique</p> </li> <li> <p>Si un prompt fuit chez Ollama, il se noie dans les millions de requêtes quotidiennes. C’est la goutte d’eau dans l’océan.</p> </li> <li> <p>Le risque réel n’est pas la fuite d’un prompt — c’est l’entraînement non consenti sur vos données. Et ça, les providers sérieux l’interdisent contractuellement.</p> </li> </ul> </div> <div class="paragraph"> <p><em><em>_ La peur de « distiller son prompt dans le LLM » est un niveau de propagation d’information personnel tellement dilué qu’il relève plus de l’anxiété que de la menace réelle. À l’échelle industrielle, c’est différent. Mais à l’échelle individuelle, c’est du bruit. </em>_</em></p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_synthèse_la_matrice_de_décision">Synthèse : La Matrice de Décision</h2> <div class="sectionbody"> <div id="diag-decision-matrix" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title Quelle Solution IA Choisir en 2026 ? start :Quel est votre besoin principal ?; switch (Besoin) case (Inférence interactive occasionnelle) :**Ollama Free**\n$0/mois, tous modèles open-source; stop case (Inférence quotidienne, code review, dev) :**Ollama Pro** ($20/mois)\nAccès à tous les modèles open-source\nDeepSeek, Qwen, GLM, Llama, Mistral; stop case (Agents IA, multi-modèles, usage intensif) :Contexte > 30K tokens ?; if (Oui) then :**Ollama Max** ($100/mois)\n10 modèles simultanés\nContexte long sans dégradation; stop else (Non) :**Cloud GPU H100 spot** ($1.38–3/h)\n+ Unsloth/Modal pour fine-tuning\nPerformance brute maximale; stop endif case (Fine-tuning régulier) :**Vast.ai H100 + Unsloth** ($5–9/fine-tune)\nou **Together AI / Modal** (serverless)\n500+ fine-tunes pour le prix d’un Spark; stop case (Air-gap obligatoire) :Données classifiées ?; if (Oui) then :**DGX Spark** ou **Mac Studio M3 Ultra**\nSeul cas où le hardware local est justifié\n(pas économiquement — politiquement); stop else (Non) :Retour au cloud : pas de besoin d’air-gap; stop endif endswitch @enduml</pre> </div> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2222%;"> <col style="width: 2.2232%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Critère</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ollama Free</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ollama Pro</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Cloud GPU H100</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">DGX Spark</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Inférence</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ Limitée</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ Confortable</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ Overkill</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">⚠️ Lent</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Fine-tuning</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ Imbattable</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">⚠️ Possible mais lent</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Coût annuel</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">$0</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">$200</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Variable (~$416-2 080*)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">$4 699 upfront</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Confidentialité</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">⚠️ Cloud US</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">⚠️ Cloud US</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">⚠️ Cloud US (variable)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ Totale</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Maintenance</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Aucune</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Aucune</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Setup unique</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Électricité, mises à jour</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Obsolescence</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Aucune</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Aucune</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Aucune</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">3-5 ans</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Écosystème logiciel</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tous modèles open</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tous modèles open</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tous modèles open</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">CUDA (mais lent)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Veridict</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Occasionnel</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Recommandé</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Pros/Recherche</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Air-gap uniquement</p></td> </tr> </tbody> </table> <div class="paragraph"> <p><em>*Variable selon volume de travail ; avec vitesse H100 ~10x > Spark, le coût effectif pour un workload donné est bas.</em></p> </div> </div> </div> <div class="sect1"> <h2 id="_le_cas_particulier_labonnement_pro_face_aux_modèles_chinois">Le Cas Particulier : L’Abonnement Pro Face aux Modèles Chinois</h2> <div class="sectionbody"> <div class="paragraph"> <p>Un point mérite d’être souligné : la combinaison <strong>Ollama Pro à $20/mois + modèles chinois open-source</strong> est probablement le meilleur rapport qualité/prix de l’histoire de l’IA grand public.</p> </div> <div class="sect2"> <h3 id="_pourquoi_les_modèles_chinois_changent_tout">Pourquoi les Modèles Chinois Changent Tout</h3> <div class="ulist"> <ul> <li> <p><strong>DeepSeek-V4-Pro</strong> : 1.6T params, CSA+HCA, 1M contexte, compétitif avec Claude 4 et GPT-5 pour le code</p> </li> <li> <p><strong>Qwen-3</strong> : 235B, 256K contexte, excellent en français et en raisonnement</p> </li> <li> <p><strong>GLM-5.1</strong> : 744B, MLA+DSA, 200K contexte, taillé pour l’agentique</p> </li> </ul> </div> <div class="paragraph"> <p>Tous disponibles sur Ollama. Tous open-source (licences permissives). Tous utilisables sans restriction via un abonnement à $20/mois.</p> </div> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="💡"></i> </td> <td class="content"> <div class="paragraph"> <p>Avec Ollama Pro, vous avez accès à ~5 modèles « frontier » open-source pour le prix d’un seul modèle fermé (Claude Pro). La valeur est tellement asymétrique que ça en devient presque absurde.</p> </div> </td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_ce_que_ça_veut_dire_pour_le_hardware">Ce Que Ça Veut Dire pour le Hardware</h3> <div class="paragraph"> <p>Si le meilleur rapport qualité/prix est un abonnement cloud à $20/mois, le hardware local devient un choix de <strong>confort</strong> ou de <strong>principe</strong> — pas un choix économique.</p> </div> <div class="paragraph"> <p>Un DGX Spark à $4 699, c’est l’équivalent de :</p> </div> <div class="ulist"> <ul> <li> <p>235 mois d’Ollama Pro</p> </li> <li> <p>23 jeux AAA jour de sortie</p> </li> <li> <p>4 MacBook Air M4</p> </li> <li> <p>Un an de loyer d’un T2 à Lyon</p> </li> </ul> </div> <div class="paragraph"> <p>Pour du calcul. Lent.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_et_huawei">Et Huawei ?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Puisque la question m’a été posée pendant mes recherches : non, Huawei ne commercialise pas d’équivalent au DGX Spark.</p> </div> <div class="paragraph"> <p>Ce qui existe :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Ascend 910C</strong> : 128 Go HBM, 800 TFLOPS FP16 — mais c’est une puce serveur, pas un desktop</p> </li> <li> <p><strong>Atlas 300I Duo</strong> : 96 Go LPDDR4X, carte PCIe à ~$1 400 — nécessite un hôte</p> </li> <li> <p><strong>Atlas 350</strong> : 112 Go HBM, 1.56 PFLOPS FP4 — accélérateur datacenter, pas un boîtier compact</p> </li> </ul> </div> <div class="paragraph"> <p>Huawei reste focalisé sur le marché des serveurs et des centres de données. Pour un boîtier compact « prêt à brancher » avec 120+ Go de VRAM, le DGX Spark (128 Go unifié) et le Mac Studio M3 Ultra (192 Go unifié) sont les seules options en 2026. Et pour l’instant, aucun constructeur chinois n’a annoncé de produit équivalent dans ce format.</p> </div> </div> </div> <div class="sect1"> <h2 id="_conclusion_le_luxe_de_la_proximité">Conclusion : Le Luxe de la Proximité</h2> <div class="sectionbody"> <div class="paragraph"> <p>Le DGX Spark n’est pas un mauvais produit. C’est un mauvais investissement pour 99% des acheteurs potentiels.</p> </div> <div id="diag-verdict" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title Le Paysage IA en 2026 — Qui Domine ? left to right direction package "Usage Personnel / PME" #C8E6C9 { rectangle "🏆 Ollama Pro\n$20/mois" as pro rectangle "Ollama Free\n$0/mois" as free rectangle "Cloud GPU spot\n$1-3/h" as spot } package "Usage Intensif / Pro" #FFF9C4 { rectangle "🏆 Ollama Max\n$100/mois" as max rectangle "🏆 Cloud GPU dédié\n$2-4/h" as dedicated rectangle "Modal / Together AI\nServerless" as serverless } package "Air-Gap Obligatoire" #FFCDD2 { rectangle "DGX Spark\n$4 699" as spark rectangle "Mac Studio M3U\n~$5 000" as mac } note bottom of spark 1% des cas d'usage — défense, santé réglementée, secrets industriels critiques end note @enduml</pre> </div> </div> <div class="paragraph"> <p><em><em>_ Acheter un DGX Spark en 2026, c’est comme acheter un serveur mail en 2010 : techniquement possible, philosophiquement satisfaisant, économiquement absurde pour un individu. </em>_</em></p> </div> <div class="paragraph"> <p>Le calcul est simple, et il ne ment pas :</p> </div> <div class="ulist"> <ul> <li> <p><strong>$0</strong> pour chatter avec DeepSeek sur Ollama Free</p> </li> <li> <p><strong>$200/an</strong> pour bosser sérieusement avec Ollama Pro</p> </li> <li> <p><strong>$5-9</strong> pour un fine-tune ponctuel sur cloud GPU</p> </li> <li> <p><strong>$4 699</strong> pour…​ l’expérience d’avoir un boîtier NVIDIA sur son bureau ?</p> </li> </ul> </div> <div class="paragraph"> <p>Le marché a tranché. Les abonnements cloud et les modèles open-source chinois ont gagné la bataille du prix. Le hardware local survit dans les niches réglementaires, pas dans les bureaux des développeurs.</p> </div> <div class="paragraph"> <p><em><em>_ Le DGX Spark n’est pas un outil rentable. C’est un statement. « Je veux mon IA chez moi, pas dans le cloud de quelqu’un d’autre. » C’est respectable. Mais en 2026, quand Ollama te donne DeepSeek-V4-Pro dans le cloud pour $20/mois, c’est surtout un statement qui coûte très cher. </em>_</em></p> </div> <hr> <div class="paragraph"> <p><strong>Cet article est issu d’une conversation avec mon agent IA sur la pertinence économique du DGX Spark, croisée avec une veille marché sur les prix cloud GPU (Vast.ai, RunPod), les grilles tarifaires Ollama/Claude, et l’écosystème des modèles chinois open-source. Les prix cités sont ceux de mai 2026 — ils auront probablement encore baissé quand vous lirez ces lignes.</strong></p> </div> </div> </div> https://cheroliv.com/blog/2026/0118_matrice_gouvernance_llm_zone_acces_workspace_post.html Mon, 4 May 2026 00:00:00 +0000 blog/2026/0118_matrice_gouvernance_llm_zone_acces_workspace_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_problem_prompt_engineering_je_pješčani_grad">Problem: Prompt Engineering je pješčani grad</a></li> <li><a href="#_moj_odgovor_matrica_44">Moj odgovor: matrica 4×4</a> <ul class="sectlevel2"> <li><a href="#_пет_зона_просторна_дименсија_опзп">Пет зона (Просторна дименсија — ОПЗП)</a></li> <li><a href="#_epistemološka_klasifikacija_druga_dimenzija">Epistemološka Klasifikacija (Druga Dimenzija)</a></li> </ul> </li> <li><a href="#_како_llm_консумира_ову_матрицу">Како LLM консумира ову матрицу</a></li> <li><a href="#_implementacija_tipirani_gradle_zadaci">Implementacija: Tipirani Gradle zadaci</a></li> <li><a href="#_zasto_je_to_manifest_ne_samo_spec">Zasto je to manifest, ne samo spec</a></li> <li><a href="#_пуна_каскада_od_brain_dump_do_članka_na_blogu">Пуна каскада — od Brain Dump do članka na blogu</a></li> <li><a href="#_zaprotiv">Za/Protiv</a></li> <li><a href="#_zaključak_poredajte_svoje_fajlove_a_ne_svoje_podsetnike">Zaključak: Poredajte svoje fajlove, a ne svoje podsetnike</a></li> <li><a href="#_reference">Reference</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 14 minutes</div> <p>За месеце сам стакао правила управљања агентом. Датотеке EAGER, чеклисте LAZY, протоколи завршетка сесије у шест корака. Ipak, jedno pitanje je ostalo otvoreno : <strong>kako LLM zna šta je има право да прави са датотеком ?</strong></p> </div> <div class="paragraph"> <p>Odgovor nije u promptu. On je u sistemu datoteka.</p> </div> <div class="paragraph"> <p>Evo specifikacije arhitekture koja čini odgovor korisnim — la <strong>матрица управљања LLM</strong>.</p> </div> </div> </div> <div class="sect1"> <h2 id="_problem_prompt_engineering_je_pješčani_grad">Problem: Prompt Engineering je pješčani grad</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kada se fajl da LLM-u, daje mu sve. Sadržaj, da — ali i nedostatak zaštitnih barijera. LLM ne zna da li ovaj fajl sadrži jedna tajna, jedno spekulativno mišljenje, ili zatvorenog koda. On će ga indeksirati, sažeti ga, citirati ga, mešati ga sa drugim podacima — i potencijalno da ga objavi u javnom embeddingu ili u odgovoru korisnika.</p> </div> <div class="paragraph"> <p>Klasična parada, to je prompt :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">"Tu es un assistant sécurisé. Ne divulgue jamais d'informations confidentielles. Si tu détectes un secret, ignore-le. Si tu détectes une opinion, ne la répète pas."</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj prompt ima tri problema:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Ovisi o dobroj volji LLM-a.</strong> Model dovoljno veliki za</p> </li> </ol> </div> <div class="paragraph"> <p>Решавање комплексних багова је довољно велико да се обђе наредба. bezbednosti utopene u 200k tokenima konteksta</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>On je kontekstualni, ne strukturalni. Promenite prompt, promenite LLM,</p> </li> </ol> </div> <div class="paragraph"> <p>Promenite sesiju — i pravilo nestaje.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Ne skaluje.</strong> Svaki novi tip fajla, svaki novi nivo</p> </li> </ol> </div> <div class="paragraph"> <p>Политика приватности захтева нову клаузулу. Ваш промпт стане један. regulatorni tekst koji nitko ne čita u celosti.</p> </div> <div class="admonitionblock caution"> <table> <tr> <td class="icon"> <i class="fa icon-caution" title="🔒"></i> </td> <td class="content"> <div class="paragraph"> <p>Bezbednost sistema ne sme nikada da zavisi od uputstva koje Може да заборави, облазати или не учитати. Она мора да зависи од prepreku koju ne možeš da predješ bez da to eksplicitno želiš.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_moj_odgovor_matrica_44">Moj odgovor: matrica 4×4</h2> <div class="sectionbody"> <div class="paragraph"> <p>Решење које сам имплементирала у мојем workspacu је <strong>матрица зона × право приступа LLM</strong>. Она не тражи од LLM-а да буде опрезан. Она прави strukturalno nemoguća neoprezljivost.</p> </div> <div id="diag-matrix-overview" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam wrapWidth 220 title Matrica LLM upravljanja — Zona × Pravo pristupa package "Radni prostor" { rectangle "КОРЕН (Круг 0) ━━━━━━ Brain dump Слободна мисао [ЗАБРАНЕНО LLM]" as Z0 #FFB3B3 rectangle "configuration/\n(Krug 1)\n━━━━━━\nTajni, tokeni\nPrivatna infrastruktura\n[ZABRANJENO LLM]" as Z1 #FFB3B3 rectangle "office/ (Krug 2) ━━━━━━ Urednički podaci Članci, okviri [FILTRIRANO Vizija]" as Z2 #FFF3B3 rectangle "foundry/private/ (Krug 3) ━━━━━━ Zatvoreni izvorni kod [DATASET PRIVATNO]" as Z3 #B3D9FF rectangle "foundry/public/ (Krug 3) ━━━━━━ Otvoreni kod Apache 2.0 [BESPLATAN PRISTUP]" as Z4 #B3FFB3 } Z0 -[hidden]-> Z1 Z1 -[hidden]-> Z2 Z2 -[hidden]-> Z3 Z3 -[hidden]-> Z4 @enduml</pre> </div> </div> <div class="sect2"> <h3 id="_пет_зона_просторна_дименсија_опзп">Пет зона (Просторна дименсија — ОПЗП)</h3> <div class="paragraph"> <p>Svaki prostor radnog prostora ima nivo RGPD koji određuje <strong>gdje</strong> datoteka može биће перенаправљен :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1666%;"> <col style="width: 4.1682%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Zona</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Nivo GDPR</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Sadržaj</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Јавно право приступа RAG</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">koren</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">0 — intimno</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ispraznjenja mozga, razgovori LLM</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>ZABRANJENO</strong>— nikada indeksiran</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>configuration/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">1 — Ограничен власник</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">тајни, токени, API ключеви</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>ZABRANJENO</strong>— nikad indeksiran</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>office/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2 — Ограничен сарадњив</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">urednički podaci, okadranje, obuke</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>filtrirano</strong>— Само виђење</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>foundry/private/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">3 — Условно отворен</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Zatvoren izvorni kod, SaaS nije javno</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>ZABRANJENO</strong>— ekskluzivno privatni dataset</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>foundry/public/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">4 — родна публика</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Код Apache 2.0, objavljeni plugini</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>СЛОБОДАН</strong>— kompletna indeksacija</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Pravilo je jednostavno: <strong>putanja fajla određuje šta LLM može da uradi sa njim.</strong> Nema metapodataka za održavanje, nema taga za dodavanje u frontmatter, Нема ручне класификације на сваком коммиту. Файл је у`OSS/<code>? Је javno. Је у`configuration/</code>? Он је недодирљив.</p> </div> </div> <div class="sect2"> <h3 id="_epistemološka_klasifikacija_druga_dimenzija">Epistemološka Klasifikacija (Druga Dimenzija)</h3> <div class="paragraph"> <p>Prostorna dimenzija kaže <strong>gde</strong> da se usmeri. Ali postoji druga osa, pravoupragla: <strong>quoi</strong> router. Neke datoteke u ovlašćenoј zonі sadrže informacije Ne smeju se razrediti takve kakve su</p> </div> <div id="diag-epistemic-filter" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam wrapWidth 240 title Dvostruka kaskada — Prostorni filter + Epistemološki filter start :Le LLM rencontre un fichier; if (Zone physique ?) then (Cercle 0-1) :ACCÈS BLOQUÉ\n(secret, brain dump); stop elseif (Zone CSS/) :DROIT D'ACCÈS PRIVÉ\n→ dataset fine-tuning; :Filtre épistémique\nVision/Opinion; if (Classification ?) then (VISION) :Dataset privé\n→ entraînement autorisé; else (OPINION) :CONFINÉ\n→ pas d'entraînement; endif elseif (Zone office/) :DROIT D'ACCÈS FILTRÉ\n→ accès conditionnel; :Filtre épistémique\nVision/Opinion/Stratégie; if (Classification ?) then (VISION) :DILUTION COMPLÈTE\n→ docs racine + blog; elseif (STRATÉGIE) :DILUTION RESTREINTE\n→ docs racine seulement; else (OPINION) :CONFINEMENT\n→ office/ uniquement; endif else (Zone OSS/) :ACCÈS LIBRE\n→ indexation complète; endif stop @enduml</pre> </div> </div> <div class="paragraph"> <p>Епистемолошка табела класификације, урезана у Правило 2бис моје управљање агент :</p> </div> <div class="paragraph"> <p>| Status | Definicija | Signal LLM | Odredište | | ВИЗИОН | Стабилизована архитектура, тестован патерн | Декларативни језик, референце сеанса/тестова | Пуна дилуција + блог | | Стратегија | Позиционирање бизнис, ценообразование | Речник пазар, конкуренција | Само коренски документи | | spekulacija, nevalidirana hipoteza | hipotetski jezik, intuicija | zatvorenje krug 0 |</p> </div> <div class="paragraph"> <p>Kombinacija dva dimenzija — fizička zona × epistemološka klasifikacija — oblikuj<strong>kompletna matrica</strong>:</p> </div> <div id="diag-full-matrix" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE title Potpuna matrica — Zona × Klasifikacija salt { {T + Zone | VISION | STRATÉGIE | OPINION + Racine (0) | ✗ Interdit | ✗ Interdit | ✗ Interdit + configuration/ (1) | ✗ Interdit | ✗ Interdit | ✗ Interdit + office/ (2) | ✓ Docs + Blog | ✓ Docs seulement | ✗ Confiné + CSS/ (3) | ✓ Dataset privé | ✓ Dataset privé | ✗ Confiné + OSS/ (4) | ✓ Public libre | ✓ Public libre | ✓ Public libre } } @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_како_llm_консумира_ову_матрицу">Како LLM консумира ову матрицу</h2> <div class="sectionbody"> <div class="paragraph"> <p>Matrica nije dokument koji LLM čita. To je <strong>ograničenje implicite</strong> zakodirano u kompozitnom kontekstnom vektoru (EPIC 9 — u toku implementacije).</p> </div> <div class="paragraph"> <p>Ево шта LLM прихвата у каждој сессии :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">VECTEUR COMPOSITE DE CONTEXTE ├── RAG pgvector → OSS/ + office/Vision │ (similarité sémantique sur contenu publiable) ├── Knowledge Graph graphify → OSS/ │ (relations exactes entre artéfacts publics) ├── Knowledge Graph privé → CSS/ │ (relations entre code closed source — jamais exporté) ├── Métadonnées de zone → chaque fichier taggé par zone physique │ (le LLM sait s'il est dans office/ ou OSS/) └── Historique des décisions → WORKSPACE_VISION.adoc (contexte temporel des arbitrages)</code></pre> </div> </div> <div class="paragraph"> <p>Conkretno, kad mi LLM kaže:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">Je vais indexer le contenu de edster/ pour enrichir le knowledge graph...</code></pre> </div> </div> <div class="paragraph"> <p>Metadatak zone odgovara upravo pre nego što LLM završi svoju rečenicu: <code>edster/`je u`CSS/</code>, nivo 3 →<strong>Zabranjen pristup javnom knowledge graph-u.</strong> RAG ga ne vidi. Graf ga ne dodiruje. Odgovor korisnika ne On ne cita ga.</p> </div> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="💡"></i> </td> <td class="content"> <div class="paragraph"> <p>Prostorna ontologija funkcioniše kao<strong>Unix dozvola</strong>za LLM. Ne zahtevate od procesa da bude pažljiv sa`/etc/shadow`— Odbijate mu pristup za čitanje. Isti princip.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_implementacija_tipirani_gradle_zadaci">Implementacija: Tipirani Gradle zadaci</h2> <div class="sectionbody"> <div class="paragraph"> <p>Matrica nije filozofija. To je kod. Evo ugovora za zadatak. Gradle koji ga implementuje :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">abstract class ZoneAwareIndexer @Inject constructor( private val rootDir: DirectoryProperty, private val configServer: ConfigServerProperty // → configuration/ ) : DefaultTask() { @Input val zoneFilter: SetProperty<Zone> = project.objects.setProperty(Zone::class.java) @OutputFile val ragIndex: RegularFileProperty = project.objects.fileProperty() @TaskAction fun index() { val allowedPaths = zoneFilter.get().flatMap { it.resolve(rootDir.get()) } val forbiddenPaths = Zone.RESTRICTED.resolve(rootDir.get()) + Zone.INTIMATE.resolve(rootDir.get()) // Le RAG ne voit jamais configuration/ ni la racine // CSS/ alimente un index privé, pas celui-ci // office/ est filtré par le classifieur Vision/Opinion } } enum class Zone { INTIMATE, // Cercle 0 — racine RESTRICTED, // Cercle 1 — configuration/ EDITORIAL, // Cercle 2 — office/ CLOSED_SOURCE, // Cercle 3 — foundry/private/ OPEN_SOURCE // Cercle 3 — foundry/public/ }</code></pre> </div> </div> <div class="paragraph"> <p>Zadatak je <strong>testable</strong>. Možete napisati test koji proverava :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `le RAG n'indexe jamais configuration`() { val index = ZoneAwareIndexer(rootDir, configServer) index.zoneFilter.set(setOf(Zone.OPEN_SOURCE, Zone.EDITORIAL)) index.index() assertThat(index.ragIndex).doesNotContain("configuration/") } @Test fun `le code closed source est exclu du RAG public`() { val index = ZoneAwareIndexer(rootDir, configServer) index.zoneFilter.set(setOf(Zone.OPEN_SOURCE)) // OSS only assertThat(index.ragIndex).doesNotContain("edster") }</code></pre> </div> </div> <div class="paragraph"> <p>380 testa, 380 PROŠLO. Kao i za plantuml-gradle — bezbednost je testirana, неочекивана.</p> </div> </div> </div> <div class="sect1"> <h2 id="_zasto_je_to_manifest_ne_samo_spec">Zasto je to manifest, ne samo spec</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovaj dokument je specifikacija arhitekture jer definiše:</p> </div> <div class="ulist"> <ul> <li> <p>неких<strong>dimenzije</strong>(spatijalna, epistemološka)</p> </li> <li> <p>неких<strong>deterministička pravila</strong>(zona → pravo pristupa)</p> </li> <li> <p>Un <strong>ugovor o zadatku</strong>(Gradle tipisan, testabilan)</p> </li> <li> <p>jedna<strong>referentna implementacija</strong>(moj radni prostor)</p> </li> </ul> </div> <div class="paragraph"> <p>Ali je i jedan<strong>манифест</strong>Jer zauzima stav na debati široče: <strong>kako kontrolisati pristup LLM-a podacima?</strong></p> </div> <div class="paragraph"> <p>Odgovor industrije je prompt engineering + guardrails<br> Post-hoc klasifikatori. Moj odgovor je: <strong>povežite svoje fajlove u dobri direktorijumi.</strong> Ostalo je automatsko.</p> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p>„Ovaj manifests ne kaže da LLM-ovi moraju biti usklađeni.“ On kaže: „uskladenost“ Jedan veliki jezični model na vašim pravilima bezbednosti je posledica vašeg sistema fajlovi, ne vaš prompt.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_пуна_каскада_od_brain_dump_do_članka_na_blogu">Пуна каскада — od Brain Dump do članka na blogu</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bismo ilustrovali kompletni ciklus, ovo je kako se ova ideja o matrici pojavila и је разредена :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">Session 4 mai 2026 — Feedback global du workspace │ ├→ Le LLM identifie : "la dualité public/privé est invisible" │ → Classifié VISION (constat architectural vérifiable) │ ├→ PICTURE_ME_ROLLIN_MATRICE_4X4.adoc — STIMULUS (Cercle 0) │ → Brain dump structuré, classification VISION confirmée │ ├→ DILUTION → WORKSPACE_AS_PRODUCT.adoc (section Matrice 4×4) │ → La spec vit dans les documents racine │ ├→ DILUTION → WORKSPACE_ORGANIZATION.adoc (OSS/CSS) │ → La granularisation est documentée │ └→ ARTICLE 0117 (ce document) → cheroliv.com → La VISION est publiée</code></pre> </div> </div> <div class="paragraph"> <p>Šta je započelo kao primetnja tokom sesiji ( « hej, RAG ne zna que edster je zatvorenog koda") je postalo specifikacija arhitekture Objavljena u manje od jedne sesije. To je pattern STIMULUS u akciji.</p> </div> </div> </div> <div class="sect1"> <h2 id="_zaprotiv">Za/Protiv</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Ovaj pristup (Prostorna ontologija + Matrica)</th> <th class="tableblock halign-left valign-top">Klasičan pristup (Prompt + Guardrails)</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Mekanika</strong> — sistem datoteka blokira pristup, ne LLM</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Deklarativna</strong> — poruka traži od LLM da bude oprezan</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Testable</strong> — ugovor Gradle zadatka je proveren 380+ testovima</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ne testabilno</strong> — "Da li je LLM poštovao pravilo?" je otvoreno pitanje</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Neovisna od LLM</strong> — promenite model, folderi ostaju</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Зависна од LLM</strong> — сваки модел интерпретира промпт на свој начин</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Skalabilno</strong> — novi tip podataka = novi folder, nula promena koda</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ne skalabilno</strong> — novi tip podataka = nova klauzula prompta, novi rizik regresije</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Auditable</strong> — sistem fajlova je evidencija audita</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Non auditable</strong> — prompt nema istoriju, nema razlike, nema krivice</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ograničenje</strong> : zahteva početnu organizacionu disciplinu</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ограничење</strong> : захтева дисциплину писања промпта у каждој сеанси</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_zaključak_poredajte_svoje_fajlove_a_ne_svoje_podsetnike">Zaključak: Poredajte svoje fajlove, a ne svoje podsetnike</h2> <div class="sectionbody"> <div class="paragraph"> <p>Matrica upravljanja LLM koju sam upravo opisao nije proizvod. To je<strong>спецификација архитектуре</strong>— и то је за то што је objavljiv.</p> </div> <div class="paragraph"> <p>Čime je čvrsta jeste što ne zahteva ništa od LLM-a. Ona ne mu Не поверава. Она не почива на свом улаганију, са разумењу. Zavisí od francuskog jezika, ili njene dobre volje. Osniva se na sistemu fajrova — najniži sloj, najstabilniji, najtestiraniji ceo stek.</p> </div> <div class="paragraph"> <p>Kada kažem svom LLM "možeš sve indeksirati u`OSS/<code>, ništa u `configuration/</code>, et `office/`samo ako je klasifikovano kao Vision" — Ovo nije instrukcija. To je <strong>filtre</strong> — implementirano u Kotlinu, проверено 380 тестовима, извршено пре него што LLM види податке</p> </div> <div class="paragraph"> <p>Ovo je razlika između da nekom kažete 'Ne gledaj u ovaj sanduk'. i zatvoriti ključni šupljak. Agent upravljanja koji gradim od Meseci su ključ. Matrica je plan namještaja.</p> </div> </div> </div> <div class="sect1"> <h2 id="_reference">Reference</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="0116_compartimentage_epistemique_automatise_llm_post.html">Članak 0116 — Automatizovana epistemološka kompartimentacija</a></p> </li> <li> <p><a href="0114_gouvernance_cercles_confiance_ontologie_spatiale_alignement_llm_post.html">Article 0114 — Кругови доверје и просторна онтологија</a></p> </li> <li> <p><a href="0108_gouvernance_agent_opencode_eager_lazy_post.html">Članak 0108 — Upravljanje AI Agentom sa AsciiDoc-om</a></p> </li> <li> <p><a href="../2026/0115_anonymiseur_dataset_mvp0_realite_augmentee_llm_post.html">Članak 0115 — Anonimizator MVP0</a></p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0117_granularisation_oss_css_repositorie_workspace_post.html Sun, 3 May 2026 00:00:00 +0000 blog/2026/0117_granularisation_oss_css_repositorie_workspace_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_незгода_која_је_чекала_да_се_десни">Незгода која је чекала да се десни</a> <ul class="sectlevel2"> <li><a href="#_право_питање">Право питање</a></li> </ul> </li> <li><a href="#_rešenje_oss_i_css">Rešenje: OSS/ i CSS/</a></li> <li><a href="#_zašto_oss_i_css_a_ne_javno_i_privatno">Zašto "OSS" i "CSS" a ne "javno" i "privatno</a> <ul class="sectlevel2"> <li><a href="#_потпуно_дрво_четири_зоне_не_три">Потпуно дрво — четири зоне, не три</a></li> </ul> </li> <li><a href="#_poseban_slučaj_cheroliv_com">Poseban slučaj : cheroliv.com</a> <ul class="sectlevel2"> <li><a href="#_bakery_gradle_se_ne_brine">bakery-gradle se ne brine</a></li> </ul> </li> <li><a href="#_утицај_на_агент_управљања">Утицај на Агент управљања</a></li> <li><a href="#_što_dobijamo_i_što_gubimo">Što dobijamo (i što gubimo)</a></li> <li><a href="#_conclusion_fizički_signal_pobeđuje_logički_signal">Conclusion: Fizički signal pobeđuje logički signal</a></li> <li><a href="#_reference">Reference</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja: 10 minutes</div> <p><code>foundry/</code>— funkcionalna zona koja hostuje kod mog radnog prostora — Sadrži 18 projekata. Osam su open source pod Apache 2.0. Jedno je closed source — SaaS Edster. Mesecima, ovih devet projekata nije se sukobalo. у истом фасциклу, раздвојени само…​ ништа. њихов јавни/приватни статус Bila je informacija u mojoj glavi, ne u sistemu fajlova.</p> </div> <div class="paragraph"> <p>И онда желех да увезам RAG. И онде, све је рушило.</p> </div> </div> </div> <div class="sect1"> <h2 id="_незгода_која_је_чекала_да_се_десни">Незгода која је чекала да се десни</h2> <div class="sectionbody"> <div class="paragraph"> <p>У april 2026, почео да имплементујем RAG pgvector за slider-gradle. Princip: indeksirati sve depozitorije`foundry/<code>, производити неких embeddings, da ih ubačimo u kontekst LLM-a da bi imao perception" akta`foundry/</code>.</p> </div> <div class="paragraph"> <p>Cevovod je bio jednostavan:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val repos = fileTree(rootDir) { include("**/*.adoc", "**/*.kts", "**/*.kt", "**/*.json", "**/*.yml") } val chunks = repos.map { chunk(it) } val embeddings = chunks.map { embed(it) } pgvector.insert(embeddings)</code></pre> </div> </div> <div class="paragraph"> <p>Jednostavno. Efikasno. I<strong>опасан</strong>.</p> </div> <div class="paragraph"> <p>Пошто ова`fileTree`не прави разлику између`plantuml-gradle/` (Apache 2.0, javno) i`edster/`(closed source, private). On sve požera. Ako jednom objavim ove embedde — na dashboard-u, u odgovoru LLM u datasetu za treniranje — vlasnički kod Edster izlješće.</p> </div> <div class="admonitionblock caution"> <table> <tr> <td class="icon"> <i class="fa icon-caution" title="🔒"></i> </td> <td class="content"> <div class="paragraph"> <p>Problem nije u tome da LLM čita zatvorenog izvornog koda. Problem, To je da ovaj kod završi u vektorskom embeddingu <strong>public</strong> — необратно, необрисливо, неаудитуемо.</p> </div> </td> </tr> </table> </div> <div class="sect2"> <h3 id="_право_питање">Право питање</h3> <div class="paragraph"> <p>Ovo nije "kak sprečiti LLM da izlije kod?". To je "kak Направити побег структурно nemoguћ?</p> </div> <div class="paragraph"> <p>Odgovor nije prompt. Odgovor je da se fascikla podeli na dva dela.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_rešenje_oss_i_css">Rešenje: OSS/ i CSS/</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pre :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">foundry/ ├── plantuml-gradle/ ← public ├── bakery-gradle/ ← public ├── magic-stick/ ← public ├── edster/ ← PRIVÉ ├── slider-gradle/ ← public └── ... ← mélange invisible</code></pre> </div> </div> <div class="paragraph"> <p>Posle :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">foundry/ ├── OSS/ ← tout est Apache 2.0 │ ├── plantuml-gradle/ │ ├── bakery-gradle/ │ ├── magic-stick/ │ ├── slider-gradle/ │ └── ... └── CSS/ ← tout est closed source / private └── edster/</code></pre> </div> </div> <div class="paragraph"> <p>Le `fileTree`постаје :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val ossRepos = fileTree(File(rootDir, "OSS")) { include("**/*.adoc", "**/*.kts", "**/*.kt", "**/*.json", "**/*.yml") } val cssRepos = fileTree(File(rootDir, "CSS")) { include("**/*.adoc", "**/*.kts", "**/*.kt", "**/*.json", "**/*.yml") } // Embeddings publics — OSS seulement pgvectorPublic.insert(ossRepos.map { chunk(it) }.map { embed(it) }) // Dataset fine-tuning privé — CSS seulement fineTuningDataset.insert(cssRepos.map { chunk(it) }) // jamais publié</code></pre> </div> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p>Javni RAG nikad ne vidi`CSS/`. Zatvoreni kod pokreće skup podataka bez finetuniranja — unutrašnji model koji nikada ne napušta moj dom. La razdvajnje je mehaničko, ne deklarativno.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_oss_i_css_a_ne_javno_i_privatno">Zašto "OSS" i "CSS" a ne "javno" i "privatno</h2> <div class="sectionbody"> <div class="paragraph"> <p>Izbor akronima OSS (Open Source Software) i CSS (Closed Source Software) Намерно:</p> </div> <div class="ulist"> <ul> <li> <p>Public"/"Private" opisuje<strong>vidljivost</strong>(šta GitHub vidi)</p> </li> <li> <p>OSS"/"CSS" opisuje<strong>приroda</strong>koda (što LLM mora da zna)</p> </li> </ul> </div> <div class="paragraph"> <p>GitHub vidljivost je metapodatak udaljenog repozitorijuma. Priroda koda je svojstvo sadržaja. LLM nema pristup GitHub API — ali ima pristup sistemu datoteka.<code>CSS/`Mu je rekao "Pažnja, ovaj kod nije pod licencom slobodno" bez potrebe da pročitate`LICENSE`ili da se parsira jedan`package.json</code>.</p> </div> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="💡"></i> </td> <td class="content"> <div class="paragraph"> <p>Naziv fascikle je najjači metapodatak koji možete da mu date jedan LLM. Ne može biti loše parsirana, ignorisana ili loše interpretirana. LLM vidi`CSS/edster/`у путању фајла — оно зна.</p> </div> </td> </tr> </table> </div> <div class="sect2"> <h3 id="_потпуно_дрво_четири_зоне_не_три">Потпуно дрво — четири зоне, не три</h3> <div class="paragraph"> <p>Granularizacija OSS/CSS dopunjuje ontologiju sa tri zona. Zona `foundry/`прелази од 1 до 2 функционалних подзона:</p> </div> <div id="diag-four-zone-workspace" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam wrapWidth 260 title Organizacija foundry/ — Granularizacija OSS/CSS package "foundry/" { package "Круг 0 — Корен" #FFCCCC { rectangle "PICTURE_ME_ROLLIN_*.adoc" as STIM rectangle "WORKSPACE_*.adoc" as VISION_DOC note right of STIM Brain dump libre Jamais versionné [LLM : interdit d'indexer] end note } package "Круг 1 — конфигурација/" #FFD9CC { rectangle "Tajni, tokeni" as SECRETS rectangle "Spring Cloud Config" as SCC note right of SECRETS Privé-CVS, solo access [LLM : INTERDIT] end note } package "Круг 2 — office/" #FFFFCC { rectangle "Статьи, кадрирања" as DATA rectangle "Formacije, SPG/SPD" as FORM note right of DATA Privé-CVS [LLM : filtré Vision/Opinion] end note } package "Круг 3 — ливаonica/" #CCE5FF { package "OSS/ — Apache 2.0" #CCFFCC { rectangle "Gradle pluginovi" as PLUGINS rectangle "motor" as ENGINE } package "CSS/ — zatvoreni kod" #CCDDFF { rectangle "edster/" as EDSTER } } } @enduml</pre> </div> </div> <div class="paragraph"> <p>| Zona | GDPR | Indeksiranje RAG javno | Podatak skup finetuniranje | | Koren | Nivo 0 — Intimno | ✗ | ✗ | | <code>configuration/</code>| Nivo 1 — Ograničen | ✗ | ✗ | | <code>office/</code>| Nivo 2 — saradnji | ✓ Filtrirano | ✓ Filtrirano | | <code>foundry/private/</code>| Nivo 3 — Uslovljeno otvoreno | ✗ | ✓ Privatno | | <code>foundry/public/</code>| Nivo 4 — Natavna publikacija | ✓ Slobodno | ✓ Javno |</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_poseban_slučaj_cheroliv_com">Poseban slučaj : cheroliv.com</h2> <div class="sectionbody"> <div class="paragraph"> <p>Док сам тамо био, исправио сам другу неконсистентност. Мој сајт <code>cheroliv.com`живео у`foundry/`kao softverski projekat potpun — sa sopstveni Gradle build, sopstvena CI, sopstvena управљање</code>.agents/`.</p> </div> <div class="paragraph"> <p>Ali blog postovi nisu kod. Oni su <strong>podaci</strong> uredničke** Cercle 2 — na isti način kao okviranja`office/pilotage/` ili formacije`office/formations/`.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">AVANT APRÈS foundry/ office/ cheroliv.com/ sites/ site/jbake/content/blog/ cheroliv.com/ 2026/0117_....adoc 2026/0117_....adoc</code></pre> </div> </div> <div class="paragraph"> <p>Šta se menja:</p> </div> <div class="ulist"> <ul> <li> <p>Članci su u`office/`→ privatnost Krug 2</p> </li> <li> <p>Задатак`publishSite`postaje jedna sposobnost za`engine`</p> </li> </ul> </div> <div class="paragraph"> <p>preko`bakery-gradle`— плагин прима један`FileTree`, он не зна da članci potiču iz`office/`</p> </div> <div class="ulist"> <ul> <li> <p>Jedna CI, jedno upravljanje — nula dupliciranja</p> </li> <li> <p>Klasifikator Videnje/Mišljenje (Pravilo 2bis) se primenjuje automatski :</p> </li> </ul> </div> <div class="paragraph"> <p>članci u`office/`Филтрирају се пре публикације</p> </div> <div class="sect2"> <h3 id="_bakery_gradle_se_ne_brine">bakery-gradle se ne brine</h3> <div class="paragraph"> <p>I to je lepo. Plugin`bakery-gradle`nije promenjen. Prima direktorijum sadržaja AsciiDoc, generiše HTML, pushuje на GitHub Pages. Как се ова директория зове`site/jbake/content/` ou <code>office/sites/cheroliv/</code>— plugin se ne brine.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// engine/build.gradle.kts task("publishBlog") { doLast { val articles = fileTree("../../office/sites/cheroliv/2026/") bakery.generate(articles) // ← bakery ne sait pas d'où ça vient } }</code></pre> </div> </div> <div class="paragraph"> <p>Ugovor o interfejsu je Gradle zadatak. Nije REST API. Nije webhook. Jedna zadatak — tipovan, testiran, izvršavan lokalno i u CI.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_утицај_на_агент_управљања">Утицај на Агент управљања</h2> <div class="sectionbody"> <div class="paragraph"> <p>Granulacija OSS/CSS izmenjuje upravljanje agenta na tri tačke:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>RAG javni</strong> : opseg indeksiranja prelazi sa`foundry/**`</p> </li> </ol> </div> <div class="paragraph"> <p>à <code>foundry/public/<strong></code>+<code>office/Vision/</strong></code>. Zatvoreni izvorni kod Izuzet je iz indeksa po konfiguraciji zadatka, a ne po promptu.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Knowledge Graph</strong> : graphify-gradle proizvodi dva grafa :</p> </li> </ol> </div> <div class="paragraph"> <p>*<code>office/graph.json</code>(javno) — odnosi između artefakata OSS + kontor/Vizija * <code>configuration/graph_private.json</code>(gitignored, privé) — odnosi između artefakti CSS, nikad objavljen</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>fin podešavanje dataseta</strong> :`codebase-gradle`сада има два извора :</p> </li> </ol> </div> <div class="paragraph"> <p>*<code>OSS/</code>→ javni skupovi podataka (komunitetski modeli, benchmarks) (empty)<code>CSS/</code>→ приватни скупови података (унутрешњи модел, сопствен fine-tuning)</p> </div> </div> </div> <div class="sect1"> <h2 id="_što_dobijamo_i_što_gubimo">Što dobijamo (i što gubimo)</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1436%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Pre (ravna datoteka)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">После (OSS/CSS + office/sites)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>ls foundry/</code>→ јавно-приватна мешавина</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>ls foundry/public/</code>→ sve je objavljivo</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">RAG indeksira sve bez diskriminacije</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">RAG indeksira`OSS/`+`office/Vision`искључиво</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Nemoguće je da se zna da li je projekat otvorenog koda</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Put`OSS/` ou `CSS/`речено</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">cheroliv.com ima svoj CI i svoju vlastitu upravu</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">CI i upravljanje su zajedničke u engine</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Blog postovi se nalaze u skladištu "code".</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Blog članci su u`office/sites/`— podaci, nije kod</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Rizik izbegavanja zatvorenog koda u javnim embedding-ima</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Структурно невозможно —`CSS/`izvan scope RAG</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Jedini trošak: jedan`git mv`global na 17 OSS repozitorijuma + jedan refaktorisanje du <code>build.gradle.kts</code> de <code>engine</code>. Ово је хладна миграција — Nema podataka u tranzitu, nema zakoristenih korisnika.</p> </div> </div> </div> <div class="sect1"> <h2 id="_conclusion_fizički_signal_pobeđuje_logički_signal">Conclusion: Fizički signal pobeđuje logički signal</h2> <div class="sectionbody"> <div class="paragraph"> <p>Šta sam uradio ove popodne je da zamenim nevidljivu konvenciju podelom vidljivom u zoni`foundry/<code>. Prethodno, morali ste <strong>знати</strong> да`edster/`bio je closed source. Sada, ga <strong>vidite</strong> — Direktorijum se zove`CSS/</code>.</p> </div> <div class="paragraph"> <p>To je isti princip kao Unix dozvole, mrežni VLAN-ovi ili ognjoodržni odeljci u bazi podataka. Bezbednost ne sme biti jedna informaciju kojo trebate da zapamtite. Ona mora da diventare jedno svojstvo. <strong>физика</strong>sistema.</p> </div> <div class="paragraph"> <p>Грануларзација OSS/CSS је превод овог принципа у домену о управљању LLM. LLM не мора да зна да је Edстер конфиденцијално. Му је потребно да буде неспособан да индексира то.</p> </div> <div class="paragraph"> <p>И то је тачно оно што`CSS/`гарантује.</p> </div> </div> </div> <div class="sect1"> <h2 id="_reference">Reference</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="0118_matrice_gouvernance_llm_zone_acces_workspace_post.html">Članak 0117 — Matrica LLM upravljanja</a></p> </li> <li> <p><a href="0114_gouvernance_cercles_confiance_ontologie_spatiale_alignement_llm_post.html">Article 0114 — Кругови poverenja</a></p> </li> <li> <p>Члан 0116 — Аутоматизовано епистемолошко подељење</p> </li> <li> <p><a href="0108_gouvernance_agent_opencode_eager_lazy_post.html">Article 0108 — Upravljati AI agentom pomoću AsciiDoc</a></p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0116_compartimentage_epistemique_automatise_llm_post.html Sat, 2 May 2026 00:00:00 +0000 blog/2026/0116_compartimentage_epistemique_automatise_llm_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_problem_slobodno_misliti_bez_objavljivanja_bilo_čega">Problem: Slobodno misliti bez objavljivanja bilo čega</a></li> <li><a href="#_oblik_stimulus_roditi_se_fiksirati_razrijedití_umreti">Oblik STIMULUS — Roditi se, fiksirati, razrijedití, umreti</a></li> <li><a href="#_делегација_за_llm_зашто_је_llm_он_који_филтрира">Делегација за LLM : Зашто је LLM он који филтрира</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 10 minutes</div> <p>Moj LLM ne zadovoljava se samo izvršavanjem mojih Gradle zadataka. On je čuvar granice između moje privatne misli i javnog izraza. Svaka ideja se klasifikuje — Vizija, Mnenje, Strategija — pre nego što se rutira. Ova automatizovana epistemska kompartimentalizacija čuva moj mentalni vrt bez da me umući.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">tik</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_problem_slobodno_misliti_bez_objavljivanja_bilo_čega">Problem: Slobodno misliti bez objavljivanja bilo čega</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kada solo programer dokumentira svoj proces mišljenja sa LLM-om, suočava se s paradoksom:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">CAPTURE TOUT (Cercle 0, jardin secret) ├→ Brain dump libre, pas de censure ├→ Idées brutes, spéculations, intuitions non vérifiées ├→ Allers-retours LLM : challenger, itérer, raffiner └→ Le LLM voit TOUT — le bon, le flou, l'embryonnaire PUBLICATION SÉLECTIVE (Cercle 4, blog public) ├→ Uniquement les décisions actées ├→ Uniquement les patterns testés (>100 tests PASS) ├→ Uniquement ce qui a de la valeur pour le lecteur └→ JAMAIS une spéculation présentée comme une vérité</code></pre> </div> </div> <div class="paragraph"> <p>Između ova dva ekstremuma, ima jedan<strong>filter</strong>. Питање је: ко то прави? Уморан човек на крају сесије? Наивни скрипт реgex? Или сам LLM, који је већ прочитао све?</p> </div> <div class="paragraph"> <p>Moj odgovor : LLM.</p> </div> </div> </div> <div class="sect1"> <h2 id="_oblik_stimulus_roditi_se_fiksirati_razrijedití_umreti">Oblik STIMULUS — Roditi se, fiksirati, razrijedití, umreti</h2> <div class="sectionbody"> <div class="paragraph"> <p>STIMULUS je fajl`.adoc`привремени у корени радног простора (Круг 0). Његов назив следи evokativnu konvenciju —<code>PICTURE_ME_ROLLIN.adoc</code>, <code>HOLD_MY_BEER.adoc</code>, <code>ONCE_UPON_A_TIME.adoc</code>— koji uhvata istraživačku namenu trenutka.</p> </div> <div class="paragraph"> <p>Njegov životni ciklus je bezmilosrdan:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">CRÉATION (Cercle 0) ├→ Fichier vide, brain dump libre ├→ Allers-retours LLM ← → développeur └→ Aucune pression de structure ou de publication MATURATION ├→ Le contenu se densifie ├→ Des sections émergent naturellement └→ Le fichier devient une référence informelle de session CLASSIFICATION ÉPISTÉMIQUE ← FAIT PAR LE LLM ├→ VISION → publiable, diluer dans les docs publics + blog ├→ OPINION → confiner au Cercle 0, pas de dilution externe └→ STRATÉGIE → dilution restreinte (docs racine, PAS de blog) DILUTION (Cascade vers Cercles légitimes) ├→ VISION → WORKSPACE_AS_PRODUCT.adoc + WHAT_THE_GAMES.adoc + blog ├→ STRATÉGIE → WORKSPACE_AS_PRODUCT.adoc (section business) └→ OPINION → reste dans le stimulus, ne bouge pas ARCHIVAGE + SUPPRESSION ├→ Snapshot dans configuration/vision-archive/ (trace historique) └→ rm du stimulus — il a fini son travail</code></pre> </div> </div> <div class="paragraph"> <p>Stimulus koji prežive više od dva sjedanja bez rasredjivanja je anti-pattern. Ili informacija je previše važna da bi se zadrela u privremenom fajlu (→ razrediti), ili je previše nejasna da bi zasluživala da postoji (→ obrisati).</p> </div> </div> </div> <div class="sect1"> <h2 id="_делегација_за_llm_зашто_је_llm_он_који_филтрира">Делегација за LLM : Зашто је LLM он који филтрира</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ne hardkodujem klasifikaciju Vision/Opinion u Kotlinu. Injekujem je u<strong>sistemski prompt</strong>od LLM via`AGENT_GOVERNANCE.adoc` :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">---- ---- Pour chaque dilution de stimulus ou session, tu es responsable de classifier le contenu : - VISION : décision architecturale actée, pattern testé en production (>100 tests PASS), décision documentée dans BACKLOG ou ROADMAP - OPINION : spéculation, hypothèse non validée par des tests, intuition sans ancrage expérimental - STRATEGIE : positionnement business, pricing, marché cible Règles : - Si OPINION, le contenu reste confiné dans son cercle d'origine - Si VISION, tu procèdes à la dilution dans les documents racine - Si STRATEGIE, dilution restreinte (docs racine, pas de blog public) - Cette classification détermine aussi si un article de blog est publiable sur cheroliv.com ---- LLM čita ovu direktivu**пре**obraditi sesiju. Ona je u svom neposrednom kontekstu, ne u posebnom datoteci. Ovo je *determinističko prompt engineering*: ponašanje se pojavljuje iz unetog teksta, a ne iz vanjskog klasifikatora. === Зашто то ради — и зашто је контра-интуитивно Standardna reakcija: « Poveruješ li klasifikaciju AI-u? A ako se pogreši? Odgovor: čovek ne radi bolje u 2h ujutru. Razlika je u tome što LLM, on, čita SVO. Ima kontekst cijele sesije i ciljanih dokumenta. Zna da`VPS ECO-16 12€ HT`jest odluka o infrastrukturi (VISION) dok`« le TTS ElevenLabs sonne plus naturel que Coqui »`је непроверено мишљење од стране бенчмарка. Čovek na kraju sesije čita po dijagonali i čini što može. LLM čita iscrpljivo i primenjuje sistematsku mrežu. Rezultat je**pouzdaniji**, ni manje. I za 20% nejednoznačnih slučajeva — siva zona gde čak i LLM tavi — odgovor nije « dodati kod ». Odgovor je**LangGraph4j**(EPIC 13): grafik stanja koji, za ambigua slučajeve, aktivira čvor Human-in-the-Loop i vraća se čoveku za odluku. Ali za 80% jasnih slučajeva, LLM je dovoljan. == Пуни цевовод: од Brain Dump до Blog Post Ovo je kompletan tok — od sirovog ideja do objavljenog članka — sa LLM-om kao jedinom filterom : [source] ---- CERCLE 0 (jardin secret) PICTURE_ME_ROLLIN.adoc ← brain dump, allers-retours LLM ↓ [LLM classifie] → VISION / OPINION / STRATÉGIE ↓ VISION → dilution dans WORKSPACE_AS_PRODUCT.adoc → dilution dans WHAT_THE_GAMES_BEEN_MISSING.adoc → dilution dans WORKSPACE_VISION.adoc (session context) → RÉDACTION ARTICLE BLOG ← le LLM écrit, pas le dev ↓ CERCLE 4 (blog public) 0116_compartimentage_epistemique.adoc ← publié sur cheroliv.com ↓ ./gradlew deploy (bakery-gradle → JBake → JGit → GitHub Pages) ↓ https://cheroliv.com/blog/2026/0116/ ← live ---- Razvojnik ne piše članak. On izaziva, ponovo čita, potvrđuje. LLM piše. Petlja je: 1. Brain dump slobodno → bez cenzure 2. Epistemološka klasifikacija od strane LLM → nema prosaka 3. Pisanje od strane LLM → bez prokrastinacije 4. Човечка прегледа → никаква грешка Istorijski zakršen — « nema vremena da pišem » — je uklonjen. LLM radi većinu posla. Čovek radi ono što samo čovek može da uradi: suditi. == Tri korijenov dokumenta — Kako informacija nalazi svoje mesto Svaki ciljani dokument ima tačnu ulogu u kaskadi kašikanja: [cols="1,3,2"] |=== |Dokument |Šta prima |Tip sadržaja |`WORKSPACE_AS_PRODUCT.adoc` |архитектонске одлуке, технички стекат, рутовник, позициони модел |VIZIJA + STRATEGIJA |`WHAT_THE_GAMES_BEEN_MISSING.adoc` |Oblike, lekcije, anti-obrazaci, ontologija, formalna pravila |VIZIJA (testirani patterni) |`WORKSPACE_VISION.adoc` |kontekst sesije, istorija odluka, tačke infrastrukture |VIZIJA + STRATEGIJA (kontekst) |`AGENT_GOVERNANCE.adoc` |Pravila upravljanja, portfelj projekata, procedure |VIZIJA (upravljanje) |**Blog cheroliv.com** |Javni članci, vrednost za vanjskog čitatelja |Vizija samo |=== Isti stimulus može prehranjivati 4 dokumenta + blog — svaka destinacija prima deo koji se njenih tiče, bez redundancije, bez kontradikcije. Ово је што се десило за`PICTURE_ME_ROLLIN.adoc`(3. maja 2026) : | Informacije | Klasifikacija | Destinacije | | Inventar 13+ projekata foundry/ | VIZIJA | RADNI_PROSTOR_KAO_PROIZVOD | | VPS-2 OVH, edster.cloud, 8.49€/mesec | VISION | WORKSPACE_AS_PRODUCT + WORKSPACE_VISION | | «Afrički trg je spreman za mobile money» | STRATÉGIE | WORKSPACE_AS_PRODUCT (section business) | DeepSeek > Kimi > GLM za dugi kontekst » | MIŠLJENJE → VIZIJA | Ograničen zatim promovisan posle benchmarka (članak 0112) | Sintetički zaposlenik kao konačni proizvod | STRATEGIJA | WORKSPACE_AS_PRODUCT (bez bloga) | == Ovaj pattern Baby-Step + TestContainer + Živi dokument — Kod koji se sam testira Obrazac STIMULUS/Dilution upravlja mislju. Njegov ekvivalent za kod je obrazac Baby-Step/TestContainer/Doc Vivante, validiran uz pomoć plantuml-gradle (380/380 testova PROŠLO, 137 sesija bez curenja Docker): [cols="1,3"] |=== |Princip |Pravilo |**Мали корак** |Nikad više od 3 poena po US. Ako US izaziva strah, razreći je. US od 1 poena koja prolazi > US od 8 poena koja se vleče. |**TestContainer prvos** |Pre poslovnog koda, kontejner. Test infrastrukture prolazi → garantovano stabilno okruženje. |**Dataset komitovan** |Minimalni ali reprezentativan podskup u`src/test/resources/`, bez PII. Klonibilan, pokrenut. |**Živa dokumentacija** |Svaki Cucumber test = jedna rečenica na prirodnom jeziku. Izvorni kod JE izvršna specifikacija. Nula Markdown dokumenta za održavanje. |**Automatsko čišćenje** |Nema curenja resursa. Osiroti kontejneri,`/tmp/gradle-test-*`: sve je očišćeno. |=== Ovaj pattern je razlog zašto plantuml-gradle nije imao nikakvu Docker regresiju u 138 sesija. On garantuje da kod koji komunikuje sa spoljnom infrastrukturom (PostgreSQL, Redis, Kafka) uvek se testira u okruženju identičnom proizvodnji — verzionisan, reproducibilan, pokretljiv jednoj komandi. == Zaključak : sloboda mišljenja bez straha od objavljivanja Automatizovano epistemološko podeljenje na sekcije nije alat cenzure. To je**ослободилац**. Omogućava slobodno razmišljanje, spekuliranje bez filtera, brain-dumping sve što prođe kroz glavu — nikada ne brinute da bi se embrionalna ideja pojavila na blogu. LLM je čuvar ove granice. Čita sve. Klasifikuje. Razređuje ono što zaslužuje da preživi. Ograničava što treba ostati privatno. Piše što je objavljivo. I razvojnar, on, ima poslednju reč: da ponovo pročita, da izvuče izazov, da potvrdi. Suditi. To je podjela posla koja je nedostajala solo razvijaču: sintetički zaposleni koji se bavi mentalnom dokumentacijom, da bi čovek mogao da se fokusira na ono što radi najbolje — da projektuje, arhinira i odlučuje. == Референце * Članak o upravljanju agentom Eager/Lazy :link:../2026/0108_gouvernance_agent_opencode_eager_lazy_post.html[Управљање ИИ-агентом помоћу AsciiDoc] * Чланак о просторној онтологији и круговима довера :link:../2026/0114_gouvernance_cercles_confiance_ontologie_spatiale_alignement_llm_post.html[Prostorna ontologija kao mehanizam poravnanja] * Članak o Anonymiseur MVP0:link:../2026/0115_anonymiseur_dataset_mvp0_realite_augmentee_llm_post.html[Naš prvi zaposleni: Anonimizator dataseta] * Članak o usporedbi LLM dugog konteksta:link:../2026/0112_comparaison_kimi_glm_deepseek_long_contexte_plugin_gradle_opencode_post.html[DeepSeek-V4-Pro, Kimi K2.6, GLM-5.1] * Чланак о механизму резервног копирања агента:link:../2026/0110_mecanisme_backup_contexte_agent_post.html[Sliding Window i hladna vala] ----</code></pre> </div> </div> </div> </div> https://cheroliv.com/blog/pilot-batch/0115_anonymiseur_dataset_mvp0_realite_augmentee_llm_post.html Fri, 1 May 2026 00:00:00 +0000 blog/pilot-batch/0115_anonymiseur_dataset_mvp0_realite_augmentee_llm_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_problem_koji_čini_da_svega_sveta_beži">Problem koji čini da svega sveta beži</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 12 minutes</div> <p>Ne zapošljavam LLM. Zapošljavam anonimizator. Pre nego što uradim RAG pgvector, pre nego što fine-tuniram eksperte CDA/FPA, pre nego što pružim klijentske radne prostore — neko mora da ocisti toaletne prostorije podataka. Ovaj zaposleni je ekspert za anonimizaciju (MVP0, EPIC 2 iz codebase-gradle). I to je on čini proizvod tržišno pogodan.</p> </div> <div class="paragraph"> <p>тиk? Wait check: French "toc" pronounced like "tok". Serbian "тик" is "tik". Yes.</p> </div> <div class="paragraph"> <p>Thus output: тик. Provide only that.</p> </div> <div class="paragraph"> <p></think></p> </div> <div class="dlist"> <dl> <dt class="hdlist1">тик</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_problem_koji_čini_da_svega_sveta_beži">Problem koji čini da svega sveta beži</h2> <div class="sectionbody"> <div class="paragraph"> <p>Svaki AI startup koji manipuliše podacima za obuku suočava se sa istom zidom:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">---- ---- Données brutes client (SPG, cours, évaluations) ├→ Noms de stagiaires en clair dans les PDF ├→ Emails dans les métadonnées JSON ├→ IP de connexion dans les logs pgvector ├→ Identifiants dans les nœuds Graphify └→ Références OF pilote dans les schémas SQL ---- Rezultat: ili radiš RAG na nečistim podacima (halucinacije PII, neusklađenost sa GDPR, pravni rizik), ili ne radiš ništa (bez proizvoda). Treći pristup — rukovno čišćenje — nije skalabilno. Moj odgovor: ne obilaziti problem. L'**automatizovati**. == MVP0: Anonimizator, Prvi zaposleni u periodo probnog rada MVP0 nije funkcija. To je**stručnjak za udobnost**— zaposleni koji radi nečist, glup i zlonamerni posao, i o kom nitko ne želi da priča u pitch dekovi. Шта он ради : [source] ---- ENTRÉE : Données brutes multi-sources ├→ AsciiDoc (SPG_A2SP.adoc) → noms, dates, OF pilote ├→ JSON (catalogue formations) → emails, téléphones ├→ YAML (config workspace) → tokens OAuth2 ├→ SQL (schémas DDL) → IP, adresses ├→ pgvector (métadonnées embeddings) → identifiants ├→ ONNX (outputs classification) → noms propres └→ Graphify (graph.json) → nœuds avec PII SORTIE : Datasets propres, format standardisé ├→ [ANONYMIZED] remplace les PII détectées ├→ Classification RGPD (niveau 0→4) ├→ Rapport d'audit (quoi a été nettoyé) └→ Dataset prêt pour RAG ET fine-tuning ---- On detektuje najjasniji uzorci prv o(emails`.*@.*`, токени`sk-*`, `ghp_*`, IPs), zatim uči. Probni period je to: proveravamo da ne propusta lažna negativa pre nego što ga zaposlimo na stalno. == Šta ovaj MVP otključava (i to nije samo usaglašenost) Anonimizacija kao MVP0 nije GDPR pedža pre autoputa. Ona je sama autoput. Evo što otvara: === Присутно : Раширена реалност у Prompt [source] ---- DONNÉES BRUTES CLIENT ↓ Anonymiseur MVP0 → datasets propres ↓ RAG pgvector (MVP1) → top-K documents similaires (filtrés, anonymisés) ↓ LLM (deepseek-v4-pro) → réponse augmentée, zéro PII ---- RAG ne pretražuje u nečistim podacima — pretražuje u prostoru**čist po konstrukciji**. Ова променила све за квалитет одговора: LLM не губи време на обилажавање PII која препознаје, али не сме да наведе. === Будуће: Фин-тјунинг на здравким подацима [source] ---- MVP0 → datasets propres accumulés (session après session) ↓ Fine-tuning expert métier (CDA, FPA) sur données zéro PII ↓ Modèle fine-tuné exposé via Ollama (sans fuite de données) ---- Fine‑tuning na neobrađenim podacima je potencijalna pravna katastrofa. Na čistim podacima, to je**reproduktivna metoda**. Svaki klijent akumulira svoje očišćene datasetove, svaki klijent može fine-tunirati svoje poslovne stručnjake na svojim podacima — nikad ne izlagajući lične podatke. == Zasto je tržišno pogodna Nije « alat za GDPR saglasnost » . To je**повторљива метода која преобразује универзални проблем у актив**: 1. *Svaka kompanija za obuku ima nečiste podatke* — to je problem 2. *Nema ni jedne sa automatizovanim pipeline-om za multi-izvorno čišćenje* — to je tržište 3. *Pетља: анонимовање → RAG → fine-tuning је сопствена* — то је баријера SaaS Edster (MVP3) neće da proda „Gradle radni prostor“. Prodaće ovaj zatvoreni ciklus. I MVP0 je ulazna vrata. == SQL format kao treći put konteksta Uvoz strukturalnih podataka nije samo format razmene. Šema SQL (DDL) nosi**model entiteta-veze domena**: [source] ---- CREATE TABLE formation ( id UUID PRIMARY KEY, titre VARCHAR NOT NULL, referentiel RNCP REFERENCES rncp(id), organisme OF REFERENCES of_pilote(id) -- ← va être anonymisé ); ---- Ovaj DDL, jednom anonimizovan (linija 4), postaje izvor konteksta za LLM. Nije tekst — od**poslovni model**. RAG daje sadržaj (vektorska sličnost), Graphify daje veze (tačna struktura), a SQL šema daje**Dizajn vodjen domenom implicitno**: bounded contexts, agregati, vrednosni objekti. LLM razume poslovnu domenu jer čita njenu shemu. == Roadmap: od MVP0 do SaaS [source] ---- MVP0 — Anonymiseur (ce que cet article décrit) Sortie : datasets propres, reproductible MVP1 — RAG pgvector (dépend de MVP0) Realité augmentée en prompt sur données nettoyées MVP2 — Graphify + ONNX + SQL DDD (dépend de MVP1) Vecteur composite de contexte (règles + similarité + relations exactes) MVP3 — SaaS Edster (dépend de MVP0-2) Provisionnement workspace client complet ---- Svaki MVP zavisi od prethodnog. Nijedan ne može biti dostavljen bez MVP0. To je razlog zašto Anonymiser nije « P0 » u backlogu — on je**MVP0**. Ово је први комерцијални достављив, а све остало зависи од његовеспеха. == Zaključak: Nevidljivi rad koji omogućava sve U običnoj startupu, čišćenje podataka je outsourcovan, rukovno ili ignorisano. U ovoj arhitekturi, to je**srce proizvoda**. Анонимајзер је први запослени зато што без него, ништа не ради : * Bez MVP0 → ni pravnog RAGa (MVP1) * Bez MVP0 → bez fine-tunink bez zaklečavanja podataka (EPIC 5) * Bez MVP0 → ne postoji kredibilan SaaS (MVP3) * Bez MVP0 → bez proširene realnosti u promptu * Bez MVP0 → nema trećeg kontekstnog puta (SQL DDD) On radi nečistu poslu. Nikada neće biti naveden u pitch-ovima. Ali on je onaj koji pokreće fabriku. A zato ga zapošljavamo prvo. == Reference * Članak o prostornoj ontologiji i krugovima poverenja :link:../2026/0114_gouvernance_cercles_confiance_ontologie_spatiale_alignement_llm_post.html[Просторска онтологија као механизам за поравнање] * Članak o Eager/Lazy agentu upravljanja:link:../2026/0108_gouvernance_agent_opencode_eager_lazy_post.html[Upravljanje AI agentom pomoću AsciiDoc] * Članak o mehanizmu Hot/Warm/Cold :link:../2026/0110_mecanisme_backup_contexte_agent_post.html[pomični prozor i hladna vala] * Članak o poredanju tri LLM-a :link:../2026/0112_comparaison_kimi_glm_deepseek_long_contexte_plugin_gradle_opencode_post.html[DeepSeek-V4-Pro, Kimi K2.6, GLM-5.1] ----</code></pre> </div> </div> </div> </div> https://cheroliv.com/blog/2026/0114_gouvernance_cercles_confiance_ontologie_spatiale_alignement_llm_post.html Thu, 30 Apr 2026 00:00:00 +0000 blog/2026/0114_gouvernance_cercles_confiance_ontologie_spatiale_alignement_llm_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_забележење_prompt_engineering_је_песарски_град">Забележење: Prompt Engineering је песарски град.</a></li> <li><a href="#_четири_круга_довера_пространна_онтологија">Четири круга довера : пространна онтологија</a> <ul class="sectlevel2"> <li><a href="#_tajni_vrt_prostor_izvan_cvs">Tajni vrt : Prostor izvan CVS</a> <ul class="sectlevel3"> <li><a href="#_файл_gitignore_као_конфигурација_управљања">Файл <code>.gitignore</code> као конфигурација управљања</a></li> <li><a href="#_mehanizam_od_snapshot">Mehanizam od Snapshot</a></li> </ul> </li> <li><a href="#_сейф_configuration_као_spring_cloud_config">Сейф: <code>configuration/</code> као Spring Cloud Config</a></li> <li><a href="#_библиотека_office_kao_potrošljivi_podaci">Библиотека : <code>office/</code> kao potrošljivi podaci</a></li> <li><a href="#_коваонице_foundry_као_имплементација">Коваонице : <code>foundry/</code> као имплементација</a></li> </ul> </li> <li><a href="#_zaprotiv_prostorno_poravnanje_vs_poravnanje_na_osnovu_prompta">Za/Protiv: Prostorno poravnanje vs Poravnanje na osnovu prompta</a> <ul class="sectlevel2"> <li><a href="#_klasični_pristup_poravnanje_po_pre_promptu">Klasični pristup: poravnanje po pre-promptu</a></li> <li><a href="#_овај_приступ_поравнање_према_просторној_онтологији">Овај приступ : поравнање према просторној онтологији</a></li> </ul> </li> <li><a href="#_relaciona_algebra_workspace_i_delta_observable">Relaciona algebra Workspace i Delta Observable</a></li> <li><a href="#_kompozitni_kontekstni_vektor_rag_pgvector_graphify">Kompozitni kontekstni vektor : RAG + pgvector + Graphify</a> <ul class="sectlevel2"> <li><a href="#_komponenta_1_rag_langchain4j_postgresql_pgvector">Komponenta 1 — RAG LangChain4j + PostgreSQL pgvector</a></li> <li><a href="#_компонента_2_knowledge_graph_graphify">Компонента 2 — Knowledge Graph Graphify</a></li> <li><a href="#_компонента_3_graphify_инкрементални_ретак_агрегабилан_потрошајни">Компонента 3 — Graphify инкрементални : ретак, агрегабилан, потрошајни</a></li> </ul> </li> <li><a href="#_automatska_klasifikacija_rgpd_llm_kao_ruter">Automatska klasifikacija RGPD: LLM kao ruter</a></li> <li><a href="#_план_развоја_од_asciidoc_до_langgraph4j">План развоја: од AsciiDoc до LangGraph4j</a></li> <li><a href="#_šta_ova_architektura_rešava_i_šta_ne_rešava">Šta ova architektura rešava (i šta ne rešava)</a></li> <li><a href="#_закључак_архитектура_као_дискурс">Закључак: архитектура као дискурс</a></li> <li><a href="#_reference">Reference</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 20 minutes</div> <p>Inženjerstvo podskaživanja je křehko. Pri 80 000 tokena, vaša pravila poravnanja zagubljena su u bučanju, a LLM zaboravlja što ste mu pitali na početku razgovora. Moje rešenje? Ne poravnati po tekstu, već po l'<strong>prostor</strong>. Структурирао сам свој радини prostor за развој у четири концентричних кругова поверања — од интимног тајног сада до публичних кузница — и сваки круг је физичка зона файлова система. LLM не треба да му се напоминају правила: путања до фајла их садржи. Ово је како то функционише, и зашто ова архитектура подједнаčenja преко простора је издрживији од`system prompt`од 500 линија.</p> </div> <div class="paragraph"> <p>Ovo je dugi članak.<br> Ugodno se namesti.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">tik</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_забележење_prompt_engineering_је_песарски_град">Забележење: Prompt Engineering је песарски град.</h2> <div class="sectionbody"> <div class="paragraph"> <p>Tri nedelje sam razvio Gradle pluginove pomoću Opencode, koristeći tri različita LLM-a — Kimi K2.6, GLM-5.1 i DeepSeek-V4-Pro (jedini preživeli, ali to je druga priča)<a href="0112_comparaison_kimi_glm_deepseek_long_contexte_plugin_gradle_opencode_post.html">Déjà couverte ici.</a> Moj metod upravljanja agentom<a href="0108_gouvernance_agent_opencode_eager_lazy_post.html">Je l’ai documentée en détail dans un précédent article.</a> osniva se na AsciiDoc fajlovima —<code>AGENT.adoc</code>, <code>INDEX.adoc</code>, <code>PROMPT_REPRISE.adoc</code>— koji učitavaju ~30 000 tokena pravila, backloga i istorije na svakom početku sesije.</p> </div> <div class="paragraph"> <p>Ipak, iako je ova dokumentacijska infrastruktura, dve stvari me iznenadle:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>LLM zaboravlja.</strong> Čak i s absolutnim pravilima na vrhu svakog EAGER fajla, iznad 60 000 akumuliranih tokena (početni kontekst + razgovor), Kimi K2.6 je počeo da predlaže`Write`Претежави на датотекама конфигурације. GLM-5.1 je pogušao Firebase token sa placeholder-om za zamenu. Pravila su bila napisana — LLM ih više ne <strong>vidi</strong>.</p> </li> <li> <p><strong>Upravljanje samo po sebi postaje problem.</strong> Posle implementacije mehanizma Hot/Warm/Cold<a href="0110_mecanisme_backup_contexte_agent_post.html">Article sur la rotation de backup.</a> da se izbegne eksplozija konteksta, moje EAGER datoteke su jos uopšte težile 1414 linija <a href="0111_audit_contexte_agent_post.html">J’ai documenté cet audit ici.</a> Upravljanje — namijenjeno zaštiti LLM od preopterćenja — preopterecivalo LLM.</p> </li> </ol> </div> <div class="paragraph"> <p>Mi je bila potrebna mehanizacija za poravnanje koja ne zavisi od broja tokena u promptu.</p> </div> <div class="paragraph"> <p>Одговор: престаньте да подужавате по тексту, а почените да подужавате по<strong>prostor</strong>.</p> </div> </div> </div> <div class="sect1"> <h2 id="_четири_круга_довера_пространна_онтологија">Четири круга довера : пространна онтологија</h2> <div class="sectionbody"> <div class="paragraph"> <p>Мој фајл`workspace/<code>(u</code>~/workspace/`) nije <strong>pas</strong> Git skladište. To je korijen sve moje posla — kod, dokumentacija, obuka, infrastruktura. I je strukturisan u četiri zone koje nisu konvencije skladištenja, ali<strong>koncentrički kruhovi poverenja</strong> :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 6.6666%;"> <col style="width: 13.3333%;"> <col style="width: 20%;"> <col style="width: 26.6666%;"> <col style="width: 33.3335%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Nivo</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Oznaka</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Fizička zona</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">CVS</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Vidljivost</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">0</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>tajna bašta</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`workspace/`koren</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ниједан</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Intimno — slobodna misao, nema commit-a, nema objave</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Sejf</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>configuration/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Privatni Git (solo)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tajne, tokeni, arhiv vidnja. Samo jedna osoba.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Biblioteka</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>office/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Privatni Git (širen)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Pedagoški podaci, SPG/SPD, JSON šeme. Identifikovan krug poverenja.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">4</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Коваонице (јавне)</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>foundry/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">javni Git (Apache 2.0)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Izvorni kod, plugini, testovi, tehnička dokumentacija.</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>NAPOMENA: U tabeli ne postoji nivo 3. Nivo 3 je <strong>tranzitivni</strong> nivo: to je sadržaj od`office/`koji je anonimiziran i spreman da se objavi kao open data. Nema vlastitu fizičku zonu — to je stanje podataka, nije lokacija.</p> </div> <div class="paragraph"> <p>Svaki nivo odgovara na precizno pitanje:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Где може да се постави идеја која још није спремна за дељење, iako imate ograničen krug?</strong> → Скретни зарт. Ни Git. Ни пресиљак.</p> </li> <li> <p><strong>Gde čuvati API token tako da ne uteče?</strong> → Sejf`configuration/`). Fizički izolovan. Nijedan drugi depozitar ne može da ga referencira greškom.</p> </li> <li> <p><strong>Где садомно направити каталог обuke са пилотним ОФ ?</strong> → Библиотека`office/`). Verzionisan, kolaborativan, ali privatan.</p> </li> <li> <p><strong>Где индустриализовати Gradle плагин otvorenog koda ? → Форге</strong><code>foundry/</code>). Javno, forkabilno, testirano u CI.</p> </li> </ul> </div> <div class="paragraph"> <p>Ова онтологија је<strong>потрошајио од LLM</strong>. Када чита фајл у`foundry/plantuml-gradle/src/`, онimplicitно зна: "Ja sam u krugu 4 — javni kod, obavezni testovi, bez tajni, bez obrazovnih podataka". Mu nije potreban podsetник који га подсетио.</p> </div> <div class="sect2"> <h3 id="_tajni_vrt_prostor_izvan_cvs">Tajni vrt : Prostor izvan CVS</h3> <div class="paragraph"> <p>Ово је најважнији концепт — и најпротивоинтуитивнији.</p> </div> <div class="paragraph"> <p>Корен`workspace/<code>nije ima</code>.git/<code>. Dokumenti koji žive tamo (`WORKSPACE_VISION.adoc</code>, <code>WORKSPACE_AS_PRODUCT.adoc</code>, <code>WORKSPACE_ORGANIZATION.adoc</code>— i onaj koji trenutno čitate, koji nastaje od njega) nisu namenjeni da budu verzionisani, deljeni, ili čak pročitati od neke druge osim mene. Ovo su<strong>мисли у фази germinacije</strong>.</p> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="❗"></i> </td> <td class="content"> <div class="paragraph"> <p>Tajni vrt je <strong>out-of-CVS</strong> po prirodi. Nedostatak verzioniranja je uslov za slobodu misljenja. Ne piše se tamo da se čita — piše se tamo da se jasno uvidí sopstvena perspektiva.</p> </div> </td> </tr> </table> </div> <div class="paragraph"> <p>Ali ova sloboda ima cenu: jedan`rm`случајно, и то су месеци стратешког размишљања који се губе. Решение није да верзовати башту (то би је уништило) — то је да га<strong>зркалити</strong>у најужејем кругу.</p> </div> <div class="sect3"> <h4 id="_файл_gitignore_као_конфигурација_управљања">Файл <code>.gitignore</code> као конфигурација управљања</h4> <div class="paragraph"> <p>На корену`workspace/<code>, jedna datoteka</code>.gitignore`minimal izjavljuje<strong>politika historizacije</strong>датотеке из тајног баљета :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">.goosehints .goose</code></pre> </div> </div> <div class="paragraph"> <p>Ce <code>.gitignore`nema klasičnu Git funkciju (njema</code>.git/`na korenu). Deljuje kao jedan<strong>fajl konfiguracije upravljanja</strong>koji odgovara na precizno pitanje: <strong>koji artefakti iz tajnog vrta zaslužuju da budu historizirani, a koji su čisto prohodni?</strong></p> </div> <div class="ulist"> <ul> <li> <p>Fajlovi navedeni u`.gitignore`—<code>.goosehints</code>, <code>.goose</code>— su efemerni artefakti generisani od agenata. Nema strategijske vrednosti. Nema istorijacije.</p> </li> <li> <p>Datoteke`.adoc`od korena —<code>WORKSPACE_VISION.adoc</code>, <code>WORKSPACE_ORGANIZATION.adoc</code>, <code>WORKSPACE_AS_PRODUCT.adoc</code>, <code>WHAT_THE_GAMES_BEEN_MISSING.adoc</code>, <code>depots_implementes_strategie.adoc</code>, <code>synthese-LLMs-long-contexte.adoc</code>— nisu<strong>nije</strong>у`.gitignore`. Ово су артефакти које треба историзовати.</p> </li> </ul> </div> <div class="paragraph"> <p>Le `.gitignore`је<strong>šema upravljanja</strong>: sve što nije navedeno u listi je kandidat za snapshot. Et le LLM, en lisant ce fichier, sait exactement ce qui doit être archivé et ce qui peut être ignoré — sans qu’on ait besoin de le lui rappeler dans un prompt.</p> </div> </div> <div class="sect3"> <h4 id="_mehanizam_od_snapshot">Mehanizam od Snapshot</h4> <div class="paragraph"> <p>Napravio sam`configuration/vision-archive/<code>: datirani snapshot-ovi svih</code>.adoc`из корена, коммитовати у приватном репозиторијуму`configuration/`. Svaka sesija brainstorminga produira snapshot:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">DATE=$(date +%Y-%m-%d) mkdir -p /home/cheroliv/workspace/configuration/vision-archive/$DATE cp /home/cheroliv/workspace/*.adoc /home/cheroliv/workspace/configuration/vision-archive/$DATE/ cd /home/cheroliv/workspace/configuration && git add vision-archive/ && \ git commit -m "vision-archive: snapshot $DATE"</code></pre> </div> </div> <div class="paragraph"> <p>Procedura se pokreće na kraju sesije LLM-om sam, koji izvršava zadatak globalnog rutiranja. Svaki snapshot uhvatuje kompletno stanje strateškog mišljenja u trenutku T.</p> </div> <div class="paragraph"> <p>istorija Git`configuration/`постаје<strong>biografija moje strateške misli</strong>. Ja mogu da uradim jedan`git log — vision-archive/`i videti evoluciju mog vida, sesija po sesiji, datum po datumu.</p> </div> <div class="paragraph"> <p>Реални пример историје после једног дани рада:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">$ git -C configuration log --oneline -- vision-archive/ 1089d1b vision-archive: fin de session finale 2026-05-03 6b21eaf vision-archive: fin de session 2026-05-03-1300 1690f82 vision-archive: post-article 2026-05-03 28e6593 vision-archive: post-migration 2026-05-03 3707b78 vision-archive: snapshot 2026-05-03 — jardin secret initial</code></pre> </div> </div> <div class="paragraph"> <p>Pet snapshot-a u jednom danu. Svaki je tačka vraćanja. Svaki je mijumski kamen u nastanju strategije.</p> </div> <div class="paragraph"> <p>Fajl`configuration/vision-archive/latest/`sadrži stalno jedna<strong>radna kopija</strong>poslednjem snapshotu, služi kao brza referenca bez potrebe da se pretražuje istorija Git.</p> </div> <div class="paragraph"> <p>И за LLM, је један<strong>orakul koherentnosti</strong>: kad primeti razliku između trenutne implementacije i arhivisanog vida iz prethodnog datuma, može je prijaviti.</p> </div> </div> </div> <div class="sect2"> <h3 id="_сейф_configuration_као_spring_cloud_config">Сейф: <code>configuration/</code> као Spring Cloud Config</h3> <div class="paragraph"> <p>`configuration/`Ne sadrži samo arhivu vida. Njegova primarna — i budućna — funkcija je da bude<strong>Server Spring Cloud Config</strong>. Секрети, токени, креденцијали, и дескриптори инфраструктуре живе овде, у приватном Гит репозиторију приступном само власнику.</p> </div> <div class="paragraph"> <p>Zašto zaseban depozitarijum umesto fajla`.env`у сваком пројекту ?</p> </div> <div class="ulist"> <ul> <li> <p><strong>Slučajno pushanje tajne</strong> : nemoguće. Tajne se nalaze u privatnom repozitorijumu koji javni projekti ne mogu greškom referencirati.</p> </li> <li> <p><strong>Audit</strong> : Istorija Git daje sled svake promene konfiguracije. Ko je šta promenio, kada, sa kojim SHA hash-om.</p> </li> <li> <p><strong>повратак</strong> :`git revert`na oštećenoj konfiguraciji. Instantno, bez ručnog backupa.</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_библиотека_office_kao_potrošljivi_podaci">Библиотека : <code>office/</code> kao potrošljivi podaci</h3> <div class="paragraph"> <p>`office/`Je dokumentarni pratioc razvoja. Sadrži članke bloga, tehničke specifikacije, materijale za obuku (38 direktorijuma kurseva FPA, SPG/SPD, JSON šeme, taksonomije Bloom/Harrow/Krathwohl) — sve što čini<strong>pedagoški materijal</strong>.</p> </div> <div class="paragraph"> <p>Но`office/`Nije samo ormarić za dokumente. Ovo je<strong>извор структурираног података</strong>da Gradle pluginovi`foundry/`potrošavaju. jedan članak na blogu u`office/`je ulaz koji će plugin pretvoriti u HTML. Jedan SPG AsciiDoc u`office/metiers/FPA/`је артефакт који оркестратор ће парсирати да генерише слајдове, квизове и видео капсуле.</p> </div> <div class="paragraph"> <p>Et le `build.gradle.kts`u korenu`office/`Није је код послова — је један<strong>скрипт за потроњу екосистема додатака</strong>. On reče: "Ovo su Gradle pluginovi koje koristim, ovo je kontekst mojog radnog prostora".</p> </div> </div> <div class="sect2"> <h3 id="_коваонице_foundry_као_имплементација">Коваонице : <code>foundry/</code> као имплементација</h3> <div class="paragraph"> <p><code>foundry/`sadrži<strong>индустриализовани код</strong>. 54 Git repozitorijuma, od kojih 7 trenutno upravljaju</code>.agents/`. Ovo je gde vid postaje izvršljiv — Gradle pluginovi, CI/CD, JUnit5 + Cucumber testovi.</p> </div> <div class="paragraph"> <p>Odnos sa`office/`je dvosmerna :</p> </div> <div class="ulist"> <ul> <li> <p><code>office/</code>→<code>foundry/</code>: pedagoški podaci su osnovna materija koju plugini konsumiraju.</p> </li> <li> <p><code>foundry/</code>→<code>office/`plugini produju data koja obogćava`office/</code> — le `graph.json`graphify-gradle, sklopljeni slider dekovi, izveštaji o gradnji.</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaprotiv_prostorno_poravnanje_vs_poravnanje_na_osnovu_prompta">Za/Protiv: Prostorno poravnanje vs Poravnanje na osnovu prompta</h2> <div class="sectionbody"> <div class="paragraph"> <p>Usporedimo oba pristupa.</p> </div> <div class="sect2"> <h3 id="_klasični_pristup_poravnanje_po_pre_promptu">Klasični pristup: poravnanje po pre-promptu</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 20%;"> <col style="width: 80%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Profesionalac</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌ protiv</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Jednostavno je primeniti. Jedan blok teksta u system promptu.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Fragile u dugome kontekstu</strong> : pravilo je utopreno posle 80K tokena.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Radi na opšte pravila (ton, format).</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Neprovjerivo</strong> : ništa ne sprečava LLM da krši pravilo.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Не треба да репромшљате архитектуру пројекта.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Neprevodno</strong>: svaki repo ponovo definiše pravila.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Само декларативно</strong> : LLM зна да <strong>треба</strong>, али ништа не спречава.</p></td> </tr> </tbody> </table> </div> <div class="sect2"> <h3 id="_овај_приступ_поравнање_према_просторној_онтологији">Овај приступ : поравнање према просторној онтологији</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 20%;"> <col style="width: 80%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ Pro</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌ protiv</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Резилиентан у дугом контексту</strong>: правило је у путањи датотеке, а не у далеком упуту.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Inicijalni trošak infrastrukture</strong>: strukturiranje workspace u krugove zauzima vreme.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Mehanički proverivo</strong> : jedna tajna u`foundry/<code>je detektovan od`git check-ignore</code>.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Потребна је дисциплина</strong>: нови сарадник треба да разуме кругове.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Преносљив</strong> : један`AGENT.adoc`standard izlaga krugove svakom novom projektu.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Pokriva samo prostorne ograničenja</strong> — stil koda ostaje u promptu.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Sigurnost po dizajnu</strong> : jedan`git push`од`foundry/<code>ne može da izloži`configuration/</code>.</p></td> <td class="tableblock halign-left valign-top"></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Potreban za agente koji nisu LLM</strong> : orchestrator Gradle može da usmeri prema krugu.</p></td> <td class="tableblock halign-left valign-top"></td> </tr> </tbody> </table> <div class="paragraph"> <p>Glavna dobit nije defenzivna (sigurnost, vidljivost) — ona je<strong>креативан</strong>Кога LLM ради у простору структурираном онтологијом, он може да уради шта ниједоан промпт није му омогућао: <strong>погледати дельту</strong>.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_relaciona_algebra_workspace_i_delta_observable">Relaciona algebra Workspace i Delta Observable</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kada LLM prelazi`foundry/<code>, ima jedan<strong>rezet strukturiranih podataka</strong>: čvorovi (plugins, fajlovi, testovi, zavisnosti), tipovani ivice (`import</code>, <code>depends_on</code>, <code>generates</code>, <code>tests</code>), relacije sastava i reda (`training-gradle`извлачи репозиторијум`slider-gradle`generiše slideove →`capsule-gradle`покрени видео).</p> </div> <div class="paragraph"> <p>Ova algebra nije napisana nigdje otvoreno — ali je <strong>vidljiva</strong>.`build.gradle.kts`Izlaže zavisnosti. Svaki`INDEX.adoc`izlaga ukrštene reference.</p> </div> <div class="paragraph"> <p>LLM posmatra ovu algebru i detektuje<strong>дельта</strong>: razlika između onog što sistem već zna da proizvede i onog što videnje opisuje.</p> </div> <div class="paragraph"> <p>Od ogov delte, može da definiše<strong>Kartografije poslovnih eksperata</strong>— CDA (Dizajner-razvijalac aplikacija, Kotlin/Gradle/JHipster) i FPA (Profesionalni trener odraslih, Pédagogie/Qualiopi/Bloom) — i identificirati što nedostaje svakom ekspertru.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">Expert CDA (Kotlin/Gradle/JHipster) ├── Plugins : jhipster-gradle-plugins, plantuml-gradle, │ codebase-gradle ├── Delta : pas encore de SPG CDA formalisé, │ pas de fine-tuning expert CDA Expert FPA (Pédagogie/Qualiopi/Bloom) ├── Plugins : training-gradle, slider-gradle, │ school-backoffice/forms, capsule-gradle ├── Matériel : 38 modules cours, SPG/SPD, taxonomies └── Delta : parser AsciiDoc→JSON à créer, orchestrateur à coder</code></pre> </div> </div> <div class="paragraph"> <p>LLM-u nije potrebno da mu se kaže što da uradi. Delta nastaje iz strukture.</p> </div> </div> </div> <div class="sect1"> <h2 id="_kompozitni_kontekstni_vektor_rag_pgvector_graphify">Kompozitni kontekstni vektor : RAG + pgvector + Graphify</h2> <div class="sectionbody"> <div class="paragraph"> <p>Релацијска алгебра није теоријска конструкција. Она је <strong>материјализована</strong> трију компонентама које формирају један<strong>kompozitni vektor konteksta</strong>за LLM.</p> </div> <div class="sect2"> <h3 id="_komponenta_1_rag_langchain4j_postgresql_pgvector">Komponenta 1 — RAG LangChain4j + PostgreSQL pgvector</h3> <div class="paragraph"> <p>Већ имам LangChain4j у производном окружењу у два плагина:`slider-gradle`(4 providers LLM) и`plantuml-gradle`(7 providers). ONNX embeddings (AllMiniLmL6V2) indeksiraju podatke od`office/`i izvorni kod`foundry/`у PostgreSQL + pgvector.</p> </div> <div class="paragraph"> <p>Ovaj RAG radi na dva dimenzije:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Dimension data</strong>: dokumenti`office/`(SPG, članci, obuke, JSON šeme)</p> </li> <li> <p><strong>Код димензије</strong> : кодобазе`foundry/`(izvorni kod Kotlin, testovi Cucumber, AGENT.adoc)</p> </li> </ul> </div> <div class="paragraph"> <p>Presek pokriva i <strong>šta</strong> (poslovni domen) i <strong>kako</strong> (implementacija).</p> </div> </div> <div class="sect2"> <h3 id="_компонента_2_knowledge_graph_graphify">Компонента 2 — Knowledge Graph Graphify</h3> <div class="paragraph"> <p>Graphify je integrisan u`plantuml-gradle`(109 testova, 380/380 prolazi) i proizvodi jedan`graph.json`— jedan strukturiran znanjski graf sa čvorovima, granama i automatski detektovanim zajednicama</p> </div> <div class="paragraph"> <p>U suprotnosti RAG-u koji radi na vektorskoj sličnosti (mglav), knowledge graph radi na<strong>tačni odnosi</strong>(deterministicki) :`graphify query`za semantička pitanja (~50 tokens),`graphify path`за навигацију,`graphify explain`за објашњење.</p> </div> </div> <div class="sect2"> <h3 id="_компонента_3_graphify_инкрементални_ретак_агрегабилан_потрошајни">Компонента 3 — Graphify инкрементални : ретак, агрегабилан, потрошајни</h3> <div class="paragraph"> <p>To je ključna arhitektonska odluka.</p> </div> <div class="paragraph"> <p>Graphify ne sme da živi u jedinom repozitorijumu. Ono mora da živi na način.<strong>распоређено</strong>у сваком плагину:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Svaki plugin</strong> uključuje Gradle zadatak`updateKnowledgeGraph`ko poziva Graphify<strong>на свом опсегу</strong>i proizvodi jedan`graph.json`lokal.</p> </li> <li> <p>build skripta za`office/<code>* консоме`graphify-gradle`са`rootDir = /home/cheroliv/workspace`i proizvodi jedan`graph.json</code> <strong>globalni</strong>koji agregira lokalne grafove.</p> </li> <li> <p><strong>Le RAG de chaque plugin</strong> injicira`graph.json`kao globalno<strong>filtr konteksta</strong>za LLM upite.</p> </li> </ol> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">TÂCHE GRADLE (dans chaque plugin) ↓ graphify → graph.json (scope local) ↓ office/build.gradle.kts → graph.json (scope global) ↓ RAG pgvector (dans slider, plantuml, codebase...) ↓ ← injection du graph.json comme filtre LLM (deepseek-v4-pro) ↓ ← observation algèbre relationnelle ↓ ← détection delta vs cartographies experts PRIORISATION → prochaine tâche</code></pre> </div> </div> <div class="paragraph"> <p>Rezultat: LLM ne traži u prazno — kreće se kroz prostor struktuirani po knowledge grafu. Upit na "génère un diagramme" zna da dosegne relevantne čvorove grafa.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_automatska_klasifikacija_rgpd_llm_kao_ruter">Automatska klasifikacija RGPD: LLM kao ruter</h2> <div class="sectionbody"> <div class="paragraph"> <p>Просторна онтологија не се само задовољава поравнавањем LLM-a — она јему даје<strong>матрица класификације RGPD</strong>Да би се свака податок рутирао према законој зони.</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 12.5%;"> <col style="width: 37.5%;"> <col style="width: 25%;"> <col style="width: 25%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Крите­риум</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Детекција LLM</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">akcija</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Максимални нivo</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Lični podaci (ime, e‑mail, IP)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Pattern`@`, IP, imena propria</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Anonimizovati →`[OF_PILOTE]`или рутер ниво 2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Token / Tajna / Prikaznica</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Uzorak`sk-…​<code>, `ghp_…​</code>, <code>ya29…​</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ruter →<code>configuration/</code>. Referencirano od`${VAR}`u kodu.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">1</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">unutrašnji URL</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Sadrži`localhost`, privatna IP</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Anonimizuj →<code>${API_URL}</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Pedagoški podatak (SPG, predmet)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Структура Bloom/Qualiopi</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ruter →<code>office/</code>(nivo 2). Dvostruka verzija pri izvozu.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">3</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Izvorni kod / test</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Proširenje`.kt`, <code>.kts`у`foundry/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Маршрутизатор →<code>foundry/</code>. Proveriti odsustvo tajni.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">4</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>На крају сеансе, LLM извршава једну<strong>globalni zadatak</strong>:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Čitanje`.gitignore`koren za identifikaciju efemernih artefakata (da se isključe iz snapshota) vs strateški artefakti (da se arhiviraju)</p> </li> <li> <p>Списак свих датотека`.adoc`od korena`workspace/`</p> </li> <li> <p>Филтрање : искључење фајлова наведених у`.gitignore`, uključenje svih ostalih</p> </li> <li> <p>Kopiraj u`configuration/vision-archive/$DATE/<code>ažuriranje simboličke veze`latest/</code></p> </li> <li> <p>Commit u repozitoriju`configuration/`sa strukturisanom porukom</p> </li> <li> <p>Automatska GDPR klasifikacija svakog izmjenjenog fajla (svi krugovi)</p> </li> <li> <p>Маршрутирање : подаци`office/<code>→ privatni commit, kod`foundry/</code>→<code>./gradlew check</code>, konfiguracija → komit</p> </li> <li> <p>Strukturovan izveštaj sa upozorenjima po GDPR i potvrdom arhivaciji</p> </li> </ol> </div> <div class="paragraph"> <p>Le `.gitignore`korijen nije datoteka konfiguracije Git — ovo je<strong>fajl za upravljanje istorizacijom</strong>. Он definiše šemu koju LLM potrošuje da odluči koje fajlove iz tajnog vrta uđe u stratešku biografiju a koji su jednorazni.</p> </div> <div class="paragraph"> <p>LLM više nije obični generator teksta. On je<strong>информацијски менеджер</strong>екосистема — произвођач, класификатор, рутер</p> </div> </div> </div> <div class="sect1"> <h2 id="_план_развоја_од_asciidoc_до_langgraph4j">План развоја: од AsciiDoc до LangGraph4j</h2> <div class="sectionbody"> <div class="paragraph"> <p>Данас, ова управљање је <strong>детерминистички</strong> : LLM primenjuje jednu proceduru opisanu u AsciiDoc datotekama. Ово је<strong>faza 1</strong>— инжењерство промпта са меморијом LLM.</p> </div> <div class="paragraph"> <p>La <strong>faza 2</strong>ćе izvući svaki korak postupka u jednoj<strong>tipovani Gradle zadatak</strong>:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">./gradlew endSessionWorkspace → snapshot vision-archive ./gradlew endSessionProject → archive .agents/ ./gradlew endSessionReport → rapport multi-zones</code></pre> </div> </div> <div class="paragraph"> <p>La <strong>faza 3</strong>će modelirati proces završetka sesije kao<strong>graf stanja</strong>саhttps://github.com/langgraph4j/langgraph4j[LangGraph4j]:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">[Start] → [Inventaire fichiers modifiés] → [Classification RGPD] (nœud ONNX) → [Branchement par cercle] ├→ cercle 0 → snapshot → commit ├→ cercle 2 → anonymisation → commit ├→ cercle 4 → archive → commit └→ cercle 1 → commit configuration/ → [Rapport] → [End]</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj graf će biti verzioniran u CI/CD, izvršen pomoću Gradle, konfigurisan kroz GitHub Secrets dodataka. LLM više neće morati da odlučuje o rutiranju — graf to će uraditi.</p> </div> </div> </div> <div class="sect1"> <h2 id="_šta_ova_architektura_rešava_i_šta_ne_rešava">Šta ova architektura rešava (i šta ne rešava)</h2> <div class="sectionbody"> <div class="admonitionblock caution"> <table> <tr> <td class="icon"> <i class="fa icon-caution" title="🔒"></i> </td> <td class="content"> <div class="paragraph"> <p>Prostorna ontologija ne pokriva sve. Konvencije stila koda, imenovanje, izbor arhitektonskog dizajna — sve to ostaje u promptu. Šta prostorna ontologija rešava jeste<strong>sloj sigurnosti i vidljivosti</strong>gdje svaki bajt mora da živi, i ko može da ga vidi</p> </div> </td> </tr> </table> </div> <div class="paragraph"> <p>Ovo je konkretan doprinos koji ona nosi:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>* Није`git push`случан једног тајне* : тајне су у`configuration/<code>(krug 1). Javni projekti su u`foundry/</code>(круг 4). Ни једна пута не прелази кроз оба.</p> </li> <li> <p><strong>Нима пословног кода у подацима</strong> :`office/<code>sadrži neke</code>.adoc`, YAML, JSON sheme — ali ne`.kt`. Le `build.gradle.kts`Onaj ko tamo živi je skript potrošnje, ne poslovni kod.</p> </li> <li> <p><strong>Nema izraženog strateškog mišljenja</strong> : dokumenti vizije žive u tajnom vrtu (korijen izvan CVS). Snapshot su u`configuration/`(privatni sejf). Niko, čak i u proširenom krugu poverenja, ne čita genezu strategije.</p> </li> <li> <p><strong>Auto-priorisation</strong> : LLM praća deltu između relacione algebre (što postoji) i kartografija eksperata (što je potrebna). Sledeći razvojni zadatak nastaje iz ove delte.</p> </li> </ol> </div> </div> </div> <div class="sect1"> <h2 id="_закључак_архитектура_као_дискурс">Закључак: архитектура као дискурс</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ne stavim politički manifest u podnožje svojega sajta. Ne stavim etička pravila u moje upite. Poravnanje nije u tekstu — ono je u<strong>sistem fajlova</strong>.</p> </div> <div class="paragraph"> <p>Kada LLM radi u ovom prostoru, ne može da izbegne izlaganje tajne (putanja mu to zabranjuje). Ne može da pomiješa nastavni podatak sa izvornim kodom (fizička zona je drugačija). Ne može da zaboravi pravilo bezpečnosti od 80 000 tokena — jer pravilo nije u promptu, već je u`workspace/<code>→`configuration/</code>→<code>office/</code>→`foundry/`što svako čitanje datoteke reaktivira.</p> </div> <div class="paragraph"> <p>Ovo je principi <strong>secure by design</strong> primenjen na agentevo poravnanje: ne tražite od LLM da se seti pravila. Odradite da arhitektura čini grešku strukturalno nemoguću.</p> </div> <div class="paragraph"> <p>I na putu, to daje LLM-u ono što ni jedan prompt ne može da mu da: sposobnost da<strong>примати</strong>где он находится, что существует, чего не хватает — и на основе этого сделать вывод о том, что он должен делать.</p> </div> </div> </div> <div class="sect1"> <h2 id="_reference">Reference</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Статья о управљању агентом Eager/Lazy :<a href="../2026/0108_gouvernance_agent_opencode_eager_lazy_post.html">Управљање Агентом ИИ са AsciiDoc</a></p> </li> <li> <p>Članak o mecanizmu Hot/Warm/Cold :<a href="../2026/0110_mecanisme_backup_contexte_agent_post.html">Sliding Window i hladna val</a></p> </li> <li> <p>Статья о аудиту контекста:<a href="../2026/0111_audit_contexte_agent_post.html">Кад Ваша сопствена управа постаје проблем</a></p> </li> <li> <p>Članak o poređenju tri LLMs:<a href="../2026/0112_comparaison_kimi_glm_deepseek_long_contexte_plugin_gradle_opencode_post.html">DeepSeek-V4-Pro, Kimi K2.6, GLM-5.1</a></p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0113_integration_firebase_contact_form_post.html Wed, 29 Apr 2026 00:00:00 +0000 blog/2026/0113_integration_firebase_contact_form_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_scena_obrasac_koji_ne_čuva_ništa">Scena: obrasac koji ne čuva ništa</a> <ul class="sectlevel2"> <li><a href="#_nasledje_supabase">Nasledje Supabase</a></li> <li><a href="#_duplo_fantomsko_podnosenje">duplo fantomsko podnosenje</a></li> </ul> </li> <li><a href="#_zašto_firebase_umesto_supabase">Zašto Firebase umesto Supabase?</a></li> <li><a href="#_faza_1_kreiranje_firebase_projekta">Faza 1 : Kreiranje Firebase projekta</a> <ul class="sectlevel2"> <li><a href="#_inicijalizacija">Inicijalizacija</a></li> <li><a href="#_правила_безбедности_firestore">Правила безбедности Firestore</a></li> </ul> </li> <li><a href="#_faza_2_prepisati_javascript_za_slanje">Faza 2 : Prepisati JavaScript za slanje</a> <ul class="sectlevel2"> <li><a href="#_зависност_window_firebase">Зависност `window.<em>FIREBASE</em></a></li> <li><a href="#_novi_contact_js">Novi `contact.js</a></li> </ul> </li> <li><a href="#_faza_3_čišćenje_mrtvog_koda_supabase">Faza 3 : Čišćenje mrtvog koda Supabase</a></li> <li><a href="#_фаза_4_подеси_футер">Фаза 4 : Подеси футер</a></li> <li><a href="#_faza_5_konačna_arhitektura">Faza 5: Konačna arhitektura</a></li> <li><a href="#_šta_ova_migracija_kaže_o_dogfoodingu">Šta ova migracija kaže o dogfoodingu</a> <ul class="sectlevel2"> <li><a href="#_сажетак_промена">Сажетак промена</a></li> </ul> </li> <li><a href="#_sledeći_koraci_backlog">Sledeći koraci (backlog)</a></li> <li><a href="#_reference">Reference</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 12 minutes</div> <p>Mesecima, kontakt forma ovog sajta je radila na mock JavaScript-u — obećanje od 85 % uspeha, lažni Firestore, nula podataka skupljena. Početni plan je bio da se koristi Supabase backend sa Google Apps Script-om za e-mail obaveštenja. Otkazano. Danas pričam o migraciji na Firebase Firestore: kreiranje projekta, pravila bezbednosti, prepisanje JS koda, čišćenje mrtvog Supabase koda. I zašto ovaj izbor govori o nečem širim u vezi s filozofijom razvoja.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">tik</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_scena_obrasac_koji_ne_čuva_ništa">Scena: obrasac koji ne čuva ništa</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovaj sajt je generisan od strane JBake, moj Gradle plugin`bakery`. To je 100 % statično — bez bekenda, bez baze podataka. Osim što imam kontaktni obrazac. Stranica`contact.html`postoji, HTML je spreman (polja: ime, e‑mail, telefon, tema, poruka, HTML5 validacija, anti‑spam honeypot), Bootstrap stilovi su postavljeni. Vizuelno, sve je perfektnog.</p> </div> <div class="paragraph"> <p>Osim što pri podnosenju, ništa se ne dešava.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">const firebaseMock = new Promise((resolve, reject) => { setTimeout(() => { if (Math.random() < 0.85) { resolve({ status: 201, message: 'Message stored in Firestore.' }); } else { reject({ status: 500, message: 'Firestore write failed.' }); } }, 1500); });</code></pre> </div> </div> <div class="paragraph"> <p>Један макет. Обећање које претприча. Корисник види спинер, затим поруку « Порука је uspeшно послата! ». Но подаци улазе у ништа. Никаква порука није чувана нигде.</p> </div> <div class="paragraph"> <p>Situacija je gora od pokvarenog obrasca — to je obrasac koji laže.</p> </div> <div class="sect2"> <h3 id="_nasledje_supabase">Nasledje Supabase</h3> <div class="paragraph"> <p>Početni plan, dokumentovan u`content/draft/integration_formulaire_contact_supabase.adoc`, mislio je:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>jedna Supabase baza sa tabelom`contacts`i Row Level Security</p> </li> <li> <p>Jedna RPC`handle_contact_form`страна сервера</p> </li> <li> <p>SQL trigger koji poziva webhook Google Apps Script</p> </li> <li> <p>Google Apps Script koji šalje obaveštenje e‑mail putem Gmail</p> </li> </ol> </div> <div class="paragraph"> <p>Соответни JavaScript код још увек постоји у`script.js`. Ima jednu klasu`SupabaseManager`qui inicijalizuje klijent Supabase sa globalnim promenljivama`SUPABASE_URL` et <code>SUPABASE_KEY</code>, i jedna klasa`ContactFormHandler`koji sluša submit događaj forme i poziva`SupabaseManager.submitContactForm()`.</p> </div> <div class="paragraph"> <p>Problem: ove globalne promenljive više nisu ubacene u futer. Le`<script src="supabase-js">`je uklonjen. Kod poziva`supabase.createClient()`на променљивој`supabase`Koji više ne postoji. Zato:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">console.error : 'Supabase client library (supabase-js) is not loaded.'</code></pre> </div> </div> <div class="paragraph"> <p>Ni podaci nisu skladišteni, nego i kod za slanje je mrtav.</p> </div> </div> <div class="sect2"> <h3 id="_duplo_fantomsko_podnosenje">duplo fantomsko podnosenje</h3> <div class="paragraph"> <p>Da stvari postanu gore, ima jedna<strong>tiha konkurencija</strong></tool_call> dva handleri na istom formularu:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>`contact.js`слушај сабмит, позови мок Firebase</p> </li> <li> <p><code>script.js</code>— putem`ContactFormHandler`— слушај и submit, зови`SupabaseManager`</p> </li> </ol> </div> <div class="paragraph"> <p>Oba rade`event.preventDefault() + event.stopPropagation()<code>. kao`contact.js`је учитаван први у`footer.thyme</code>, njegov handler je povezan kao prvi. On blokira propagaciju.`ContactFormHandler`nikada neće biti pokrenut.</p> </div> <div class="paragraph"> <p>Nije ni aktivan bug — to je zombi. Kod koji nikada nema priliku da se izvrši.</p> </div> <div id="diag-before" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE title Почетно Стање — Контактна Форма rectangle "contact.thyme\n(HTML Bootstrap, honeypot)" as FORM rectangle "footer.thyme\n(Firebase SDK sa placeholder-om za konfiguraciju)" as FOOT rectangle "contact.js\n(mock Firebase, 85% uspeh)" as CONT rectangle "script.js (SupabaseManager + ContactFormHandler, mrti)" as SCRIPT rectangle "Корисник" as USER USER -> FORM : Soumission du formulaire FORM -> CONT : submit event (attaché en premier) CONT -> CONT : preventDefault + stopPropagation CONT -> CONT : mock Promise (1.5s, aléatoire) note right of CONT ⚠️ Aucune donnée stockée end note FORM ..> SCRIPT : submit event (bloqué par stopPropagation) note right of SCRIPT : ❌ Jamais déclenché note right of SCRIPT : ❌ supabase-js non chargé @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_firebase_umesto_supabase">Zašto Firebase umesto Supabase?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Odluka o migraciji je dokumentovana u`AGENT.adoc` :</p> </div> <div class="paragraph"> <p>Firebase se bira iz sledećih razloga: bolji besplatan plan, natívni Firestore, integrisani Cloud Functions i bolje prilagođen Googleov ekosistem. Postojeća Supabase implementacija je označena kao « ⚠️ Opustena ».</p> </div> <div class="paragraph"> <p>Osim besplatnog plana, postoji arhitektonski razlog. Ovaj sajt živi u Google ekosistemu: ciljni depozitar je`cheroliv.github.io`, CNAME pokazuje na GitHub Pages, Gradle build push na GitHub preko JGit. Dodavanje usluge Google (Firebase) umesto usluge treće strane (Supabase) smanjuje površinu rasipanja.</p> </div> <div class="paragraph"> <p>Firestore u nativnom režimu (nije u Datastore režimu) je i bliže mentalnom modelu NoSQL dokumenta koji imam na umu: kolekcije, dokumenti, tipirana polja, vremenske oznake servera, integrirana pravila bezbednosti.</p> </div> </div> </div> <div class="sect1"> <h2 id="_faza_1_kreiranje_firebase_projekta">Faza 1 : Kreiranje Firebase projekta</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_inicijalizacija">Inicijalizacija</h3> <div class="paragraph"> <p>Firebase CLI nije instalirana na mojem računaru, pa prelazim na web konzolu:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Ићи наhttps://console.firebase.google.com/[Firebase konzola]</p> </li> <li> <p>Kreiraj projekat`cheroliv-contact`(ili ponovo koristiti postojeći projekat)</p> </li> <li> <p>Uključi Firestore u nativnom načinu (nije Datastore)</p> </li> <li> <p>Kreirati bazu podataka u regionu`eur3`(Evropa)</p> </li> </ol> </div> <div class="paragraph"> <p>Za minimalističku upotrebu kao naša (jedna kolekcija, javno pisanje), natprirodni mod je pravi izbor. Nema potrebe za kompleksnim pravilima Datastore.</p> </div> </div> <div class="sect2"> <h3 id="_правила_безбедности_firestore">Правила безбедности Firestore</h3> <div class="paragraph"> <p>Formular je javn — bilo ko može poslati poruku. Ali želim ograničiti zlouporabe :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">rules_version = '2'; service cloud.firestore { match /databases/{database}/documents { match /contact_messages/{messageId} { // Lecture : admin uniquement (authentifié) allow read: if request.auth != null; // Écriture : publique, mais limitée allow create: if request.auth == null && request.resource.data.name is string && request.resource.data.name.size() >= 1 && request.resource.data.name.size() <= 100 && request.resource.data.email is string && request.resource.data.email.matches('.*@.*\\..*') && request.resource.data.email.size() <= 254 && request.resource.data.subject is string && request.resource.data.subject.size() >= 3 && request.resource.data.subject.size() <= 200 && request.resource.data.message is string && request.resource.data.message.size() >= 10 && request.resource.data.message.size() <= 5000 && request.resource.data.created_at == request.time && request.resource.data.user_agent is string && request.resource.data.user_agent.size() <= 500; } } }</code></pre> </div> </div> <div class="paragraph"> <p>Ključne tačke:</p> </div> <div class="ulist"> <ul> <li> <p><code>allow read</code>— samo autentifikovani korisnici mogu čitati poruke (ja, preko Firebase konzole)</p> </li> <li> <p><code>allow create</code>— svako može da kreira dokument, ali sa validacijom polja</p> </li> <li> <p>Validacija na serveru: minimalne/maksimalne veličine, format e-pošte,<code>created_at`mora da odgovara na`request.time</code>(anti-falsifikacija)</p> </li> <li> <p>`user_agent`se šalje za trazabilnost (nije kritično, ali je korisno)</p> </li> </ul> </div> <div class="paragraph"> <p>Ova pravila su stroža nego jednostavno`allow write: if true;`. Spriječavaju napadaču da injektira ogromne payload-e ili loše formirane polja.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_faza_2_prepisati_javascript_za_slanje">Faza 2 : Prepisati JavaScript za slanje</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ugovor je jednostavan:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Прочитај податке формулара</p> </li> <li> <p>Проверити honeypot (polje`hp_name`— ako je popunjeno, to je bot, simuliramo uspeh bez slanja čega)</p> </li> <li> <p>pozivati`addDoc(window.<em>FIREBASE</em>.collection(db, "contact_messages"), {…​})`</p> </li> <li> <p>Prikaži uspeh ili grešku</p> </li> </ol> </div> <div class="sect2"> <h3 id="_зависност_window_firebase">Зависност `window.<em>FIREBASE</em></h3> <div class="paragraph"> <p>У`footer.thyme`, jedan skript modul inicijalizuje Firebase SDK i izlaže globalni objekat :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><script type="module"> import { initializeApp } from "https://www.gstatic.com/firebasejs/11.6.0/firebase-app.js"; import { getFirestore, collection, addDoc, serverTimestamp } from "https://www.gstatic.com/firebasejs/11.6.0/firebase-firestore.js"; const firebaseConfig = { /* valeurs réelles */ }; const app = initializeApp(firebaseConfig); const db = getFirestore(app); window.__FIREBASE__ = { db, collection, addDoc, serverTimestamp }; </script></code></pre> </div> </div> <div class="paragraph"> <p>Skriptovi modula se izvršavaju pre`DOMContentLoaded`, zato`window.<em>FIREBASE</em>`garantirano je dostupno kad handler`contact.js`se pokreće. Iz mere opreznosti, ja ipak dodajem polling od 5 sekundi u slučaju da CDN bude spor.</p> </div> </div> <div class="sect2"> <h3 id="_novi_contact_js">Novi `contact.js</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">document.addEventListener('DOMContentLoaded', function () { 'use strict'; const form = document.getElementById('contact-form'); if (!form) return; const submitButton = form.querySelector('button[type="submit"]'); const successMessage = document.getElementById('contact-success-message'); const errorMessage = document.getElementById('contact-error-message'); // Éléments de validation const nameInput = form.querySelector('input[name="name"]'); const emailInput = form.querySelector('input[name="email"]'); const phoneInput = form.querySelector('input[name="phone"]'); const subjectInput = form.querySelector('input[name="subject"]'); const messageInput = form.querySelector('textarea[name="message"]'); const honeypotInput = form.querySelector('input[name="hp_name"]'); /** * Attend que window.__FIREBASE__ soit disponible. * Timeout de 5 secondes — si le CDN Firebase est lent, on abandonne. */ function waitForFirebase(timeoutMs = 5000) { return new Promise((resolve, reject) => { if (window.__FIREBASE__) { resolve(window.__FIREBASE__); return; } const start = Date.now(); const interval = setInterval(() => { if (window.__FIREBASE__) { clearInterval(interval); resolve(window.__FIREBASE__); } else if (Date.now() - start > timeoutMs) { clearInterval(interval); reject(new Error('Firebase SDK non disponible après timeout')); } }, 100); }); } // --- Validation (identique à l'existant) --- function validateForm() { nameInput.setCustomValidity(''); emailInput.setCustomValidity(''); if (phoneInput) phoneInput.setCustomValidity(''); subjectInput.setCustomValidity(''); messageInput.setCustomValidity(''); if (nameInput.value.trim().length < 1) { nameInput.setCustomValidity('Veuillez saisir votre nom.'); } const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; if (!emailPattern.test(emailInput.value.trim())) { emailInput.setCustomValidity('Veuillez saisir une adresse email valide.'); } if (phoneInput && phoneInput.value.trim() !== '') { const phonePattern = /^\d{10,15}$/; if (!phonePattern.test(phoneInput.value.trim())) { phoneInput.setCustomValidity('Veuillez saisir un numéro valide (10 à 15 chiffres).'); } } if (subjectInput.value.trim().length < 3) { subjectInput.setCustomValidity('Veuillez saisir un sujet (3 caractères minimum).'); } if (messageInput.value.trim().length < 10) { messageInput.setCustomValidity('Veuillez saisir un message (10 caractères minimum).'); } form.classList.add('was-validated'); return form.checkValidity(); } // --- Handler de soumission --- form.addEventListener('submit', async function (event) { event.preventDefault(); event.stopPropagation(); if (!validateForm()) return; // Honeypot : si rempli, simuler un succès sans rien envoyer if (honeypotInput && honeypotInput.value.trim() !== '') { successMessage.style.display = 'block'; form.reset(); form.classList.remove('was-validated'); return; } // UI : état d'envoi submitButton.disabled = true; submitButton.innerHTML = ` <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Envoi en cours... `; successMessage.style.display = 'none'; errorMessage.style.display = 'none'; try { const fb = await waitForFirebase(); const messagesCollection = fb.collection(fb.db, 'contact_messages'); await fb.addDoc(messagesCollection, { name: nameInput.value.trim(), email: emailInput.value.trim(), phone: phoneInput ? phoneInput.value.trim() : '', subject: subjectInput.value.trim(), message: messageInput.value.trim(), created_at: fb.serverTimestamp(), user_agent: navigator.userAgent.substring(0, 500) }); successMessage.style.display = 'block'; form.reset(); form.classList.remove('was-validated'); } catch (error) { console.error('Erreur Firestore:', error); errorMessage.style.display = 'block'; } finally { submitButton.disabled = false; submitButton.innerHTML = ` <i class="bi bi-send me-2"></i> Envoyer le Message `; } }, false); });</code></pre> </div> </div> <div class="paragraph"> <p>Измене у односу према макету :</p> </div> <div class="ulist"> <ul> <li> <p><code>waitForFirebase()</code>— polling sa timeoutom, robustan čak i ako je CDN sporo</p> </li> <li> <p><code>honeypot</code>— ako je skriveno polje`hp_name`je pun, simulirati odlučivan uspeh Firestore. Bot misli da je uspeo, ali ništa nije skladišteno.</p> </li> <li> <p><code>addDoc(collection, {…​})</code>— prav poziv Firestore sa`serverTimestamp()` et <code>user_agent</code></p> </li> <li> <p>Упретње грешке са`try/catch`асинхрон</p> </li> <li> <p>Чишћење`finally`(обнова дугмета)</p> </li> </ul> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p>Зашто`user_agent`? To je opcionalno, ali korisno za dijagnostiku. Ako dodje seltska poruka, znati da li dolazi iz desktop pregledača, mobilnog uređaja ili skripta curl pomaže u razvrstavanju.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_faza_3_čišćenje_mrtvog_koda_supabase">Faza 3 : Čišćenje mrtvog koda Supabase</h2> <div class="sectionbody"> <div class="paragraph"> <p>`script.js`sadrži 250 redova mrtvog koda:</p> </div> <div class="ulist"> <ul> <li> <p><code>SupabaseManager</code>(линије 417-481) — 65 линија</p> </li> <li> <p><code>ContactFormHandler</code>(линије 490-551) — 62 линија</p> </li> <li> <p>Blok inicijalizacije (redovi 645-654) — 10 redova</p> </li> </ul> </div> <div class="paragraph"> <p>Ukupno: ~140 linije koje treba izbrisati.</p> </div> <div class="paragraph"> <p>Блок`DOMContentLoaded`kreirao jedan`SupabaseManager`zatim jedan`ContactFormHandler`Прикључен на формулар. Како је објашњено изнад, овај код се никогда не извршава (блокиран од`contact.js`), i čak ako bi se izvršio, ne bi uspio (Supabase SDK nije učitan).</p> </div> <div class="paragraph"> <p>Brišem:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>класа`SupabaseManager`</p> </li> <li> <p>klasa`ContactFormHandler`</p> </li> <li> <p>Блок иницијализације у`DOMContentLoaded`(linije 645-654)</p> </li> </ol> </div> <div class="paragraph"> <p>Le reste de <code>script.js`је непоређен :`ThemeManager</code>, <code>ScrollToTopButton</code>, <code>MobileMenuManager</code>, <code>SmoothScrollWithOffset</code>, <code>NavbarHeightUpdater</code>, <code>DynamicNavbarBreakpoint</code>, <code>CodeBlockManager</code>, <code>TooltipManager</code>, <code>PhoneInputManager</code>.</p> </div> </div> </div> <div class="sect1"> <h2 id="_фаза_4_подеси_футер">Фаза 4 : Подеси футер</h2> <div class="sectionbody"> <div class="paragraph"> <p>`footer.thyme`Већ има boilerplate Firebase но с placeholder вредностма. Замењујем :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">const firebaseConfig = { apiKey: "REMPLACER_PAR_VOTRE_API_KEY", authDomain: "REMPLACER_PAR_VOTRE_AUTH_DOMAIN", projectId: "REMPLACER_PAR_VOTRE_PROJECT_ID", storageBucket: "REMPLACER_PAR_VOTRE_STORAGE_BUCKET", messagingSenderId: "REMPLACER_PAR_VOTRE_SENDER_ID", appId: "REMPLACER_PAR_VOTRE_APP_ID" };</code></pre> </div> </div> <div class="paragraph"> <p>Одизна реалне вредности добијене од<strong>Postavke projekta > Opšte > Vaše aplikacije > Web aplikacija</strong>u konzoli Firebase.</p> </div> <div class="paragraph"> <p>Vrednosti su osetljive`apiKey`jest javna po dizajnu kod Firebase, preferiram ne ih commitovati ). Je ih čuvam u`site.yml`(већ у`.gitignore`) и dodatak`bakery`injicira u šablon preko logike koju treba dodati na strani builda.</p> </div> <div class="paragraph"> <p>Za sada, ih stavim direktno u`footer.thyme`— izgradnja`./gradlew serve`će ih učitati lokalno. При deploy-ovanju, ću premestiti injekciju ka`site.yml`ili ka Gradle promenljivoj.</p> </div> <div class="admonitionblock warning"> <table> <tr> <td class="icon"> <i class="fa icon-warning" title="Warning"></i> </td> <td class="content"> <div class="paragraph"> <p>L'`apiKey`Firebase nije<strong>корак</strong>nije tajna. Ona je javna po dizajnu. Šta štiti vaše podatke, su<strong>pravila bezbednosti Firestore</strong>, ne je ključ API. Ne ga stavite u`.env`Ukrcano na serveru — namenjeno je da se izloži u pregledaču.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_faza_5_konačna_arhitektura">Faza 5: Konačna arhitektura</h2> <div class="sectionbody"> <div id="diag-after" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE title Конačна архитектура — Форма контакта Firebase actor Utilisateur as USER package "Прегледач" #E8F5E9 { rectangle "contact.thyme\n(HTML, honeypot)" as FORM rectangle "contact.js (validacija + Firestore)" as CONT rectangle "footer.thyme (Pokretanje Firebase SDK)" as FOOT } cloud "Firebase" #BBDEFB { rectangle "Firestore (contact_messages)" as FS } FORM --> CONT : submit event CONT --> FOOT : window.__FIREBASE__.addDoc() FOOT --> FS : Insert document\n(règles de sécurité validées) note right of FS Firestore Rules : - create: public, validé - read: auth uniquement end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_šta_ova_migracija_kaže_o_dogfoodingu">Šta ova migracija kaže o dogfoodingu</h2> <div class="sectionbody"> <div class="paragraph"> <p>Овај сайт је генерисан мојем сопсним Gradle додатком`bakery`. Oblik za kontakt živi unutar sajta. Migracija Supabase → Firebase je dokumentirana u`AGENT.adoc`, ona je diskutovana u backlogu, ona je testirana putem`./gradlew serve`, i ona generiše članak na blogu (koji čitate).</p> </div> <div class="paragraph"> <p>Sajt je proizvod plugina, plugin je proizvod razvojnog programera, a razvojni programer dokumentuje proces na samom sajtu.</p> </div> <div class="paragraph"> <p>Petlja je zatvorena.</p> </div> <div class="paragraph"> <p>Čin da sam dugoročno nosio mock (cijeli sesiji u koji je obrazac ticho lažio) učinio mi je da se uočim nešto: backlog ličnog statičkog sajta nikada nije «završen». Uvijek je jedna prioritetna US, uvijek jedan članak u nacrtu, uvijek jedna komentarisana sekcija u šablonu. Disciplina nije sve završiti — već završiti ono što je vidljivo korisniku.</p> </div> <div class="paragraph"> <p>Pokvareni kontakt obrazac, to je gore nego da nema nikakvog obrazca. To je neispunjeno obećanje.</p> </div> <div class="sect2"> <h3 id="_сажетак_промена">Сажетак промена</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6676%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Fajl</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Измена</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">uticaj</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>blog/2026/0113_*.adoc</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Креирање статка</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Документација</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>assets/js/contact.js</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Prepisivanje (mock → stvarni Firestore)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">функционалан</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>assets/js/script.js</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Брисање SupabaseManager + ContactFormHandler + init bloc</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Čišćenje</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>templates/footer.thyme</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Zamena placeholder-a za konfiguraciju → stvarne vrednosti</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Конфигурација</p></td> </tr> </tbody> </table> </div> </div> </div> <div class="sect1"> <h2 id="_sledeći_koraci_backlog">Sledeći koraci (backlog)</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><strong>Obaveštenje putem e‑maila</strong>: Jedna Cloud Function`onCreate`na`contact_messages`koji šalje e-mail putem SendGrid. Forma se čuva, ali ne dobijam obaveštenje. Srednji prioritet — poruke su vidljive u Firebase konzoli.</p> </li> <li> <p><strong>Rate limiting na klijentskoj strani</strong>: Додај timestamp у localStorage за sprečavanje višestrukog slanja u nizu. Honeypot blokira naivne botove, a rate limiter bi blokirao bolje prateće botove.</p> </li> <li> <p><strong>Тестови</strong>: Test Playwright koji šalje formu i proverava da li se dokument pojavljuje u Firestore. Trenutno testiram rukom putem`./gradlew serve`.</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_reference">Reference</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="https://firebase.google.com/docs/firestore/security/get-started">Dokumentacija pravila bezbednosti Firestore</a></p> </li> <li> <p><a href="https://firebase.google.com/docs/firestore/manage-data/add-data#add_a_document">Документација Firestore addDoc — Веб v9 модулар</a></p> </li> <li> <p><a href="/blog/2026/0108_gouvernance_agent_opencode_eager_lazy_post.html">Serija upravljanja agenta — Deo 1: Eager/Lazy</a></p> </li> <li> <p><a href="/blog/2026/0110_mecanisme_backup_contexte_agent_post.html">Serija agenti upravljanja — Deo 2: Hot/Warm/Cold</a></p> </li> <li> <p><a href="/blog/2026/0111_audit_contexte_agent_post.html">Serija upravljanja agentom — Deo 3: Revizija</a></p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0112_comparaison_kimi_glm_deepseek_long_contexte_plugin_gradle_opencode_post.html Tue, 28 Apr 2026 00:00:00 +0000 blog/2026/0112_comparaison_kimi_glm_deepseek_long_contexte_plugin_gradle_opencode_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_kontekst_nije_poligon_za_testiranje_već_gradilište">Kontekst: nije poligon za testiranje, već gradilište.</a></li> <li><a href="#_moje_testno_okruženje">Moje testno okruženje</a></li> <li><a href="#_табела_за_оцене">Табела за оцене</a></li> <li><a href="#_krug_1_kimi_k2_6_lažni_početak">Krug 1 : Kimi K2.6 — Lažni Početak</a> <ul class="sectlevel2"> <li><a href="#_sesija_9_uspon">Sesija 9 : uspon</a></li> <li><a href="#_сесија_10_тихо_потопљење">Сесија 10: тихо потопљење</a></li> </ul> </li> <li><a href="#_krug_2_glm_5_1_počasni_borac">Krug 2: GLM-5.1 — Počasni borac</a> <ul class="sectlevel2"> <li><a href="#_архитектура_dsa_против_чист_mla">Архитектура: DSA против чист MLA</a></li> <li><a href="#_sesije_11_13_vrstan_ali_frustrujući">Sesije 11-13 : vrstan ali frustrujući</a></li> </ul> </li> <li><a href="#_krug_3_deepseek_v4_pro_mašina_za_rat">Krug 3: DeepSeek-V4-Pro — Mašina za rat</a> <ul class="sectlevel2"> <li><a href="#_arhitektura_csa_hca_dvostruka_nit">Arhitektura : CSA + HCA, dvostruka nit</a></li> <li><a href="#_sednice_1_8_olaksica">Sednice 1-8: olaksica</a></li> <li><a href="#_odlučni_test_refaktoring_na_100k_tokena">Odlučni test : refaktoring na 100K tokena</a></li> </ul> </li> <li><a href="#_lice_u_lice_poredbene_metrike">Lice u lice : Poredbene metrike</a></li> <li><a href="#_zašto_deepseek_v4_pro_pobjeđuje_u_razvoju_softvera">Zašto DeepSeek-V4-Pro pobjeđuje u razvoju softvera</a> <ul class="sectlevel2"> <li><a href="#_arhitektura_csahca_je_prilagođena_kodu">Arhitektura CSA+HCA je prilagođena kodu</a></li> <li><a href="#_2_kontekst_eager_je_njegova_zona_komfora">2. Kontekst EAGER je njegova zona komfora</a></li> <li><a href="#_3_odnos_kvalitetlatencija_je_optimalan_za_tok">3. Odnos kvalitet/latencija je optimalan za tok</a></li> </ul> </li> <li><a href="#_naučene_lekcije_kako_izabrati_svoj_llm_za_vibe_coding">Naučene lekcije: Kako izabrati svoj LLM za Vibe Coding</a></li> <li><a href="#_и_агент_за_управљање_у_све_то">И агент за управљање у све то?</a></li> <li><a href="#_tehnički_izvori">tehnički izvori</a></li> <li><a href="#_zaključak_izbor_majstora">Zaključak: Izbor majstora</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">Vreme za čitanje : 18 minutes</div> <p>Rat LLM-ova se odvija i u terminalu programera. Ne na akademskim bezplodnim benchmarkovima. U stvarnom životu: prompt od 30 000 tokena, upravljanje agenta u AsciiDoc, Gradle Kotlin DSL pluginovi koje treba ispraviti i sesije koje se nastavljaju tri nedelje. Testirao sam za vas DeepSeek-V4-Pro, Kimi K2.6 i GLM-5.1. Evo veredicta, podržan tehničkim dokazima.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">тик</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_kontekst_nije_poligon_za_testiranje_već_gradilište">Kontekst: nije poligon za testiranje, već gradilište.</h2> <div class="sectionbody"> <div class="paragraph"> <p>Prije tri tjedna, radio sam na`codebase-gradle`, moj meta-build sistem koji centralizuje YAML konfiguraciju četiri projekta: generator README-a PlantUML, gradivac slajdova AsciiDoc, statički sajt JBake i chatbot LLM. Agent Opencode, upravljajući mojom metodologijom datoteka agente u AsciiDoc-u, učitavao je ~30K tokena EAGER konteksta na početku svakog sesije — apsolutna pravila, backlog, istorija poslednjih 10 sesija.</p> </div> <div class="paragraph"> <p>Na ovom terenu sam se suočio sa tri modela:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Kimi K2.6</strong>(Moonshot AI, 1T parametara / 32B aktivirani, 256K maksimalni kontekst, MLA) - <strong>GLM-5.1</strong>(Zhipu AI/Tsinghua, 744B parametara / DSA, maksimalni kontekst 200K) - <strong>DeepSeek-V4-Pro</strong>(DeepSeek, 1.6T parametara / 49B aktiviranih, 1M kontekst max, CSA+HCA)</p> </li> </ul> </div> <div class="paragraph"> <p>Svi servisi putem Ollama na cloud serveru, svi u modu razmišljanja (aktivirana faza refleksije). Izazov: da se producira ispravan kod, da se održava konzistentnost tokom dugih sesija, i da se ne halluciniše kada kontekst prelazi 80K tokena.</p> </div> </div> </div> <div class="sect1"> <h2 id="_moje_testno_okruženje">Moje testno okruženje</h2> <div class="sectionbody"> <div id="diag-dev-env" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam wrapWidth 220 title Тест окружење — Сессии Opencode × 3 LLMs left to right direction package "🖥️ Terminal developera" #E8F5E9 { rectangle "AGENT.adoc\n(pravila, backlog)" as AG rectangle "PROMPT_REPRISE\n(misija)" as PR rectangle "INDEX.adoc (plan razvoja)" as IDX } package "☁️ Ollama облако" #BBDEFB { rectangle "DeepSeek-V4-Pro\n1.6T / CSA+HCA" as DV4 rectangle "Kimi K2.6\n1T / MLA" as KIMI rectangle "GLM-5.1 744B / MLA+DSA" as GLMG } package "⚙️ Osnova Gradle" #FFF9C4 { folder "buildSrc/" { file "codebase.kt" file "readme.kt" file "site.kt" file "slider.kt" file "snapshot.kt" } file "build.gradle.kts (947 linije)" file "embeds.yml" } AG --> DV4 : Sessions 1-8 ✅ AG --> KIMI : Sessions 9-10 ⚠️ AG --> GLMG : Sessions 11-13 ⚠️ DV4 --> "osnova koda" : "TDD, refaktoring, snapshot" KIMI --> "osnova koda" : "Degradation od 60K tokena" note bottom of GLMG Meilleur que Kimi mais latence + DSA moins robuste que CSA+HCA end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Svaka sesija je započela sa oko 30K tokena EAGER konteksta :`AGENT.adoc`(287 linija),<code>PROMPT_REPRISE.adoc</code>(51 linija),<code>.agents/INDEX.adoc</code>(218 linija),<code>LAZY_EAGER_ESSENTIALS.adoc</code>(50 linija). Kontekst se brzo povećavao sa razmenom — tipična sesija od 10 poruka dodavala je 15-20K tokena kumulativnom promptu.</p> </div> </div> </div> <div class="sect1"> <h2 id="_табела_за_оцене">Табела за оцене</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ocenio sam svaki model po četiri kritične ose za podržani razvoj softvera:</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">sekira</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">konkretan kriterijum</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Kohezija dugog konteksta</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Da li se agent sjeća konvencija koje su odlučene pre 40 poruka?</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Kvalitet proizvedenog koda</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Da li kod kompajlira od prvog puta? Da li poštuje posteće obrasci?</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Arhitektonsko razmišljanje</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Da li agent razumije odnose između modula bez da mu ih ponovo objasnim?</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Опорност против халцинација</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Од колико токена агент почето да измишља непостаojeће АПИ или класе?</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>И домаћа синтетичка метрика: о<strong>koeficijent oporavka</strong>(koliko vremena provodim ispravljujući agenta umesto da kodiram s njim)</p> </div> </div> </div> <div class="sect1"> <h2 id="_krug_1_kimi_k2_6_lažni_početak">Krug 1 : Kimi K2.6 — Lažni Početak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kimi K2.6 je bio moj prvi izbor. Njegovi benchmarki na SWE-Bench Verified (80.2) i Terminal-Bench 2.0 (66.7) su odlični. Njegova MLA arhitektura obećava dobru efikasnost na dugim sekvencama.</p> </div> <div class="sect2"> <h3 id="_sesija_9_uspon">Sesija 9 : uspon</h3> <div class="paragraph"> <p>Прва сесија са Кими. Задатак: имплементирати метод`resolveActiveKey()<code>u`codebase.kt</code>— функција за решавање API кључа са резервном CLI. Контекст је 30K токена, Kimi brzо размишља, произвођа чисти код са управљањем истецом кључева.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">fun resolveActiveKey( cfg: CodebaseConfiguration, logger: Logger, cliProvider: String? = null, cliAccount: String? = null, cliKey: String? = null ): NamedApiKey? { // Résolution provider → compte → clé avec CLI override // Kimi a parfaitement compris la chaîne de priorité }</code></pre> </div> </div> <div class="paragraph"> <p>Код компајлира. Сви 7 тест случаја prolaze. Оптимистичан сам.</p> </div> </div> <div class="sect2"> <h3 id="_сесија_10_тихо_потопљење">Сесија 10: тихо потопљење</h3> <div class="paragraph"> <p>Druga sesija. Kontekst raste na ~90K tokena sa razmenama. Tražim od Kimi da doda mekanizam snapshot AsciiDoc koji anonimizuje tajne pre pisanja.</p> </div> <div class="paragraph"> <p>Ovo je gde sve kreće po sravi. Kimi počinje da izmišlja klase koje ne postoje. On mi ponuđuje.<code>AnonymizedObjectMapper</code>— fiktivna klasa. On miješa`ReadmeYmlAnonymizer` et <code>CodebaseYmlAnonymizer</code>. Mi predlaže da uvezem.<code>com.fasterxml.jackson.anonymize.*</code>— paket koji nikada nije postojao.</p> </div> <div class="paragraph"> <p>Pire: u fazi njegove razmišljanja, vidim da gradi zaključke na lažnim pretpostavkama. Il "se seća" que`GitConfig`ima polje`anonymizedToken`— ne, to je`resolvedToken()<code>On pripisuje`SiteYmlAnonymizer`jedna metoda`maskSupabaseCredentials()</code>— koji ne postoji.</p> </div> <div class="paragraph"> <p>(blank) Није било грешка. Б је било постепно растворење саглашености. Као да је сваки додатни токен у контексту разјединио мало више меморије првих 30 000. <em>__</em></p> </div> <div class="paragraph"> <p>Zaustavljam Kimi nakon dva sesija. Dijagnoza je jasna: MLA dobro kompresuje KV keš, ali bez mehanizma finog sparse selektovanja, pažnja se mehanički rjeđešava iznad 60K tokena. Svaki token "vidi" sve manje i manje dobro udaljeni kontekst — i počinje da popunjava rupe šumom.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_krug_2_glm_5_1_počasni_borac">Krug 2: GLM-5.1 — Počasni borac</h2> <div class="sectionbody"> <div class="paragraph"> <p>GLM-5.1 dolazi sa različitom arkitekturom: MLA za bazni model, zatim <strong>continued pre-training</strong> sa DSA (DeepSeek Sparse Attention) — lagani indeksator koji dinamički bira najbolje relevantnih top-2048 tokena iz celog istorija.</p> </div> <div class="sect2"> <h3 id="_архитектура_dsa_против_чист_mla">Архитектура: DSA против чист MLA</h3> <div class="paragraph"> <p>Razlika je temeljna. Gde Kimi kompresuje istoriju u jedinstvenom latentnom prostoru (i postupno gubi sposobnost da razlikuje relevantne informacije), GLM dodaje post‑entrenacioni indekser koji vrši eksplicitnu sparse selekciju.</p> </div> <div id="diag-mla-vs-dsa" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title python print("Архитектуре Attention — MLA vs MLA+DSA", end='') left to right direction rectangle "**Kimi K2.6 — MLA čist**" as MLA #FFCDD2 { rectangle "KV Cache kompletan" as KV1 rectangle "Компресија латентна" as CL1 rectangle "Dekodiranje\nna latentnom prostoru" as DL1 KV1 --> CL1 CL1 --> DL1 note bottom of DL1 ⚠️ Au-delà de 60K tokens : perte de discrimination end note } rectangle "GLM-5.1 — MLA + DSA" as DSA #C8E6C9 { rectangle "KV Cache kompletan" as KV2 rectangle "Latentna\nkompresija (MLA)" as CL2 rectangle "Lahki indekser (DSA, top-k=2048)" as IL rectangle "Декодирање на избраних токенима" as DL2 KV2 --> CL2 CL2 --> IL IL --> DL2 note bottom of DL2 ✅ "Bez gubitka po konstrukciji" Sélection explicite des tokens pertinents end note } MLA --> DSA : "Dobit: sparse selekcija koja sprečava rijedenje" @enduml</pre> </div> </div> <div class="paragraph"> <p>Tehnički izveštaj jasno tvrdi: DSA je <em>"lossless by construction"</em> — suprotno tome od alternativa kao što su SWA (pattern search), Gated DeltaNet ili SimpleGDN koje gube do 5.69 pts na RULER@128K.</p> </div> </div> <div class="sect2"> <h3 id="_sesije_11_13_vrstan_ali_frustrujući">Sesije 11-13 : vrstan ali frustrujući</h3> <div class="paragraph"> <p>GLM-5.1 bolje drži udaljenost. Na sesiji 11 (~60K tokena), ostaje koherentan. proizvodi jedan`SnapshotManager`funkcionalno sa ispravnim upravljanjem četiri anonymizatora</p> </div> <div class="paragraph"> <p>Ali latencija je problem. Faze razmišljanja DSA su teže od čistog MLA — indekser mora da ponovo proskenira istoriju na svakom koraku. Odgovor koji je trajao 8 sekundi kod Kimija uzima 15 sekundi kod GLM. U sesiji od 30 poruka, to se osjeća.</p> </div> <div class="paragraph"> <p>I onda ima subtile greške. GLM ne halucinise kao Kimi — ali pravi greške u <strong>imenovanju</strong>. On naziva`toAnonymizedYaml()<code>metoda koja bi trebalo da se zove`anonymize()</code>. On inveruje`loadReadmeConfiguration()` et <code>loadCodebaseConfiguration()`у`renderFileSection()</code>. Ovo nisu halucinacije, to su površinske zbune — ali u proizvodnji, jedna površinska zbuna može razbiti build.</p> </div> <div class="paragraph"> <p>Održao sam tri sesije sa GLM. On je bolji od Kimija, bez sumnje. Ali tri sesije ručne korekcije detalja imenovanja, to mi je iznerviralo.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_krug_3_deepseek_v4_pro_mašina_za_rat">Krug 3: DeepSeek-V4-Pro — Mašina za rat</h2> <div class="sectionbody"> <div class="paragraph"> <p>DeepSeek-V4-Pro dolazi sa najambicioznijom arhitekturom od tri: hibridni sistem koji kombinuje dva komplementarna mehanizma pažnje.</p> </div> <div class="sect2"> <h3 id="_arhitektura_csa_hca_dvostruka_nit">Arhitektura : CSA + HCA, dvostruka nit</h3> <div id="diag-csa-hca" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam wrapWidth 180 title DeepSeek-V4-Pro — Hibridna arhitektura CSA + HCA left to right direction rectangle "KV keš 1M tokena" as KV #E3F2FD rectangle "CSA kompresirana sparsna pažnja" as CSA #C8E6C9 { rectangle "Kompresija m tokeni → 1" as CC rectangle "Retka pažnja (DSA, top-k)" as SA CC --> SA note bottom of SA Attention locale fine + sélection sparse end note } rectangle "HCA Teško komprimirana pažnja" as HCA #BBDEFB { rectangle "ekstremna kompresija\nm' >> m → 1" as ECC rectangle "Внимание густо резидуелна" as EDA ECC --> EDA note bottom of EDA Contexte global + connexions longue distance end note } rectangle "Hibridna fuzija" as FUSION #FFF9C4 rectangle "Dekodiranje koherent" as DEC #FFE0B2 KV --> CSA : Précision locale KV --> HCA : Vision globale CSA --> FUSION HCA --> FUSION FUSION --> DEC @enduml</pre> </div> </div> <div class="paragraph"> <p>Два нивоа компресии, две грануларности внимания :</p> </div> <div class="ulist"> <ul> <li> <p><strong>CSA</strong>kompresuje KV keš sve`m`tokeni, zatim primenjuje sparsu pažnju (DeepSeek Sparse Attention) — samo top-k komprimiranih ulaza se konzultuje. Precizan, lokalan, efikasan. - <strong>HCA</strong>: ekstremna kompresija (faktor`m'`mnogo veći od`m`), ali gusta pažnja na kompresovanom reziduumu — čuva globalne veze bez kvadratnog eksplozije.</p> </li> </ul> </div> <div class="paragraph"> <p>Резултат : при 1M токена, DeepSeek-V4-Pro потрошава само<strong>27% FLOPs zaključka</strong> et <strong>10% veličine KV keša</strong>u odnosu na DeepSeek-V3.2. Prethodni model.</p> </div> <div class="paragraph"> <p>Savršeno važno, tehnički izveštaj (Slika 9) objavljuje : <em>"Retrieval performance remains highly stable within a 128K context window."</em></p> </div> </div> <div class="sect2"> <h3 id="_sednice_1_8_olaksica">Sednice 1-8: olaksica</h3> <div class="paragraph"> <p>Proveo sam osam sesija sa DeepSeek-V4-Pro na`codebase-gradle`. Osam sesija bez jedne halucinacije, bez jedne izmišljene klase, bez jedne zbunjenja u imenovanju.</p> </div> <div class="paragraph"> <p>Сесија 1 : реализација`CodebaseYmlConfig` et <code>CodebaseYmlAnonymizer</code>. 350 linija Kotlin, inline testovi, sve se kompajlira. Sessija 4: dodavanje`SnapshotManager`sa drvnim pregledom, prikupljanje fajlova, renderiranje AsciiDoc po fajlu. 279 linija, nula grešaka. Sesija 7: debugovanje`renderFileSection()`koji je trebalo da upravlja četiri različita tipa anonimizera bez ambiguiteta u rešavanju. Rešeno u tri poruke.</p> </div> <div class="paragraph"> <p>Latnija je viša nego kod Kimija — oko 10-12 sekundi po odgovoru u režimu razmišljanja. Međutim, stopa ispravke je skoro nula. Ne provodim vreme na popravljanje grešaka agenta. Kodiram <strong>avec</strong> njim.</p> </div> </div> <div class="sect2"> <h3 id="_odlučni_test_refaktoring_na_100k_tokena">Odlučni test : refaktoring na 100K tokena</h3> <div class="paragraph"> <p>Na sesiji 8, akumulativni kontekst prelazi 100K tokena. Zahtevam teški refaktoring: izvući četiri inline provere zadatka iz`build.gradle.kts`ка датотека тестова JUnit5 у`buildSrc/src/test/`.</p> </div> <div class="paragraph"> <p>Agent predlaže plan u tri faze:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Kreirati testne klase sa migracijom postojećih slučajeva</p> </li> <li> <p>Dodajte zavisnosti JUnit5 i Kotest u`buildSrc/build.gradle.kts`</p> </li> <li> <p>Уклони инлајн код из`build.gradle.kts`</p> </li> </ol> </div> <div class="paragraph"> <p>On čak identifikuje edge case koji sam propustio: duplikirane Jacksonove zavisnosti između`buildscript {}` et `buildSrc/build.gradle.kts`koje moraju biti ujedinjene tokom migracije</p> </div> <div class="paragraph"> <p>100K tokena konteksta, i agen se seća da`CodebaseYmlAnonymizer.TOKEN_MASK`je`"<strong>*</strong>"`, da`GitConfig.resolvedToken()<code>je funkcija proširenja definisana u`readme.kt</code>, и да`SnapshotManager.PRUNED_DIRS`isključe`build`, <code>.gradle</code> et <code>.git</code>.</p> </div> <div class="paragraph"> <p>To je to, razlika.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_lice_u_lice_poredbene_metrike">Lice u lice : Poredbene metrike</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 25%;"> <col style="width: 25%;"> <col style="width: 25%;"> <col style="width: 25%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Kriterijum</th> <th class="tableblock halign-left valign-top">Kimi K2.6</th> <th class="tableblock halign-left valign-top">GLM-5.1</th> <th class="tableblock halign-left valign-top">DeepSeek-V4-Pro</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Максимални контекст</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">256KB</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">200K</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">1M</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Mehanizam pažnje</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">MLA čist</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">MLA + DSA</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">CSA + HCA hibrid</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Ukupni parametri</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">1T</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">744B</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">1,6T</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Uključeni parametri</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">32B</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">неопубликовано</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">49B</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Opaženi prag degradacije</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">~60K tokens</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">~120K tokens</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">~128K tokens</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Ponašanje izvan</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Masivne halucinacije</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">površinske konfuzije</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">sporo progresivna degradacija</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Стабилност NIAH</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">ne objavljeno</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">100% @128K (DSA)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">stabilno do 128K (Slika 9)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">MRCR @128K</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">неопубликован</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">неопубликован</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">viši od Gemini 3.1 Pro</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Sesije održane pre napuštanja</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">8 (i nastavlja)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Vreme ispravke / vreme koda</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">60%</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">30%</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><5%</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Srednja latencija (mod razmišljanja)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">8 s</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">15 s</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">11 s</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">koeficijent poverenja*</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2/10</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">6/10</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">9/10</p></td> </tr> </tbody> </table> <div class="paragraph"> <p><em>*Koeficijent poverenja = subjektivna mere moje sposobnosti da uzmem kod agenta i commit bez red po red pregleda.</em></p> </div> <div id="diag-radar" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title Радар поређење — 3 LLMs у подржаном развоју софтвера legend right |= Couleur |= Modèle | | <#FF5252> | Kimi K2.6 | | <#FFC107> | GLM-5.1 | | <#4CAF50> | DeepSeek-V4-Pro | endlegend rectangle " " as space #FFFFFF rectangle "Кохеранција 80K+ tokens" as coh #F5F5F5 rectangle "kvalitet\nkod" as qual #F5F5F5 rectangle "размотрање\nархитектонски" as arch #F5F5F5 rectangle "Отпор халуцинации" as hall #F5F5F5 rectangle "Brzina (razvoj iskustvo)" as speed #F5F5F5 rectangle "Znanje Gradle/Kotlin" as kg #F5F5F5 rectangle "Stopa\nkorekcije" as corr #F5F5F5 coh --> qual qual --> arch arch --> hall hall --> speed speed --> kg kg --> corr note top of coh Kimi ████░░░░░░ 4/10 GLM ██████░░░░ 6/10 DeepSeek █████████░ 9/10 end note note top of qual Kimi ███████░░░ 7/10 (sous 60K) GLM ████████░░ 8/10 DeepSeek █████████░ 9/10 end note note top of arch Kimi █████░░░░░ 5/10 GLM ███████░░░ 7/10 DeepSeek █████████░ 9/10 end note note top of hall Kimi ██████░░░░ 6/10 → ██░░░░░░░░ 2/10 (> 60K) GLM ███████░░░ 7/10 DeepSeek █████████░ 9/10 end note note top of speed Kimi █████████░ 9/10 GLM ██████░░░░ 6/10 DeepSeek █████░░░░░ 5/10 end note note top of kg Kimi ███████░░░ 7/10 GLM ███████░░░ 7/10 DeepSeek █████████░ 9/10 end note note top of corr Kimi ██░░░░░░░░ 2/10 (beaucoup de corrections) GLM █████░░░░░ 5/10 DeepSeek ██████████ 10/10 (presque rien à corriger) end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_deepseek_v4_pro_pobjeđuje_u_razvoju_softvera">Zašto DeepSeek-V4-Pro pobjeđuje u razvoju softvera</h2> <div class="sectionbody"> <div class="paragraph"> <p>Преважанство DeepSeek-V4-Pro nije zbog samo jednog faktora — то је конвергенција:</p> </div> <div class="sect2"> <h3 id="_arhitektura_csahca_je_prilagođena_kodu">Arhitektura CSA+HCA je prilagođena kodu</h3> <div class="paragraph"> <p>Podržani razvoj softvera je <strong>ekstremni</strong> slučaj upotrebe za dugokontekstnu pažnju. Treba vam : - Lokalna preciznost (Ova klasa nasleđuje šta ? Ova metoda je definisana gde ?) →<strong>CSA</strong> - Globalna vidra (zašto ovaj modul postoji? kako četiri anonimizatora međusobno interaguju?) →<strong>HCA</strong></p> </div> <div class="paragraph"> <p>Kimi sa MLA jedini rukuje lokalnom preciznošću, ali gubi globalni vidic iznad 60K. GLM sa DSA poboljšava globalni vidic, ali ostaje jedno-nivoa. DeepSeek eksplicitno kombinuje oba.</p> </div> </div> <div class="sect2"> <h3 id="_2_kontekst_eager_je_njegova_zona_komfora">2. Kontekst EAGER je njegova zona komfora</h3> <div class="paragraph"> <p>Moj sistem upravljanja učitava ~30K tokena pravila i backlog pri pokretanju. Sa stabilnim prozorom do 128K, DeepSeek ima ~100K tokena rezervi za razmenu sesije. To je 3 do 4 puta više od toga što Kimi može da obavi bez degradacije.</p> </div> <div class="paragraph"> <p><em><em>_ Prozor od 128K perfektne stabilnosti tačno odgovara mojim potrebama: 30K EAGER + 70K razmena = produktivna sesija od 20-30 poruka, nikad ne izlaze iz zelene zone. </em>_</em></p> </div> </div> <div class="sect2"> <h3 id="_3_odnos_kvalitetlatencija_je_optimalan_za_tok">3. Odnos kvalitet/latencija je optimalan za tok</h3> <div class="paragraph"> <p>Да, DeepSeek-V4-Pro је спорији од Kimi (11s vs 8s). Но <strong>total</strong> време за задатак је много мање јер не провождам 20 минута исправљањем халцинуција агента.</p> </div> <div class="paragraph"> <p>Razvijalac ne meri latenciju odgovora. On meri vreme između "postavljam pitanje" i "kôd je u mom repozitoriju i radi". Na ovoj metrici, DeepSeek-V4-Pro je najbrži od tri.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_naučene_lekcije_kako_izabrati_svoj_llm_za_vibe_coding">Naučene lekcije: Kako izabrati svoj LLM za Vibe Coding</h2> <div class="sectionbody"> <div class="paragraph"> <p>Osim trenutnog rangiranja, ovo iskustvo me je naučilo da ocenjujem LLM za razvoj softvera sa podrškom po kriterijumima koji se ne nalazu u nijednom benchmarku:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Погледај архитектуру, не оглашену величину контекста</strong>— Model koji objavljuje 256K konteksta ali ima samo MLA završeće kao Kimi: teorijski sposoban, praktički neupotrebljivi iznad 60K.</p> </li> <li> <p><strong>Тестирај на свом контексту, а не на генераличком бенчмарку</strong>— Moj početni prompt od 30K tokena AsciiDoc sa apsolutnim pravilima i backlogom nema veze sa pitanjima HLE ili AIME.</p> </li> <li> <p><strong>Latencija nije neprijatelj ako kvalitet sledi</strong>— Sporo model koji proizvodi tačan kod je brži od brzog modela koji proizvodi pogrešan kod.</p> </li> <li> <p><strong>Pazaj na modele bez javnog tehničkog izveštaja</strong>— Ako tim ne dokumentuje svoju arhitekturu pažnje, znači da nema poverenja u njenu održavanju u dugому контексту.</p> </li> </ol> </div> <div id="diag-decision-tree" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam wrapWidth 260 title Stablo odlučivanja — Izabrati svoj LLM za podršku pri razvoju start :Contexte initial\n> 20K tokens ?; if (Oui) then :Architecture d'attention\nhybride ou multi-niveau ?; if (CSA+HCA) then :DeepSeek-V4-Pro Fenetre stable 128K Ideal pour gouvernance EAGER; stop elseif (MLA + DSA) then :GLM-5.1 Correct jusqu'a ~120K Latence elevee; stop else (MLA seul) :Kimi K2.6 (sessions courtes) ou eviter pour long contexte Chercher un modele avec sparse attention; stop endif else (Contexte < 20K) :N'importe lequel fonctionne. Privilegier la latence.; stop endif @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_и_агент_за_управљање_у_све_то">И агент за управљање у све то?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovo iskustvo potvrđuje tačku koju branim od mog članka o Eager/Lazy upravljanju :<strong>Kvalitet LLM-a i kvalitet upravljanja su množivi, a ne aditivni.</strong>.</p> </div> <div class="paragraph"> <p>С Kimi K2.6, моје управљање беше беспречно — али је модел разтезао информацију. Резултат: управљање безгрешно × халцинација = нула.</p> </div> <div class="paragraph"> <p>Sa DeepSeek-V4-Pro, upravljanje EAGER (30K tokena pravila) + LAZY (arhiva sesija, tehničke reference) + Hot/Warm/Cold (rotaciono rezerviranje) formira ekosistem gde svaki sloj pojačava drugi. Agent ima pravila pred očima (EAGER), može pogledati istoriju (LAZY), a kontekst se nikada ne preteruje (rotaciono rezerviranje).</p> </div> <div class="paragraph"> <p><em><em>_ Dobar LLM bez upravljanja, то je motor Ferrari bez volanta. Dobro upravljanje bez dobrog LLM, то je volan bez motora. DeepSeek-V4-Pro + moj agent za upravljanje = prvi put da osećam da vozim. </em>_</em></p> </div> <div class="paragraph"> <p>Rotacioni mehanizam backup-a (rotacija svakih 10 sesija ili >500 EAGER linija) ima pun smisla kod modela koji drži 128K konteksta: sliding window od 10 aktivnih sesija održava kontekst svežim, nikad ne prelazeći zonu degradacije.</p> </div> </div> </div> <div class="sect1"> <h2 id="_tehnički_izvori">tehnički izvori</h2> <div class="sectionbody"> <div class="paragraph"> <p>Савлачио сам свои empirijsko iskustvo sa zvaničnim tehničkim izveштаjima, да бих потврдио моје наблюдање.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>DeepSeek-V4 Technical Report</strong> — PDF preuzeto izhttps://huggingface.co/deepseek-ai/DeepSeek-V4-Flash[HuggingFace]. Slika 9: "Uspeh preuzimanja ostaje izuzetno stabilan unutar prozora konteksta od 128K. Dok se smanjenje uspeha postaje vidljivo van 128K granice, sposobnosti modela preuzimanja pri 1M tokenova ostaju izuzetno jakte." Arhitektura CSA+HCA dokumentisana u odeljku 2.3.</p> </li> <li> <p><strong>GLM-5 Tehnički izveštaj</strong> —https://arxiv.org/abs/2602.15763[arXiv:2602.15763]. DSA se uvodi kroz continued pre-training, "lossless by construction". Maksimalni kontekst 202,752 tokena. Tabele 3/5/6 dokumentiraju performanse dugog konteksta u odnosu na alternative (SWA, Gated DeltaNet, SimpleGDN).</p> </li> <li> <p><strong>Kimi K2.6 Model Card</strong> —https://huggingface.co/moonshotai/Kimi-K2.6[HuggingFace]. MLA, 256K maksimalni kontekst. Strategija discard-all iznad praga na agentičnim zadacima (implicitno potvrđujući praktičnu granicu MLA u dugoročnom kontekstu).</p> </li> <li> <p><strong>Kimi K2 Технички извештај</strong> —https://arxiv.org/abs/2507.20534[arXiv:2507.20534]. Архитектура MoE, оптимизатор MuonClip, агенске перформансе (HLE, BrowseComp, Terminal-Bench).</p> </li> </ol> </div> <div class="paragraph"> <p>Najotkrivniji stav: u njihovoj sopstvenoj proceni, Moonshot primenjuje strategiju <strong>discard-all</strong> (brisanje starog konteksta) odmah kada se kontekstni prozor prekorači. Ovo potvrđuje tačno ono što sam primetio: MLA sam ne može da održi konzistenciju kroz ceo prozor od 256K. Arhitektura ne sledi.</p> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak_izbor_majstora">Zaključak: Izbor majstora</h2> <div class="sectionbody"> <div class="paragraph"> <p>Posle tri nedelje i trinaest sesija stvarnog razvoja, verdict je neizboran:</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 8.3333%;"> <col style="width: 8.3333%;"> <col style="width: 8.3333%;"> <col style="width: 8.3333%;"> <col style="width: 8.3333%;"> <col style="width: 8.3333%;"> <col style="width: 8.3333%;"> <col style="width: 8.3333%;"> <col style="width: 8.3333%;"> <col style="width: 8.3333%;"> <col style="width: 8.3333%;"> <col style="width: 8.3337%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Kimi K2.6</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">GLM-5.1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">DeepSeek-V4-Pro</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Odlično ispod 60K</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Čvrsto do 120K</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Vlada svuda</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Neupotrebljiv izvan</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">површинске конфузии</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Stabilan do 128K</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2 sesije, ostavljeno</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">3 сења, опусћене</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">8 сесије, прихваћен</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>DeepSeek-V4-Pro je postao moj podrazumevani LLM za sve sesije razvoja softvera pomognute Opencode-om. Ne zato što je najnoviji. Ne zato što ima najbolje akademski benchmark. Jer u stvarnom životu razvojera koji šalje Gradle Kotlin DSL plugine sa kontekstom agenta od 30K tokena, on je jedini koji me ne varava kada se kontekst produži.</p> </div> <div class="paragraph"> <p>CSA+HCA je <strong>game changer</strong> arhitekturni. Dvostepena kompresija + sparsifikacija nije detalj implementacije — to je što pravi razliku između kodskog asistenta i pouzdanog člana tima.</p> </div> <div class="paragraph"> <p><em><em>_ Izabrao sam DeepSeek-V4-Pro jer je jedini od tri koji menja moje upravljanje agentom iz defensivnog ograničenja ("Kako sprečiti da agent zaboravi?") u ofanzivnu prednost ("Šta možemo sada izgraditi jer agent svašta pamti?"). </em>_</em></p> </div> <hr> <div class="paragraph"> <p><strong>Оvaj članak је плод 13 реалних сесија развоја на пројекту`codebase-gradle`, dokumentovano u`.agents/sessions/`po mojoj metodologiji upravljanja agent Eager/Lazy/Hot/Warm/Cold. Navedeni tehnički izvori su javno dostupni na HuggingFace i arXiv.</strong></p> </div> </div> </div> https://cheroliv.com/blog/2026/0111_audit_contexte_agent_post.html Mon, 27 Apr 2026 00:00:00 +0000 blog/2026/0111_audit_contexte_agent_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_сцена_сесиона_051_нешто_не_у_реду">Сцена: сесиона 051, нешто не у реду</a></li> <li><a href="#_аудит_размотрисати_627_линија">Аудит: размотрисати 627 линија</a></li> <li><a href="#_strah_od_gubljenja_inženjerstva">strah od gubljenja inženjerstva</a></li> <li><a href="#_решење_энциклопедијски_split">Решење: энциклопедијски split</a></li> <li><a href="#_sadržaj_fajla_essentials">Sadržaj fajla ESSENTIALS</a></li> <li><a href="#_rezultat_50_eager_konteksta">Rezultat: -50% EAGER konteksta</a></li> <li><a href="#_zašto_se_direktorijum_zove_encyclopedies">Zašto se direktorijum zove `encyclopedies/</a></li> <li><a href="#_logični_nastavak_serije">Logični nastavak serije</a></li> <li><a href="#_šta_bih_učinio_drugačije">Šta bih učinio drugačije</a></li> <li><a href="#_упутство_за_аудит_вашег_власног_контекста">Упутство за аудит вашег власног контекста</a></li> <li><a href="#_живо_управљање">Живо управљање</a></li> <li><a href="#_линкови">Линкови</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 14 minutes</div> <p>Prošli ste nedelje da izgradite bezgrešno upravljanje agentom. Eager/Lazy, procedura završetka sesije, rotativni backupi. Sistem radi. A onda jedan dan, agent postaje spor. Odgovori su razbačeni. Merenje: 1414 redova učitano automatski. I najgore je da krivac nije kod, ni backlog, ni arhiva sesija. Krivac je fajl koji dokumentuje vašu metodu.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">tik</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_сцена_сесиона_051_нешто_не_у_реду">Сцена: сесиона 051, нешто не у реду</h2> <div class="sectionbody"> <div class="olist arabic"> <ol class="arabic"> <li> <p>april 2026., 16:00. Ja sam u toku sesije na`magic-stick`, moj projekat izrade ISO Linux live. Agent Opencode je automatski učio moje fajlove Eager kao uvek —<code>AGENT.adoc</code>, <code>PROMPT_REPRISE.adoc</code>, <code>.agents/INDEX.adoc</code>. Све је нормално.</p> </li> </ol> </div> <div class="paragraph"> <p>Osim što su odgovori blagi. Agentu treba dve sekunde više za razmišljanje. Zaboravlja detalj koji je imao pred očima tri poruke ranije. Nije ni krak, ni greška — to je sporo pogoršanje, vrsta koju ne primetiš odmah.</p> </div> <div class="paragraph"> <p>Већ сам то већ преживео на сессии 048, кад сам открио да су датотеке управљања тежиле 5200 сабраних линије. Тогда сам концептуализовао механизам Hot/Warm/Cold са померајим прозором од 10 сесија, његовим идентичным хладним valовима, ињом сензором са два trigгера. Проблем је био решен. У теорији.</p> </div> <div class="paragraph"> <p>Aldo, mi smo na sesiji 051. Rotacija backup-a je bila uspešna — fajlovi EAGER su se smanjili sa 2087 na 500 linija. Ipak, kontekst ostaje teški. Nešto mi se uteklo.</p> </div> <div class="paragraph"> <p>Отварам терминал и упишем :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">wc -l AGENT.adoc AGENT_MODUS_OPERANDI.adoc PROMPT_REPRISE.adoc \ .agents/INDEX.adoc .agents/SESSIONS_HISTORY.adoc \ .agents/archives/COMPLETED_TASKS_ARCHIVE_2026-04.adoc</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs"> 287 AGENT.adoc 627 AGENT_MODUS_OPERANDI.adoc 51 PROMPT_REPRISE.adoc 218 .agents/INDEX.adoc 18 .agents/SESSIONS_HISTORY.adoc 213 .agents/archives/COMPLETED_TASKS_ARCHIVE_2026-04.adoc 1414 total</code></pre> </div> </div> <div class="paragraph"> <p>1414 linija. Rotacija backup-a je dobro obrisala u INDEX, SESSIONS_HISTORY i COMPLETED_TASKS — oni su čisti. Ali ima slona u sobi koje nisam video.<strong>627 linija</strong>u jednom fajlu.<code>AGENT_MODUS_OPERANDI.adoc</code>.</p> </div> <div class="paragraph"> <p>Ovaj fajl je onaj koji sam napisao na sesiji 1 da dokumentiram strategiju Eager/Lazy. To je priručnik metode. I postao je sam po sebi 44% EAGER konteksta.</p> </div> <div id="diag-before-audit" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE title Контекст EAGER — 1414 линија rectangle "AGENT_MODUS_OPERANDI **627 linija (44%)**" as MOD #FFCDD2 rectangle "AGENT.adoc\n287 linija (20%)" as AG #BBDEFB rectangle "INDEX.adoc 218 linija (15%)" as IDX #C8E6C9 rectangle "COMPLETED_TASKS\n213 linije (15%)" as ARC #FFF9C4 rectangle "PROMPT_REPRISE 51 linija (4%)" as PRO #E1BEE7 rectangle "SESSIONS_HISTORY 18 linija (1%)" as HIS #FFE0B2 note bottom of MOD Le fichier qui documente la méthode est devenu le plus gros poste de dépense end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Ironija je potpuna. Fajl koji je dizajniran da <strong>štedjeti</strong> kontekst postao je glavni <strong>potrošač</strong> konteksta. Je kao da je vodič za korišćenje vašeg automobila teži od motora.</p> </div> </div> </div> <div class="sect1"> <h2 id="_аудит_размотрисати_627_линија">Аудит: размотрисати 627 линија</h2> <div class="sectionbody"> <div class="paragraph"> <p>Одлуčujem da uradim audit sekcija po sekcija. Ne radimo to radi brisanja — radi <strong>razumeti</strong> šta zaslužuje da bude u EAGER i šta bi moglo da živi negde drugo bez gubitka znanja.</p> </div> <div class="paragraph"> <p>Ovo je tačna struktura`AGENT_MODUS_OPERANDI.adoc`i što tam nalazim :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2727%;"> <col style="width: 2.2739%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Sekcija</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Linije</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Sadržaj</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Већ присутан у…​</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>P1 — Преглед</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">64</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Rešen problem, osnovni principi, analoga tabla vs uputstvo</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">—</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>P2 — Struktura fajlova</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">97</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">древо, политика загрузки, када учитати што</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">—</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>P3 — Apsolutna pravila</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">34</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Git zabranjen, destruktivne naredbe zabranjene, tajne zabranjene</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>AGENT.adoc</code>+<code>INDEX.adoc</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>P4 — Животни циклус сесије</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">133</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Шаблон отварања, правила рада, 6 корака завршетка сесије, чек-листа</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>AGENT.adoc</code>§Kraj sesije +<code>INDEX.adoc</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>P5 — Метрике и прагове</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">49</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Idealna sesija (15-30 min, 1-3 datoteke), znakovi upozorenja</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">—</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>P6 — Tipovi sesija</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">72</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tabela detekcije, format predloga, izuzeci</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">—</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>P7 — непрестано унапређивање</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">39</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Metrike praćenja, nedeljni pregled</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">—</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>P8 — Checklist pokretanja</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">13</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Bootstrap novi projekat</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"></think> (empty)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>P9 — Reference</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">30</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Referentne datoteke, eksterni resursi</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>AGENT.adoc</code>(datoteke EAGER/LAZY)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Prilogi A+B</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">42</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Речник, историја верзија</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"></think> (output empty)</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Veredikt je bez odbora:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Potpuni duplikati</strong>(167 linija) : P3, P4, P9 — sve je već u`AGENT.adoc` ou <code>INDEX.adoc</code>, češće riječ po rijeci</p> </li> <li> <p><strong>Никогда није консулисано у пракси</strong>(215 linija) : P5, P6, P7, P8, Prilozi — od meta-upravljanja koji nikada nije koristilo u nijednoj sesiji</p> </li> <li> <p><strong>јединствено знање</strong>(161 linija) : P1 i P2 — LAZY/EAGER rečnik, analogija, politika učitavanja</p> </li> </ul> </div> <div class="paragraph"> <p>Na 627 linija,<strong>382 је бута</strong>. Ove 382 linije se učitavaju <strong>na svakom početku sesije</strong>, potrošene od agenta, oslabaju njegovu pažnju pre nego što ja izgovorim zdravo.</p> </div> <div id="diag-audit-result" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title Audit AGENT_MODUS_OPERANDI.adoc — 627 linija left to right direction rectangle "🟡 **Duplikati** 167 linija (27%)" as DUP #FFF9C4 { card "P3 — apsolutna pravila (34 linija)" as D1 card "P4 — Životni ciklus (133 linija)" as D2 card "P9 — Reference (30 linija)" as D3 } rectangle "🔴 **Није консулисано**\n215 линија (34%)" as JAM #FFCDD2 { card "P5 — Metrike (49 linija)" as J1 card "P6 — Детекција (72 линија)" as J2 card "P7 — Unapređenje (39 linija)" as J3 card "P8 — Bootstrap (13 linija)" as J4 card "Прилог — Речник (42 линија)" as J5 } rectangle "🟢 **Jedinstveno poznanje** 161 linija (26%)" as UNI #C8E6C9 { card "P1 — Pregled (64 linija)" as U1 card "P2 — Структура датотека (97 линија)" as U2 } note bottom of UNI C'est ÇA qu'il faut garder en EAGER. Le reste → cold storage. end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Ovaj dijagram je ključ od svega. Duplikati (žuto) su čist šum — agenat ih čita dva puta, u dva različita fajla. Nikad nekonultisan (crveni) je mrtva dokumentacija — napisana s paznje, nikada neupotrebljena. Samo zeleno sadrži znanje koje agenat ne može da nađe drugde.</p> </div> </div> </div> <div class="sect1"> <h2 id="_strah_od_gubljenja_inženjerstva">strah od gubljenja inženjerstva</h2> <div class="sectionbody"> <div class="paragraph"> <p>У овом тренутку имам доказа у очама: мора да скратим.<code>AGENT_MODUS_OPERANDI.adoc</code>. Ali se okolebam.</p> </div> <div class="paragraph"> <p>Оvaj fajl, sam ga napisao rukom. Svaka sekcija je rezultat lekcije naučene u realnoj sesiji. Deo P3 je nastao od`rm -rf`случан на`bakery-plugin`Deo P4 je rezultat petnaest sesija u kojima sam zaboravio da arhiviram i gubio nit. Procedura u 6 koraka nije izišla iz knjige — nastala je iz boli.</p> </div> <div class="paragraph"> <p>Brisanje ovih sekcija bilo bi bacanje istorije moje sopstvene inženjerije. Lezioni koje su ih proizvele, sesije tokom kojih sam ih otkrio, greške koje više nikada ne želim da ponovim. Ovo nije tekst — ovo je kristalizovano iskustvo.</p> </div> <div class="paragraph"> <p>Ovo je mesto gde formulišem princip koji će voditi rešenje:</p> </div> <div class="paragraph"> <p><em><em>_ <strong>Никогда не бриши. Увек премести.</strong>Znanje ne mora da nestane iz projekta. Ono treba samo da se ne učitava automatski kada nije potrebno. </em>_</em></p> </div> </div> </div> <div class="sect1"> <h2 id="_решење_энциклопедијски_split">Решење: энциклопедијски split</h2> <div class="sectionbody"> <div class="paragraph"> <p>Model koji predlažem je jednostavan i inspirisan je načinom na koji je Wikipedija rasla: kada članak postane predugačak, ne se sekne — kreira se detaljniji članak i ostavlja se sažetak u glavnom članku.</p> </div> <div class="paragraph"> <p>за`AGENT_MODUS_OPERANDI.adoc`, то даје :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>извлачити</strong>161 linija jedinstvenog znanja (P1 + P2) u novom fajlu`LAZY_EAGER_ESSENTIALS.adoc`— skompresovan na ~50 linija, strogo EAGER</p> </li> <li> <p><strong>Preimenuj</strong> <code>AGENT_MODUS_OPERANDI.adoc</code> en <code>.agents/encyclopedies/LAZY_EAGER_ENCYCLOPEDIE.adoc</code>— originalni fajl od 627 linija, sačuvan <strong>neporuđen</strong>, u hladnom skladiшту</p> </li> <li> <p><strong>Nikad ne puniti</strong>le fajl enciklopedije automatski — on je tu za čoveka, za buduću distilaciju, za agenta kojega ćemo pozvati za šest meseci sa boljim modelom</p> </li> </ol> </div> <div id="diag-split-solution" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title Split enciklopedijski — AGENT_MODUS_OPERANDI left to right direction rectangle "**AGENT_MODUS_OPERANDI.adoc** 627 linija (pre podjele)" as BEFORE #FFCDD2 { } rectangle " " as ARROW1 rectangle " " as ARROW2 rectangle "**LAZY_EAGER_ESSENTIALS.adoc** **~50 linije — EAGER**" as ESS #C8E6C9 { card "P1 kondenzovana (15 linija)" as E1 card "P2 kondenzovana (35 linija)" as E2 } rectangle "**.agents/encyclopedies/**\n**LAZY_EAGER_ENCYCLOPEDIE.adoc**\n627 linija — COLD" as ENC #BBDEFB { card "P1 u prilozima (cio, neповреден)" as C1 } BEFORE -[#4CAF50]-> ESS : "Извлачење критичног знања" BEFORE -[#2196F3]-> ENC : "Целостна сахрана инжењерства" note bottom of ESS Chargé automatiquement en début de session → L'agent comprend le vocabulaire end note note bottom of ENC Jamais chargé automatiquement Consultable par l'humain Matériau brut pour distillation future end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Ime`encyclopedies/`Не је беззначајно. Енциклопедија није архив — то је организована колекција знања, доступна али не преносима. Не чита се Универзалис енциклопедија у метро. Чувамо je у библиотеци, а идемо до ње када имамо конкретно питање.</p> </div> <div class="paragraph"> <p>Ovo je tačno uloga ovog direktorijuma: hladna referencijalna biblioteka, strukturalna i kompletna — kojeg agent ne dodiruje automatski.</p> </div> </div> </div> <div class="sect1"> <h2 id="_sadržaj_fajla_essentials">Sadržaj fajla ESSENTIALS</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ово је како нови фајл zapravo изгледа.<code>LAZY_EAGER_ESSENTIALS.adoc</code>, izvučeno i kompaktovano iz P1 i P2 :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">= Stratégie LAZY/EAGER — Principes Essentiels [abstract] Ce fichier définit la stratégie de gestion du contexte agent. Chargé automatiquement (EAGER) en début de session. == Principes |=== | EAGER | LAZY | Tableau de bord | Manuel du propriétaire | Chargé automatiquement | Chargé sur demande | <= 100 lignes, <= 10k tokens | Illimité, détaillé | Règles absolues, mission courante | Archives, historique, références |=== == Politique de Chargement |=== | Fichier | Type | Quand charger | PROMPT_REPRISE.adoc | EAGER | Début session (auto) | *_ESSENTIALS.adoc | EAGER | Début session si EPIC active | .agents/INDEX.adoc | EAGER | Début session (auto) | *_REFERENCE.adoc | LAZY | Sur besoin (détails architecture) | .agents/sessions/N-*.adoc | LAZY | Sur demande (détails session) | .agents/encyclopedies/*.adoc | COLD | Jamais auto (humain seulement) |=== == Comment l'Agent Sait Quoi Charger Début session → PROMPT_REPRISE + INDEX + ESSENTIALS actifs. Besoin de détails → charger les *_REFERENCE et sessions/ en LAZY. Connaissance froide → encyclopedies/, jamais automatique.</code></pre> </div> </div> <div class="paragraph"> <p>Pedesaet linija. To je sve što agentu treba da razume mehaniku. Sve ostalo — istorija lekcija, detaljne analogije, korak po korak postupci, dodatci — živi u enciklopediji.</p> </div> <div class="paragraph"> <p>И најvažnije:<strong>Ništa nije obrisano.</strong>. 627 inženjerskih linija je uvek tu, u`.agents/encyclopedies/LAZY_EAGER_ENCYCLOPEDIE.adoc`. One su jednostavno smještene u biblioteci umesto na radnoj površini.</p> </div> </div> </div> <div class="sect1"> <h2 id="_rezultat_50_eager_konteksta">Rezultat: -50% EAGER konteksta</h2> <div class="sectionbody"> <div class="paragraph"> <p>Пре раздвајања:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs"> 287 AGENT.adoc 627 AGENT_MODUS_OPERANDI.adoc 51 PROMPT_REPRISE.adoc 218 .agents/INDEX.adoc 18 .agents/SESSIONS_HISTORY.adoc 213 .agents/archives/COMPLETED_TASKS_ARCHIVE_2026-04.adoc 1414 total</code></pre> </div> </div> <div class="paragraph"> <p>После сплита:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs"> 287 AGENT.adoc 50 LAZY_EAGER_ESSENTIALS.adoc ← remplace 627 lignes 51 PROMPT_REPRISE.adoc 218 .agents/INDEX.adoc 18 .agents/SESSIONS_HISTORY.adoc 213 .agents/archives/COMPLETED_TASKS_ARCHIVE_2026-04.adoc 837 total ← -41%</code></pre> </div> </div> <div id="diag-after-audit" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE title Контекст EAGER после енциклопедијског сплита — 837 линија (-41%) rectangle "AGENT.adoc 287 linija (34%)" as AG #BBDEFB rectangle "INDEX.adoc\n218 linija (26%)" as IDX #C8E6C9 rectangle "COMPLETED_TASKS 213 redova (25%)" as ARC #FFF9C4 rectangle "PROMPT_REPRISE 51 linija (6%)" as PRO #E1BEE7 rectangle "Osnovno 50 linija (6%)" as ESS #A5D6A7 rectangle "SESSIONS_HISTORY 18 linija (2%)" as HIS #FFE0B2 note bottom of ESS De 627 → 50 lignes 577 lignes d'ingénierie préservées en cold storage Rien de perdu. Tout de relocalisé. end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Najveći potrošač (AGENT_MODUS_OPERANDI, 627 linija) zamenjen je fajlom od 50 linija. Dobitak je odmah vidljiv: 577 linija konteksta oslobođene. Agent dishe.</p> </div> <div class="paragraph"> <p>И у`.agents/encyclopedies/`, originalni fajl od 627 linija čeka. Netaknut. Sve njegove sekcije — uključujući one koje su duplikati, uključujući one koje nikad nisu bile upotrebljene. Jer jednog dana, bolji model ili ljudski naučnik podataka želi da pređe kroz ove uglove, ove pretpostavljene redundancije, ove naučene lekcije. I tog dana, sirov materijal će biti tu.</p> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_se_direktorijum_zove_encyclopedies">Zašto se direktorijum zove `encyclopedies/</h2> <div class="sectionbody"> <div class="paragraph"> <p>Izbor naziva nije kozmetički. On kodira filosofiju mehanizma.</p> </div> <div class="paragraph"> <p>Jedna arhiva (<code>archives/</code>) sadrži istorijske podatke organizovane kronološki — kao mesecni COMPLETED_TASKS. Jedno <strong>backup</strong> (<code>backup/</code>) je timestampovani snapshot — rezervna kopija prethodnog stanja.</p> </div> <div class="paragraph"> <p>Jedna <strong>enciklopedija</strong>, to je nešto drugo. To je kolekcija tematickog znanja, strukturirana po temama, iscrpna ali nelinearna. Ne čitamo enciklopediju od početka do kraja. Uražemo se u njoj da odgovorimo na konkretno pitanje.</p> </div> <div class="paragraph"> <p>Ово је уговор овог дела :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> <col style="width: 6.25%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Dosije</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Uloga</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Pristup</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">granularitet</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>archives/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Историјски подаци (завршени задаци по месецу)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">LAZY, strukturovan</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Хронолошки</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>backup/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Hladni snapshoti (valovi od 10 sesija)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">COLD, kompletna kopija</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">хронолошки</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>encyclopedies/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Potpuno tematsko znanje (metodologija, patterni)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">COLD, nikad auto</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Тематика</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Svaki fajl zna gde treba da živi prema <strong>ce qu’il contient</strong>, ne prema <strong>quand il a été créé</strong>.</p> </div> </div> </div> <div class="sect1"> <h2 id="_logični_nastavak_serije">Logični nastavak serije</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ako ste pročitali prva dva članka, ovde je kako se tri dela uklapaju:</p> </div> <div id="diag-trilogie" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam wrapWidth 220 title Trilogija upravljanja agenta left to right direction package "📖 **Article 0108**\nStrategija Eager/Lazy" as A1 #E8F5E9 { card "мемория агент među сесије" as M1 card "Фајлови EAGER (аутоматски учитан)" as M2 card "Fajlovi LAZY\n(na zahtev)" as M3 card "Postupak od 6 koraka" as M4 } package "🧊 **Члан 0110** Механизам Hot/Warm/Cold" as A2 #FFF9C4 { card "Starenje konteksta" as V1 card "Prozor klizanja 10 sesija" as V2 card "hladna vala identična" as V3 card "Сензор са два тригера" as V4 } package "🔍 **Članak 0111**\nAudit + Enciklopedsko rešenje" as A3 #BBDEFB { card "Аудит датотека\nEAGER" as E1 card "Identifikacija\notpada" as E2 card "Split\nESSENTIALS/енциклопедија" as E3 card "Сачување инжењерства" as E4 } A1 --> A2 : "Меморија растe → потребан је један механзам старења" A2 --> A3 : "Starenje nije dovoljno → treba proveriti šta zaslužuje da bude u EAGER" note bottom of A3 ✅ Les trois couches sont en place sur 6 projets actifs end note @enduml</pre> </div> </div> <div class="ulist"> <ul> <li> <p><strong>0108</strong> Одговара на : « Како дадите меморију агенту између два сеанса? »</p> </li> <li> <p><strong>0110</strong>одговор на : « Kako da sprečimo da ova memorija duši agenta?</p> </li> <li> <p><strong>0111</strong>Ako problem nije veličina arhiva, već što smo <strong>izabrali</strong> da stavimo u EAGER?</p> </li> </ul> </div> <div class="paragraph"> <p>Prvi članak je izgrađivao strukturu. Drugi je dodao mehanizam staranja. Treći audituje sadržaj — i otkriva da je metodologija sama postala problema.</p> </div> </div> </div> <div class="sect1"> <h2 id="_šta_bih_učinio_drugačije">Šta bih učinio drugačije</h2> <div class="sectionbody"> <div class="paragraph"> <p>U retrospektivi vidim početnu grešku u dizajnu.`AGENT_MODUS_OPERANDI.adoc`Bio je kreiran kao jedinstveni dokument — manifest. Bio je dobar pristup za formalizovanje misli. Ali jednom kada je misla formalizovana, dokument bi trebalo biti odmah podeljen: osnovni deo u EAGER-u, a kompletno u cold-u.</p> </div> <div class="paragraph"> <p>Nisam to uradio jer sam bio ponosan na dokument. 627 linija čiste inženjerije, napisane rukom, svaka sekcija plod lekcije sesije. To je bilo moje djelo. I kao svaki autor, teško mi je bilo da ga razdvojim.</p> </div> <div class="paragraph"> <p>Лекција :<strong>Nije zato što je dokument dobar da mora da se učita automatski.</strong>. Kvaliteta sadržaja nema veze sa relevance za trenutni kontekst agenta.</p> </div> <div class="paragraph"> <p>Dan sada, pravilo je jednostavno: svaki dokument sa više od 100 linija u kontekstu EAGER je sumnjiv. On zaslužuje audit. Ne osuda — audit. I pitanje nikada nije: « Da li ga treba obrisati? » već: « Da li ga treba učitati u svakoj sesiji?</p> </div> </div> </div> <div class="sect1"> <h2 id="_упутство_за_аудит_вашег_власног_контекста">Упутство за аудит вашег власног контекста</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ako ste pratili prva dva članka i postavili svoju vlastitu Eager/Lazy upravljanje, ovo je petkorakna procedura audita:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Meriti</strong> : `wc -l`na svim vašim EAGER fajlovima. Ukupan broj treba da bude ispod 1000 linija.</p> </li> <li> <p><strong>Identifikujte najveći</strong>: fajl koji čini više od 20% ukupnog je glavni suspect.</p> </li> <li> <p><strong>Auditi po sekcijama</strong>: za svaku sekciju pitajte se « Da li je ova informacija već negde? Da li je agent već pročitao u drugom fajlu? Da li je bila korisna u poslednjih pet sesija?</p> </li> <li> <p><strong>klasifikator</strong>: duplikat, nikad neupotrebljen, jedinstveno znanje.</p> </li> <li> <p><strong>Splitter ili premestiti</strong>: što je jedinstveno i kritično → ESSENTIALS kompaktovan. Sve ostalo →<code>encyclopedies/</code>.</p> </li> </ol> </div> <div id="diag-audit-checklist" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title Procedura audita konteksta agenta — 5 koraka start :1. **Mesurer**\n`wc -l *.adoc .agents/*.adoc`; if (Total > 1000 lignes ?) then (oui) :⚠️ Contexte trop lourd; else (non) :✅ Contexte OK; stop endif :2. **Identifier le suspect**\nLe fichier > 20% du total; :3. **Auditer section par section**\nPour chaque section :\n• Déjà ailleurs ? → doublon\n• Jamais servi ? → mort\n• Information unique ? → critique; :4. **Classifier**\n🟡 Doublons → à retirer de l'EAGER\n🔴 Jamais utilisé → cold storage\n🟢 Connaissance unique → à garder; :5. **Splitter**\n🟢 → ESSENTIALS (~50 lignes, EAGER)\n🟡🔴 → encyclopedies/ (cold storage); :✅ Contexte optimisé\nsans perte d'ingénierie; stop @enduml</pre> </div> </div> <div class="paragraph"> <p>Ova procedura traje 15 minuta. Na projektu od 50 sesija, ona štedi stotine tokena po buduće sesiji. ROI je odmah.</p> </div> </div> </div> <div class="sect1"> <h2 id="_живо_управљање">Живо управљање</h2> <div class="sectionbody"> <div class="paragraph"> <p>Šta mi je naučila ova seria tri članka, jeste da agenti vladanje nije gotov proizvod. To je<strong>živi organizam</strong>. Ona raste sa projektom. Ona doživljava bolei rastu. Ona zahteva regularne pregleda.</p> </div> <div class="paragraph"> <p>Sesija 048 je pokazala da se arhivi povećavaju. Sesija 051 je pokazala da se metodologija sama povećava. Sesija 060 će verovatno pokazati nešto drugo. To je normalno. To je zdravno. Uprava koja se nikada ne pitanje je mrtva uprava.</p> </div> <div class="paragraph"> <p>Tri mehanizma koji su postavljeni — Eager/Lazy, Hot/Warm/Cold, split enciklopedijski — formiraju sistem dubinske odbrane protiv preopterećenja konteksta. Nije jedan dovoljan sam po sebi. Uzajamno se dopunjuju:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Željan/Lijen</strong>strukturiši informacije *po dostupnosti</p> </li> <li> <p><strong>vruć/topao/hladan</strong>strukturiši informaciju <strong>po svežnosti</strong></p> </li> <li> <p><strong>Enциклопедијски аудит</strong>struktoriši informaciju <strong>po gustini</strong></p> </li> </ul> </div> <div id="diag-defense-in-depth" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam nodeBackgroundColor #E3F2FD title Дубока одбрана против засићености контекста node "**Контекст агента** ~800 линија здрав" as CTX #C8E6C9 node "Слој 1 **EAGER / LAZY**" as C1 #BBDEFB node "Слој 2\n**HOT / WARM / COLD**" as C2 #BBDEFB node "Слој 3\n**ОСНОВНО / ЕНЦИКЛОПЕДИЈА**" as C3 #BBDEFB CTX --> C1 : "Структура по\n**доступност**" CTX --> C2 : "Struktura po\n**svežini**" CTX --> C3 : "Struktura po **gustini**" note bottom of C3 Les trois couches sont nécessaires. Aucune n'est suffisante seule. end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Са овим три слоја, контекст агента на`magic-stick`je presao sa 2087 linija (pre nego bilo kakve optimizacije) na oko 800 linija — podeljeno sa 2,6. Nije se izgubio ni jedan red dokumentacije, ni jedna sesijska arhiva, ni jedna naučena lekcija.</p> </div> <div class="paragraph"> <p>Sve je tamo. Jednostavno bolje uređeno.</p> </div> </div> </div> <div class="sect1"> <h2 id="_линкови">Линкови</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Член 0108 — Eager/Lazy стратегија:<a href="/blog/2026/0108_gouvernance_agent_opencode_eager_lazy_post.html">Upravljati Agentom AI pomoću AsciiDoc</a></p> </li> <li> <p>Член 0110 — механизам Hot/Warm/Cold :<a href="/blog/2026/0110_mecanisme_backup_contexte_agent_post.html">Sliding Window i hladna vala</a></p> </li> <li> <p>Мој сајт : <a href="https://cheroliv.com" class="bare">https://cheroliv.com</a></p> </li> <li> <p>Пројекат`magic-stick`: <a href="https://github.com/cheroliv/magic-stick" class="bare">https://github.com/cheroliv/magic-stick</a></p> </li> </ul> </div> <hr> <div class="paragraph"> <p><strong>Znanje ne mora da nestane. Ono treba samo da ne bude učitano kada nije potrebno.</strong></p> </div> </div> </div> https://cheroliv.com/blog/2026/0110_mecanisme_backup_contexte_agent_post.html Sun, 26 Apr 2026 00:00:00 +0000 blog/2026/0110_mecanisme_backup_contexte_agent_post.html <div class="sect1"> <h2 id="_sažetak">Sažetak</h2> <div class="sectionbody"> <div class="paragraph"> <p>После 48 сесија на једном пројекту и 150+ укупно, система управљања Eager/Lazy који сам пажљиво конструирао је започео да се задавља. Датотеке агенata, које су требало да буду лаге, вежиле су 5200 укупних линија. Аутоматски учитан контекст је растеобрже од моjeg могушта да га контролам. Овај članak прича о томе kako sam концептуализовао резервни механизам копирања — међу sliding window и идентичној hladном valу — да одржам лаган активни контекст без губитка čega god.</p> </div> </div> </div> <div class="sect1"> <h2 id="_signal_5200_linija">Signal: 5200 linija</h2> <div class="sectionbody"> <div class="paragraph"> <p>Нахожу се у среди сесије 048 на`magic-stick`, moj projekat za izgradnju live ISO Linux-a. Opencode me gleda. Kao uvek, on je automatski učitao moje Eager fajlove na početku sesije —<code>AGENT.adoc</code>, <code>PROMPT_REPRISE.adoc</code>, `.agents/INDEX.adoc`Ništa nije neobično.</p> </div> <div class="paragraph"> <p>Osim toga, nešto ne valja. Odgovori su sporiji. Razmišljanje je više razvedreno. Agent zaboravljava detalje koje je imao pred sobom pre dva poruke.</p> </div> <div class="paragraph"> <p>Отварам терминал и упишем:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">wc -l .agents/INDEX.adoc .agents/SESSIONS_HISTORY.adoc \ .agents/archives/COMPLETED_TASKS_ARCHIVE_2026-04.adoc</code></pre> </div> </div> <div class="paragraph"> <p>260 linija za INDEX. 55 za SESSIONS_HISTORY.<strong>1756 za COMPLETED_TASKS_ARCHIVE</strong>.</p> </div> <div class="paragraph"> <p>Dossier`sessions/`доба још ~3200 линија. Укупно :<strong>5200 linije</strong>konteksta koji se učitavaju, na jedan ili drugi način, u privremenom mozku agenta.</p> </div> <div class="paragraph"> <p>Strategija Eager/Lazy koju sam teorizovao u prethodnom članku radi — ali ima rodni nedostatak kojeg nisam prevideo: ona ne<strong>нема механизма старења</strong>. Svaka sesija dodaje jednu liniju u INDEX, jedan pasaj u COMPLETED_TASKS, fajl u sessions/. Ništa nikad ne izlazi. Kontekst je snežna kugla koja se povećava svaki put prilikom nove sesije.</p> </div> <div id="diag-growth" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam handwritten false title Rast konteksta agenta — Sesije 1 do 48 rectangle "Сесија 1-10" as S10 #E8F5E9 rectangle "Sesija 11-20" as S20 #C8E6C9 rectangle "Сесија 21-30" as S30 #A5D6A7 rectangle "Сесија 31-40" as S40 #81C784 rectangle "Sesija 41-48" as S48 #66BB6A note right of S10 INDEX : ~50 lignes SESSIONS : ~10 lignes ARCHIVE : ~100 lignes **Total : ~300 lignes** end note note right of S20 INDEX : ~100 lignes SESSIONS : ~20 lignes ARCHIVE : ~400 lignes **Total : ~800 lignes** end note note right of S30 INDEX : ~160 lignes SESSIONS : ~30 lignes ARCHIVE : ~900 lignes **Total : ~1800 lignes** end note note right of S40 INDEX : ~220 lignes SESSIONS : ~45 lignes ARCHIVE : ~1400 lignes **Total : ~3200 lignes** end note note right of S48 INDEX : **260 lignes** SESSIONS : **55 lignes** ARCHIVE : **1756 lignes** **Total : 5200 lignes** ⚠️ end note S10 -[#green]-> S20 S20 -[#green]-> S30 S30 -[#FF9800]-> S40 S40 -[#red]-> S48 @enduml</pre> </div> </div> <div class="paragraph"> <p>Ovo nije greška, to je izravna posledica procedure za završetak sjednice koja pažljivo arhivira svaki detalj. Sistem je žrtva svog vlastitog uspeha.</p> </div> </div> </div> <div class="sect1"> <h2 id="_дијагностика_трострука_редунданција">Дијагностика: трострука редунданција</h2> <div class="sectionbody"> <div class="paragraph"> <p>Zahtevam od agenta da dijagnostikuje problem. Njegov odgovor je odmah i hirurški precizan.</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Fajl</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Линије</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Uloga</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Problem</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>.agents/INDEX.adoc</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">260+</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">EAGER (samopuno)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tabela svih sesija od 001 —<strong>+1 red po sesiji</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>.agents/SESSIONS_HISTORY.adoc</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">55</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">žedan</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Табела сажетка —<strong>redundantnost sa INDEX</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>COMPLETED_TASKS_ARCHIVE_2026-04.adoc</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">1756</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">EAGER (implicirana)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Potpuni detalji svih aprilskih sesija</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>.agents/sessions/*.adoc</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">~5200 total</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">LEN (pretpostavljeno)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">individualne arhive, ali<strong>nekorišćene</strong>zbog sve je već u COMPLETED_TASKS</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Agent identificuje četiri osnovna uzroka :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>COMPLETED_TASKS_ARCHIVE absorbuje sve</strong>— Umesto da pokazuje ka arhivama`.sessions/`, on kopira sav sadržaj svake sesije.</p> </li> <li> <p><strong>INDEX.adoc služi kao kompletn istorijat</strong>— Табела "Последње сесионе" садржи 30+ уносова.</p> </li> <li> <p><strong>SESSIONS_HISTORY.adoc redundantan</strong>— Isto kao INDEX, drugačiji format.</p> </li> <li> <p><strong>Pravilo LAZY nije poštovano</strong>— COMPLETED_TASKS je implicitno EAGER jer sve sadrži.</p> </li> </ol> </div> <div class="paragraph"> <p>Njegova predloga je radikalna: ograničiti <code>INDEX</code> na 10 sesija, prazniti <code>COMPLETED_TASKS</code>, premestiti <code>SESSIONS_HISTORY</code> u čist <code>LAZY</code>. Odmahna korist :<strong>~1900 linije sačuvane</strong>.</p> </div> <div class="paragraph"> <p>To je čisto, efikasno, logično. Ali imam problem sa ovim pristupom.</p> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_sam_odbio_evidentno_rešenje">Zašto sam odbio evidentno rešenje</h2> <div class="sectionbody"> <div class="paragraph"> <p>Rešenje agenta je to koje kod inženjera koji optimizuje keš. Ograničiti. Sačiniti. Ukloniti redundancije.</p> </div> <div class="paragraph"> <p>Ali ove "redundance" nisu. Svaki fajl upravljanja zapamtí<strong>različit ugao</strong>на истој стварности :</p> </div> <div class="ulist"> <ul> <li> <p><strong>INDEKS</strong>= makro pogled, izvršna ploča</p> </li> <li> <p><strong>ISTORIJA_SESIJA</strong> = линеарна хронолошка табела, оценњена</p> </li> <li> <p><strong>COMPLETED_TASKS_ARCHIVE</strong>= detaljni narativ sa metričkim podacima</p> </li> <li> <p>sessions/*.adoc` = individualne arhive, pun kontekst</p> </li> </ul> </div> <div class="paragraph"> <p>Ово није глупо дуплирање. Ово је од<strong>višestruka strukturisana perspektiva</strong>. Ovo je tačno ono što je potrebno za destilaciju — da kasnije čovek (ili budući LLM bolje treniran) može prekrstiti uglove i izvući uzorce.</p> </div> <div class="paragraph"> <p>Umajini data scientist koji vam kaže: «Uklonimo tri kolone od šest, one su korelisane.» Šta mu odgovorite? Da korelacija nije redundantnost kada svaka kolona uhvata različitu dimenziju istog fenomena. To je presično ova dimenzionalna bogatost koja čini skup podataka koristan.</p> </div> <div class="paragraph"> <p>To je moja intuicija. Ja je branim protiv hladne racionalnosti agenta.</p> </div> <div class="paragraph"> <p><em><em>_ Ne vidim tiho sveukupno u mojoj ideji. Ne bačimo sve, premještamo strukturirani rezultat procedure završetka sesije — svaki fajl sa svojim uglom, svojim redundantnim podacima koji su zapravo unapređenje. To je višedimenzionalni materijal koji će biti bolji za destilaciju. </em>_</em></p> </div> <div class="paragraph"> <p>Агент прима удара. И исправља се.</p> </div> </div> </div> <div class="sect1"> <h2 id="_предлог_идентична_хладна_таласа">Предлог: Идентична хладна таласа</h2> <div class="sectionbody"> <div class="paragraph"> <p>Agent zatim ponuđuje finiji mehanizam koji poštuje moju intuiciju o bogatom datasetu, dok u isto vreme rešava tehnički problem konteksta koji eksploduje.</p> </div> <div class="paragraph"> <p>Princip je jednostavan i direktno se inspiše uzorcom<strong>Vruć/topla/hladna skladišta</strong>primenjeno u upravljanju arhivama:</p> </div> <div class="ulist"> <ul> <li> <p><strong>toplo (EAGER)</strong>= 10 poslednjih sesija u INDEX, PROMPT_REPRISE sesije N+1, 2 poslednja fajla sesije</p> </li> <li> <p><strong>Toplo (LENTO)</strong>SESSIONS_HISTORY нови, SCRIPT_VERIFICATION, цела референтна документација</p> </li> <li> <p><strong>hladno (backup/)</strong>= sve ostalo, pomereno<strong>неповређен</strong>, без трансформације, без реиндексације</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">---- ---- .agents/ ├── INDEX.adoc → Sessions N-9 à N (10 dernières) ├── SESSIONS_HISTORY.adoc → Sessions N-9 à N ├── SCRIPT_VERIFICATION.adoc → Dernière vérif (pas d'historique) ├── PROMPT_REPRISE.adoc → Session N+1 uniquement ├── sessions/ → Sessions N-1 à N uniquement └── backup/ └── Y2026-sessions-001-039/ ← Vague froide, COPIE INTÉGRALE ├── INDEX.adoc → Sessions 001 à 039 (complet) ├── SESSIONS_HISTORY.adoc → Sessions 001 à 039 (complet) ├── COMPLETED_TASKS_ARCHIVE.adoc → Sessions 001 à 039 (complet) └── sessions/ → 001.adoc, 002.adoc... ---- Ključ mehanizma :**Backup nije centralni indeks, već je tačna kopija prošle vala**. Kada prelaziš horizont od 10 aktivnih sesija, ne briše se ništa. Ne reindexuje se ništa. Ne spaja se ništa. Uzmemo paket fajlova agenata kako je bio u sesiji N-10, i pomeramo ga u`backup/`. Aktivni fajlovi, oni, su sečeni : * INDEX : samo poslednjih 10 linija (sliding window) * SESSIONS_HISTORY : isto * COMPLETED_TASKS_ARCHIVE : novi fajl za tekući period * sessions/ : samo poslednje 2 sesije [plantuml, format=svg, id=diag-hot-warm-cold, alt="Architecture Hot/Warm/Cold du contexte agent — EAGER/LAZY/backup"] ---- @startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam wrapWidth 200 title Arhitektura Hot / Warm / Cold agenta konteksta package "HOT (EAGER) Učitan automatski ~300 linija" as HOT #FFCDD2 { file "INDEX.adoc (10 sesija)" as IDX_HOT file "PROMPT_REPRISE (sesija N+1)" as PRO_HOT file "AGENT.adoc (apsolutna pravila)" as AG_HOT } package "WARM (LAZY) Учитаван на захтев ~500 линија" as WARM #FFF9C4 { file "SESSIONS_HISTORY (10 poslednjih)" as HIS_WARM file "SCRIPT_VERIFICATION\n(последња)" as VER_WARM file "PROCEDURES.adoc\n(шаблони)" as PRO_WARM file "*_REFERENCE.adoc (технички документ)" as REF_WARM } package "COLD (backup/) Nikad nije učitan Samo ljudsko čitanje" as COLD #BBDEFB { folder "Y2026-001-039/" as WAVE { file "INDEX (kompletan)" as IDX_COLD file "SESSIONS_HISTORY\n(kompletan)" as HIS_COLD file "COMPLETED_TASKS\n(complet)" as ARCH_COLD folder "sesije/ (001-039)" as SESS_COLD } folder "Y2026-040-???\n(budućnost)" as FUTURE } HOT --> WARM : "Agent podiže se ako je potrebno" WARM --> COLD : "nikad automatski čovjek ide tamo sam" note bottom of COLD Règle : COPIE INTÉGRALE Pas de transformation Pas de réindexation Read-only après archivage end note @enduml ---- Odmakavna dobit je ogromna : kontekst EAGER prelazi sa**~5200 linija do ~300 linija**. Подјело на 17. Није изгубио ниједну линију историјских података. == Zašto nije sve u jednom Агент, у првој итерацији, је бојао се да`backup/`postane crna kutija — fajl u koji bacamo fajlove koje nikada nećemo pročitati. To je legitiman strah. Ali se temeli na zabludi. Смешак је када bacimo datoteke**без структуре, без конвенције, без логике групирања**. Ovde, rezervna kopija je strukturisana po periodu (Y2026-001-039), i svaki folder rezervne kopije sadrži**иста структура**da je fajl`.agents/`aktivan : INDEX, SESSIONS_HISTORY, COMPLETED_TASKS_ARCHIVE, sessions/ Ово није сабирање свега. Ово је**snapshot временски обележен**Moglo bi se čak reći da je pojednostavljena verzija mehanizma versioninga — osim toga što ne verzionira pojedinačne fajlove, već ceo paket upravljanja u jednom trenutku T. Kada želite da pronađete staru informaciju, ne treba vam centralni indeks. Imate dve opcije : 1. **grep` ciljani**:`grep -r "zsh" backup/Y2026-001-039/`— i nađete sve što spominje zsh u tom periodu, bez obzira na ugao (INDEX, SESSIONS_HISTORY, arhiva sesije). 2. **Ručna reintegracija**Privremeno kopirate folder sa rezervnom kopijom u aktivni kontekst, i zatežete agenta da analizira ovaj konkretan period. Indeks je implicitan. On je u samoj strukturi fajlova — svaki je već indeks iz svog vlastitog ugla. == Метафора полица Da bih mehanizam učinio intuituivnim, ja ga sam konceptualizovao u tri police: * **Polica 1 (EAGER)**— план радова. Шта ми је потребно *сада*. INDEX рецент, PROMPT_REPRISE, апсолутна правила. Лаган, немедијан, критичан. * **Polica 2 (LAZY)**— biblioteka za konsultacije. Šta mogu da preuzmem na zahtev. Tehničke reference, nedavna istorija, procedura. Veći zapremine, ali ne učitan u memoriju. * **Пећинa (backup/)**— hladni arhivi. Sve što je prošlo, ali ja ne želim da bacim. Agent nikad ne ulazi tamo. Čovjek spušta se tamo kad hoće da destilira. Agent je inicijalno ponudio četvrtu policu — jedan`index-backup.adoc`Koji bi bio LAZY i sadržavao sadržaj cijelog backupa. Odbio sam. Bio bi bila dodatna redundantnost u sustavu koji već pati zbog linearnog rasta. Struktura arhiviranih datoteka već je indeks. == Сензор са два спустача Konceptualizacija bila je čvrsta, ali je ostala jedna slepa tačka :**Kada tačno pokrenuti rotaciju?**Prvi članak ga je identificirao kao otvoreno pitanje. Dani dva kasnije, odgovor je kodiran u fajlovima upravljanja šest projekata: senzor sa dva pokretača. === Automatski Pokretač — `N % 10 == 0 Први тригер је математички. Када је број сесије множе 10 — сесије 10, 20, 30, 40 — ротација резервне копије извршава се аутоматијски у оквиру процедуре завршетка сесије, одмах након корака 6. Deset sesija, u tempu od jedne do dve sesije dnevno, pokriva približno jednu nedjelju rada — dovoljno da agent zapamti nedavne odluke, ali ne toliko da kontekst eksplodira. === Trigger po pragu — 500 linija EAGER Drugi pokretač je dinamičan. Bez obzira na broj sesije, ako se akumulovani fajlovi EAGER pređu**500 redova**, rotacija se pokreće. Ovaj prag štiti od scenarija u kojem su sesije izuzetno produktivne — veliko sadržaja napisano u malo sesija. Sesija koja proizvede 120 linija uređivačkog sadržaja ubrzano povećava COMPLETED_TASKS_ARCHIVE nego sesija debugovanja koja ispravi dvije linije. Prag od 500 linija, meren preko`wc -l .agents/INDEX.adoc .agents/archives/COMPLETED_TASKS_ARCHIVE_*.adoc PROMPT_REPRISE.adoc`, uhvata ove asimetriju. === ručni pokretač — "rotation backup Konačno, čovek drži kontrolu. Ključne reči`rotation backup`, `backup rotation` ou `lance la rotation backup`pokreću proceduru na zahtev, nezavisno od kraja sesije. Korisno kada osjećate da kontekst postaje tešak ali još niste u množestu od 10, ili kada želite da arhivirate fazu rad pre nego što poćnete novu. [plantuml, format=svg, id=diag-capteur-trigger, alt="Les trois déclencheurs du capteur de rotation backup — automatique, seuil, manuel"] ---- @startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam wrapWidth 200 title Резервни сензор за ротацију — Три триггера start :Procédure de fin de session; note right: Mots-clés "kraj sesije"\nou "Zaustavljamo se ovde." :Étapes 1 à 6\n(archivage standard); note right 1. Archive sessions/N.adoc 2. MAJ PROMPT_REPRISE 3. MAJ SESSIONS_HISTORY 4. MAJ INDEX.adoc 5. MAJ TEST_COVERAGE 6. MAJ COMPLETED_TASKS end note if (N % 10 == 0\nOU\nEAGER cumulé > 500 lignes ?) then (oui) :⚙️ Rotation Backup\n(étape 7); note right 1. Créer backup/Y20XX-sessions-X-Y/ 2. Copier intégrale INDEX + HISTORY + COMPLETED_TASKS + sessions/ 3. Tronquer actifs à 10 sessions 4. Ajouter _Localisation active_ end note else (non) :Pas de rotation; endif :Checklist [✅] x 7\n(si applicable); stop @enduml ---- Овај дијаграм показује тачно убацивање сензора у процедури завршетка сеanse. Корак 7 је опциона — извршава се само ако је једно од два услова испуњено — али се 체계сно *проверено*. Коначна чек-листа включаје`[✅] 7. Backup roté (si applicable)`. === Zatvorena petlja Ovaj senzor zatvara otvorenu petlju iz prethodnog članka. Upravljanje Eager/Lazy je rešilo problem memorije agenta između dva sesija. Mehanizam Hot/Warm/Cold je rešio problem memorije koja se povećava. Senzor sa dva triggera rešava problem *kad* — uklanjajući ljudskom biću mentalno opterećenje praćenja veličine konteksta. [plantuml, format=svg, id=diag-boucle-fermee, alt="Les trois couches de la gouvernance agent — Eager/Lazy, Hot/Warm/Cold, Capteur"] ---- @startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title Tri sloja agentskog upravljanja left to right direction package "Слој 1 — Меморија (Члан 0108)" as C1 #E8F5E9 { rectangle "**EAGER** Табло Аутоматски унет" as EAG rectangle "**LAZY** Vlasnički priručnik Učitano na zahtev" as LAZ EAG -[hidden]right-> LAZ } package "Слой 2 — Старење (Член 0110)" as C2 #FFF9C4 { rectangle "**HOT** 10 aktivnih sesija ~300 linija" as HOT rectangle "**WARM** Reference Proceduri" as WRM rectangle "**COLD** backup/ hladna vala" as CLD HOT -[hidden]right-> WRM WRM -[hidden]right-> CLD } package "Слој 3 — Тригер (Данас)" as C3 #BBDEFB { rectangle "**automatski** N % 10 == 0" as AUTO rectangle "**Prag** > 500 linija" as SEUIL rectangle "**Manuel** rotacija rezervne kopije" as MAN AUTO -[hidden]right-> SEUIL SEUIL -[hidden]right-> MAN } C1 --> C2 : "Меморија расте → потребан је механизам старения" C2 --> C3 : "Starenje → potrebno je imati pokretač da se izvrši" note bottom of C3 ✅ Déployé sur 6 projets magic-stick · bakery-gradle plantuml-gradle · cheroliv.com jhipster-gradle-plugins quizz-benchmark-gradle end note @enduml ---- Tri sloja se logično stavljaju jedan na drugi. Prvi sloj agentu daje memoriju. Drugi sloj sprecava da memorija dusni agenta. Treći sloj automatizira održavanje ove memorije kako bi čoveku nije trebalo da o njemu misli. === Efektivna migracija na cheroliv.com Механизам није остао 이론ски. На`cheroliv.com`, prva rezervna rotacija je izvršena 29. aprila 2026 — sesije -6 do 2 su se premestile ka`.agents/backup/Y2026-sessions-neg6-a-002/`: |=== |Файл |Пред ротацију |Posle rotacije |dobitak |`.agents/INDEX.adoc` |19 navedenih sesija |10 sesija (3-12) |-9 zapisi |`.agents/SESSIONS_HISTORY.adoc` |18 sesija |10 sesija |-8 ulaza |`COMPLETED_TASKS_ARCHIVE` |161 linija (sesija 1-12) |135 linija (sesije 3-12) |-26 linija |`sessions/` |20 fajlova |10 fajlova |-10 datoteka |**rezervna kopija/** |nepostajeći |1 hladna val (10 arhivirih sesija) |+1 hladan paket |=== Poboljšanje u linijama je bilo skromno — projekat je mlad, 12 sesija — ali važno je što je**Mehanizam je na mestu**. Sledeća automatska rotacija će se aktivirati u sesiji 20, ili prethodno ako se dostignu 500 EAGER linija. == Lekcija Čovjek-Agent Ova sesija 048 me je naučila nešto temeljno o suradnji sa agentom veštačke inteligencije. Agent ima prirodni bijas: potražuje da**оптимизовати**, à **поједноставити**, à **Уклонити редундантности**. To je pristrasnost sistema koji je treniran da daje čiste i kratke odgovore. U kontekstu bogatog i multidimenzionalnog dataseta, njegov prvotni refleks je da ga smanji na najjednostavniji izraz. Čovek, on, ima drugu intuíció: oseća da je strukturirana redundancija jedna**prednost**, nije greška. Da raznolikost uglova na istoј stvarnosti jest tačno ono što će kasnje omogućiti kvalitetnu distilaciju. Nije da agen krivi. Nego to što je njegov "optimum" nije moj. Agen optimizuje za**садашњи**— neposredni kontekst, brži odgovor na postavljeno pitanje. Čovek optimizuje za**budućnost**— способност да нађе, прекрижи, дестила у три месеца или три године. ____ Šta želim je neobrađeni materijal. Tvoje razmišljanja, tvoje dileme, tvoje odgovori na moja pitanja. Ne tvoja sinteza. Sintezu znam da napravim bolje od tebe. Željem sirov materijal. ____ Ова реченица коју сам му рекао на крају сесије саžима све. Агент је алат за производњу. Човек је алат за дистилацију. Управа није направљена да агент разуме све сам по себе — она је направљена да човек касније може да ради са произведеним материјалом. Идентичан хладан вал је архитектурно превеђење ове filozofije: не бацамо ништа, не спајамо ништа, не реиндексирамо ништа. Премештамо цео пакет. Дисталација ће доћи позје, руком људи. == Logični nastavak prethodnog člana Ako ste pročitalilink:/blog/2026/0108_gouvernance_agent_opencode_eager_lazy_post.html[članak o strategiji Eager/Lazy], ćete prepoznati prirodni napredak: 1. **Član 0108**— Upravljanje Eager/Lazy : *comment* strukturisanje konteksta agenta u dva nivoa dostupnosti 2. **Овај чланак 0110**— Mehanizam rezervnog kopiranja: *kako* da postariš ovaj kontekst bez da ga gubi kada postane prevelik Prvi članak je odgovorio na pitanje : « Agent ne pamti ništa između dva sesija, kako mu dati memoriju ? Ovaj odgovara na pitanje koje neizbežno proizlazi iz prvog: « Memorija raste na svakoj sesiji, kako je sprečiti da dusiti agenta bez njezinog brisanja? Odgovor se mieštu jedan obrasc:**vruć/topao/hladan**, primenjen na datoteke upravljanja. I kao jedan princip :**nikad nista ne gubiti, uvek sve premestiti**. == Линкови * Prethodni članak :link:/blog/2026/0108_gouvernance_agent_opencode_eager_lazy_post.html[Upravljanje agentom AI pomoću AsciiDoc] * Мој сајт : https://cheroliv.com * Пројекат`magic-stick`: https://github.com/cheroliv/magic-stick --- *Dobar sistem upravljanja nikad ne briše podatke. On ih skladišti.* ----</code></pre> </div> </div> </div> </div> https://cheroliv.com/blog/2026/0109_gradle_jhipster_docker_testcontainers_debugging_post.html Sat, 25 Apr 2026 00:00:00 +0000 blog/2026/0109_gradle_jhipster_docker_testcontainers_debugging_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_scena_jhipster_projekat_build_koji_više_ne_učitava">Scena: JHipster projekat, build koji više ne učitava</a></li> <li><a href="#_greška_1_fantomska_promenljiva_reportsdir">Greška 1 : fantomska promenljiva `reportsDir</a></li> <li><a href="#_greška_2_main_više_ne_postoji_u_gradle_9">Greška 2 : <code>main = "…​"</code> više ne postoji u Gradle 9</a></li> <li><a href="#_greška_3_sourcecompatibility_više_nije_svojstvo_projekta">Greška 3 : <code>sourceCompatibility</code> više nije svojstvo projekta</a></li> <li><a href="#_greška_4_groovy_tvrdenje_sa_tri_operanda">Greška 4: Groovy tvrdenje sa tri operanda</a></li> <li><a href="#_greška_5_implicitna_zavisnost_compilekotlin_openapigenerate">Greška 5: implicitna zavisnost <code>compileKotlin</code> → `openApiGenerate</a></li> <li><a href="#_грешка_6_generategitproperties_се_срушава_на_filteroutputstream_write">Грешка 6 : <code>generateGitProperties</code> се срушава на `FilterOutputStream.write()</a></li> <li><a href="#_konačno_testcontainers_ulazi_na_scenu">Konačno: Testcontainers ulazi na scenu</a></li> <li><a href="#_faza_1_docker_java_staza">Faza 1 : docker-java staza</a></li> <li><a href="#_faza_2_web_pretraga_i_github_krumplin">Faza 2: web pretraga i GitHub krumplin</a></li> <li><a href="#_faza_3_zamka_preimenovanih_artefakata">Faza 3 : zamka preimenovanih artefakata</a></li> <li><a href="#_faza_4_prisiljavanje_resolucije">Faza 4: prisiljavanje resolucije</a></li> <li><a href="#_konačni_rezultat">Konačni rezultat</a></li> <li><a href="#_табела_сажетак_исправка">Табела сажетак исправка</a></li> <li><a href="#_zaključak">Zaključak</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">Време за читање : 15 minutes</div> <p>Već ste doživili ovaj trenutak kad je jednostavno`./gradlew build`Шта то покрећеш сто пута на дан, неожињено почиње да пада на грешку коју није раније видела? Помножи то на једанаест последоватих грешака, додај добру дозу несусадности Docker Engine 29, порошљи Gradle 9 који брише API-je које smo koristili deset года. Ово је повни журнал.</p> </div> <hr> <div class="paragraph"> <p>Дијаграм 1 — Миграција Gradle 9 (niz грешака)</p> </div> <div class="paragraph"> <p>Cilj: pokazati seriju nekompatibilnosti.</p> </div> <div class="paragraph"> <p>Jasno, usmeren na Gradle.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml left to right direction title Migracija Gradle 9 rectangle "1 reportsDir" as A rectangle "2\nmainClass" as B rectangle "3\nsourceCompatibility" as C rectangle "4\nGroovy assert" as D A --> B B --> C C --> D @enduml</pre> </div> </div> <hr> <div class="paragraph"> <div class="title">Дијаграм 2 — Несовместими JHipster додаци</div> <p>Cilj: izolirati pokvareni plugins.</p> </div> <div class="listingblock"> <div class="title">👉 Čista vidovina zavisnosti.</div> <div class="content"> <pre>@startuml left to right direction title Плагинови који треба исправити skinparam shadowing false skinparam roundcorner 18 rectangle "1 openApiGenerate" as A #FFF3E0 rectangle "2 gitProperties 2.5.7" as B #FFF3E0 rectangle "3 Verzije ispravljene" as C #E3F2FD rectangle "4\nSklati OK" as D #E8F5E9 A --> B B --> C C --> D @enduml</pre> </div> </div> <hr> <div class="paragraph"> <div class="title">Dijagram 3 — Docker 29 / Testcontainers</div> <p>Cilj : problem runtime</p> </div> <div class="listingblock"> <div class="title">👉 Jasna istorija runtimea.</div> <div class="content"> <pre>@startuml left to right direction title Docker 29 + Testcontainers skinparam shadowing false skinparam roundcorner 18 skinparam defaultFontSize 14 rectangle "1 Sastavi OK" as A #E8F5E9 rectangle "2 Testovi Cucumber NEUSPEŠNO" as B #FFEBEE rectangle "3 Testcontainers 1.32 odbacen" as C #FFF3E0 rectangle "4 Upgrade verzije" as D #E3F2FD rectangle "5 Izgradi konačno OK" as E #E8F5E9 A --> B B --> C C --> D D --> E @enduml</pre> </div> </div> <hr> <div class="listingblock"> <div class="title">drugi način da ga představite</div> <div class="content"> <pre>@startuml !option handwritten true skinparam backgroundColor #FEFEFE skinparam shadowing false skinparam defaultFontName Inter skinparam defaultFontSize 14 skinparam ArrowThickness 2 skinparam RoundCorner 18 title Roadmap stabilizacije — Gradle 9 ka finalnom buildu left to right direction rectangle "⚙️ Migracija Gradle 9" as A #E3F2FD rectangle "Додатци JHipster" as B #FFF3E0 rectangle "🐳 Docker 29 Testcontainers" as C #FCE4EC rectangle "✅ stabilna izgradnja" as D #E8F5E9 note bottom of A reportsDir mainClass sourceCompatibility Groovy assert end note note bottom of B openApiGenerate gitProperties versions alignées end note note bottom of C tests Cucumber KO image Docker rejetée upgrade libs end note A -[#42A5F5]-> B : corrections build.gradle B -[#FB8C00]-> C : assemble OK C -[#E53935]-> D : tests réparés @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_scena_jhipster_projekat_build_koji_više_ne_učitava">Scena: JHipster projekat, build koji više ne učitava</h2> <div class="sectionbody"> <div class="paragraph"> <p>Projekat`edster`Ovo je JHipster aplikacija generisana 2024. godine. Glavni skript za gradnju`build.gradle`bio je ostao stabilan tokom meseci. Zatim odlučujemo da nadogradimo verziju :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1428%;"> <col style="width: 7.1436%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">komponenta</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ciljna verzija</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Gradle</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">9.4.1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Јава</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">21.0.11-tem (Eclipse Temurin)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">JHipster</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">8.x (okvir`tech.jhipster:jhipster-framework:8.11.0`)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Spring Boot</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">3.4.5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Kotlin</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2.3.0</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Docker Engine</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">29.4.1 (API 1.54)</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Promena verzije Jave se vrši putem SDKMAN-a:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sdk use java 21.0.11-tem</code></pre> </div> </div> <div class="paragraph"> <p>Prvi pokretanje:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ ./gradlew build --no-daemon FAILURE: Build failed with an exception. * Where: Build file '/home/.../edster/build.gradle' line: 18 * What went wrong: An exception occurred applying plugin request [id: 'jhipster.cucumber-conventions'] > Failed to apply plugin 'jhipster.cucumber-conventions'. > Could not create task ':cucumberTest'. > Could not create task ':consoleLauncherTest'. > Could not set unknown property 'reportsDir' for task ':consoleLauncherTest'</code></pre> </div> </div> <div class="paragraph"> <p>Nikad čak i nismo pokrenuli učitavanje skripte za gradnju. Problem je u`buildSrc/src/main/groovy/jhipster.cucumber-conventions.gradle`.</p> </div> </div> </div> <div class="sect1"> <h2 id="_greška_1_fantomska_promenljiva_reportsdir">Greška 1 : fantomska promenljiva `reportsDir</h2> <div class="sectionbody"> <div class="paragraph"> <p>Скрипта`jhipster.cucumber-conventions.gradle`sadrži :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">tasks.register('consoleLauncherTest', JavaExec) { dependsOn(testClasses) String cucumberReportsDir = file("$buildDir/reports/tests") outputs.dir(reportsDir) // <-- reportsDir n'existe PAS classpath = sourceSets["test"].runtimeClasspath main = "org.junit.platform.console.ConsoleLauncher" // ... }</code></pre> </div> </div> <div class="paragraph"> <p>Definisana promenljiva je`cucumberReportsDir`. Korišćena je`reportsDir`— која није дефинисана нигде.</p> </div> <div class="paragraph"> <p><strong>Корекција</strong> : <code>outputs.dir(cucumberReportsDir)</code></p> </div> </div> </div> <div class="sect1"> <h2 id="_greška_2_main_više_ne_postoji_u_gradle_9">Greška 2 : <code>main = "…​"</code> više ne postoji u Gradle 9</h2> <div class="sectionbody"> <div class="paragraph"> <p>Hitno ponovno pokretanje :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">Could not set unknown property 'main' for task ':consoleLauncherTest' of type org.gradle.api.tasks.JavaExec.</code></pre> </div> </div> <div class="paragraph"> <p>Gradle 9 uklanja svojstvo`main`u korist`mainClass`о задацима`JavaExec`.</p> </div> <div class="paragraph"> <p><strong>Корекција</strong>:`mainClass = "org.junit.platform.console.ConsoleLauncher"`</p> </div> </div> </div> <div class="sect1"> <h2 id="_greška_3_sourcecompatibility_više_nije_svojstvo_projekta">Greška 3 : <code>sourceCompatibility</code> više nije svojstvo projekta</h2> <div class="sectionbody"> <div class="paragraph"> <p>Nova greška:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">Could not set unknown property 'sourceCompatibility' for root project 'edster' of type org.gradle.api.Project.</code></pre> </div> </div> <div class="paragraph"> <p>Коренијски скрипт је imao :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">sourceCompatibility=17 targetCompatibility=17</code></pre> </div> </div> <div class="paragraph"> <p>Gradle 9 uklanja ove svojstva na korenom nivou. Oni moraju da budu unutar bloka.<code>java</code>.</p> </div> <div class="paragraph"> <p><strong>Корекција</strong>:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">java { sourceCompatibility = JavaVersion.VERSION_21 targetCompatibility = JavaVersion.VERSION_21 }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_greška_4_groovy_tvrdenje_sa_tri_operanda">Greška 4: Groovy tvrdenje sa tri operanda</h2> <div class="sectionbody"> <div class="paragraph"> <p>Stari skript je sadržavao:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">assert System.properties["java.specification.version"] == "17" || "21" || "24"</code></pre> </div> </div> <div class="paragraph"> <p>У Грови,<code>"21"</code> et <code>"24"`су truthy низове. Izraz se rešava u</code>(…​ == "17") || true || true`, što je uvek tačno — ali sintaksa nije validna za zahtevanu strogu tvrdnju.</p> </div> <div class="paragraph"> <p><strong>Ispravka</strong> :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">assert System.properties["java.specification.version"] in ["17", "21", "23", "24"]</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_greška_5_implicitna_zavisnost_compilekotlin_openapigenerate">Greška 5: implicitna zavisnost <code>compileKotlin</code> → `openApiGenerate</h2> <div class="sectionbody"> <div class="paragraph"> <p>Build napreduje. Kompajliranje Kotlin-a je uspelo. Zatim:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">Task ':compileKotlin' uses this output of task ':openApiGenerate' without declaring an explicit or implicit dependency.</code></pre> </div> </div> <div class="paragraph"> <p>Gradle 9 odbija implicitne zavisnosti između zadataka. Jer`compileKotlin`чита генерисане изворове од`openApiGenerate`, Треба јавити везу.</p> </div> <div class="paragraph"> <p><strong>Исправка</strong>u`build.gradle`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">afterEvaluate { tasks.named("compileKotlin").configure { dependsOn(tasks.named("openApiGenerate")) } }</code></pre> </div> </div> <div class="paragraph"> <p>Le `afterEvaluate`jer je potrebno`openApiGenerate`је додатак (OpenAPI Generator plugin) и није задатак који је директно доступан током фазе конфигурације.</p> </div> </div> </div> <div class="sect1"> <h2 id="_грешка_6_generategitproperties_се_срушава_на_filteroutputstream_write">Грешка 6 : <code>generateGitProperties</code> се срушава на `FilterOutputStream.write()</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kompajliranje Jave prolazi. Resursi se obrađuju. Zatim :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">> Task :generateGitProperties FAILED No signature of method: java.io.FilterOutputStream.write() is applicable for argument types: (Integer) values: [103]</code></pre> </div> </div> <div class="paragraph"> <p>Плагин`gradle-git-properties`version 2.5.0 nije kompatibilna sa Java 21 / Gradle 9. Unutrašnji greška pokušava da pozove`write(int)`preko Groovy na toku koji ga je zatvorio</p> </div> <div class="paragraph"> <p><strong>Ispravka</strong>u`gradle.properties`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-properties hljs" data-lang="properties">gitPropertiesPluginVersion=2.5.7</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konačno_testcontainers_ulazi_na_scenu">Konačno: Testcontainers ulazi na scenu</h2> <div class="sectionbody"> <div class="paragraph"> <p>Do sada, ovo je bilo čisto 'build script debugging'. Svaka greška je bila nekompatibilnost Gradle 9 ili Java 21 u skriptovima za gradnju. Posle šest ispravki iznad, le`./gradlew assemble`успешно прође</p> </div> <div class="paragraph"> <p>Ali`./gradlew build`Он такође извршава тестове, а Cucumber тестови користе Testcontainers да покрену привремено PostgreSQL.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">Could not find a valid Docker environment. EnvironmentAndSystemPropertyClientProviderStrategy: failed with exception BadRequestException (Status 400: {"message":"client version 1.32 is too old. Minimum supported API version is 1.40"} UnixSocketClientProviderStrategy: failed with exception BadRequestException (Status 400: {"message":"client version 1.32 is too old. Minimum supported API version is 1.40"}</code></pre> </div> </div> <div class="paragraph"> <p>Testcontainers ne može da komunicira sa Docker-om. Dve različite strategije (promenljive okoline + Unix soket) ne uspevaju sa istom greškom.</p> </div> <div id="diag-docker-handshake" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam handwritten false actor "Testcontainers 1.20.6" as TC participant "docker-java 3.4.1" as DJ participant "Docker Engine 29.4.1" as DE TC -> DJ : new DockerClient() DJ -> DE : GET /_ping\nUser-Agent: docker-java/3.4.1\nAPI-Version: 1.32 DE --> DJ : HTTP 400 Bad Request\nclient version 1.32 is too old.\nMinimum supported API version is 1.40 DJ --> TC : BadRequestException TC --> TC : Could not find a valid\nDocker environment note right of DE Docker Engine 29.x impose API minimum = 1.40 (défaut ancien : 1.24) end note note left of DJ docker-java 3.4.1 envoie hardcoded API version 1.32 dans l'en-tête HTTP end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_faza_1_docker_java_staza">Faza 1 : docker-java staza</h2> <div class="sectionbody"> <div class="paragraph"> <p>Prvi refleks : Docker Java klijent korišćen od Testcontainers šalje verziju API`1.32`u njegovom HTTP handshake-u, ali Docker Engine 29.4.1 zahteva najmanje`1.40`. Проблем је на нивоу клијента, не демона.</p> </div> <div class="paragraph"> <p>Провера верзије docker-java решена од стране Testcontainers 1.20.6:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ ./gradlew dependencies --configuration testRuntimeClasspath | grep docker-java +--- com.github.docker-java:docker-java-api:3.4.1 +--- com.github.docker-java:docker-java-transport:3.4.1</code></pre> </div> </div> <div class="paragraph"> <p>docker-java 3.4.1, datira iz Testcontainers 1.20.6. Najnovija javna verzija docker-jave je 3.5.1. Pokušamo da prisilimo na nadogradnju verzije kroz`resolutionStrategy`у блоку`configurations` de <code>build.gradle</code>:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">configurations { all { resolutionStrategy.eachDependency { details -> if (details.requested.group == "com.github.docker-java" && details.requested.name.startsWith("docker-java")) { details.useVersion("3.5.1") } } } }</code></pre> </div> </div> <div class="paragraph"> <p>Ponovno pokretanje izgradnje. Ista greška:`client version 1.32 is too old`.</p> </div> <div class="paragraph"> <p>Провера Gradle кеша: JAR-ови су успешно поново преузети, али грешка остаје. docker-java 3.5.1 увек шаље`1.32`. Ova verzija nije dovoljna za Docker Engine 29.4.1.</p> </div> <div class="paragraph"> <p><strong>Акција чишћења</strong>Očisti potpuno keš Gradle, radi slučaja</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">rm -rf ~/.gradle/caches rm -rf /path/to/project/.gradle</code></pre> </div> </div> <div class="paragraph"> <p>Ponovni pokret nakon čišćenja. Ista greška.</p> </div> </div> </div> <div class="sect1"> <h2 id="_faza_2_web_pretraga_i_github_krumplin">Faza 2: web pretraga i GitHub krumplin</h2> <div class="sectionbody"> <div class="paragraph"> <p>docker-java 3.5.1 je nedovoljan. Ostaje samo da se proveri da li je neko susrešao ovaj tačan problem.</p> </div> <div class="paragraph"> <p>Ciljana pretraga na problemima testcontainers-java i docker-java :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">site:github.com/testcontainers "client version 1.32 is too old" site:github.com/docker-java "client version 1.32" Docker Engine 29</code></pre> </div> </div> <div class="paragraph"> <p>Prvi neposredni rezultati :</p> </div> <div class="ulist"> <ul> <li> <p><a href="https://github.com/testcontainers/testcontainers-java/issues/11210">testcontainers-java#11210</a>—<code>[Bug]: client version 1.32 is too old. Minimum supported API version is 1.44</code></p> </li> <li> <p><a href="https://github.com/testcontainers/testcontainers-java/issues/11212">testcontainers-java#11212</a>—<code>[Bug]: Docker 29.0.0 could not find a valid Docker environment</code></p> </li> <li> <p><a href="https://github.com/testcontainers/testcontainers-java/issues/11491">testcontainers-java#11491</a>—<code>[Bug]: Incompatibility in Ubuntu Github runners with Docker Engine 29.1.*</code></p> </li> </ul> </div> <div class="paragraph"> <p>Нита Ариадне је јасна: Docker Engine 29.x је повео свој минималан API на`1.24`(стари дефект) у`1.40`. Testcontainers 1.20.x koristi docker-java 3.4.x koji pregovara verziju API-ja slanjem`1.32`. Daemon ljubazno ali tvrdohladno odbija.</p> </div> <div class="paragraph"> <p>У проблему #11491, одржавач одговара:</p> </div> <div class="paragraph"> <p><em><em>_ Zdravo, imam projekat koji radi na verziji 2.0.3 na GH runneru sa engine-om 29.1 i radi. Молим вас, проверите да ли нема конфликта верzije? Molimo, sećajte se da su svi moduli prefiksirani sa`testcontainers-<code>. Zato, počevši od verzije 2.x, prešli smo od`postgresql</code> to <code>testcontainers-postgresql</code> </em>_</em></p> </div> <div class="paragraph"> <p>Ovaj odgovor sadrži<strong>dve kritične informacije</strong>:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Testcontainers 2.0.3+ rešava problem</p> </li> <li> <p>Moduli su bili<strong>preimenovani sa prefiksom `testcontainers-</strong></p> </li> </ol> </div> </div> </div> <div class="sect1"> <h2 id="_faza_3_zamka_preimenovanih_artefakata">Faza 3 : zamka preimenovanih artefakata</h2> <div class="sectionbody"> <div class="paragraph"> <p>Preimenuvanje je brutalno. U Testcontainers 2.x, ni jedno od starih imena ne radi pod tim imenom:</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> <col style="width: 10%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Старо име (1.x)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Novo ime (2.x)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>org.testcontainers:postgresql</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>org.testcontainers:testcontainers-postgresql</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>org.testcontainers:jdbc</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>org.testcontainers:testcontainers-jdbc</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>org.testcontainers:junit-jupiter</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>org.testcontainers:testcontainers-junit-jupiter</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>org.testcontainers:testcontainers</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">непромењен</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Prvi pokušaj : primeniti BOM Testcontainers 2.0.5 i nova imena artefakata u`build.gradle`.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">dependencies { testImplementation platform("org.testcontainers:testcontainers-bom:2.0.5") testImplementation "org.testcontainers:testcontainers-postgresql" testImplementation "org.testcontainers:testcontainers-jdbc" testImplementation "org.testcontainers:testcontainers-junit-jupiter" testImplementation "org.testcontainers:testcontainers" }</code></pre> </div> </div> <div class="paragraph"> <p><code>./gradlew build</code></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">FAILURE: Could not find org.testcontainers:jdbc:2.0.5. Could not find org.testcontainers:junit-jupiter:2.0.5.</code></pre> </div> </div> <div class="paragraph"> <p><strong>BOM testcontainers-bom nije dovoljan.</strong>Зашто? Пошто Spring Boot 3.4.5 излага свој BOM за управљање зависиснца (<code>spring-boot-dependencies</code>) ко<strong>победи</strong>на BOM-u Testcontainers у transitivnoj rezoluciji. Spring Boot исправља.<code>testcontainers</code> à <code>1.20.6</code>, i zato svi artefakti koji nisu eksplicitno u BOM-u Spring Boot ( kao noviji`testcontainers-*<code>) razrešavaju se ka starim imenima`1.20.6</code>-- koji više ne postoje u ovoj verziji.</p> </div> <div class="paragraph"> <p>Prilikom inspekce`dependencies --configuration testRuntimeClasspath`, nalazi se :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">+--- org.testcontainers:testcontainers -> 1.20.6 (*) | \--- org.testcontainers:testcontainers:2.0.5 -> 1.20.6</code></pre> </div> </div> <div class="paragraph"> <p>Le <code>→`označuje zamenu: Testcontainers 2.0.5 je <strong>zahtevan</strong>, ali Spring Boot prisiljuje`1.20.6</code>.</p> </div> <div id="diag-bom-war" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam handwritten false skinparam componentStyle rectangle left to right direction component "build.gradle\n(potrošač)" as BG #E3F2FD { rectangle "zahtev\n`testcontainers-bom:2.0.5" as REQ rectangle "захтев `testcontainers-postgresql" as REQ2 } component "Maven Central" as MC #FFF3E0 component "Izjave" as DEC #E8F5E9 { rectangle "testcontainers-bom:2.0.5`\nfiksirano 2.0.5" as BOM2 rectangle "spring-boot-dependencies:3.4.5`\nисправљено 1.20.6" as BOM1 } component "Решење Gradle" as RES #FFEBEE { rectangle "Pobednička verzija `testcontainers:1.20.6" as WIN #EF9A9A } BG --> DEC : "analiziraj BOM-ove" BOM2 --> RES : "предлаже 2.0.5" BOM1 --> RES : "предлага 1.20.6" WIN -> MC : "preuzmi testcontainers:1.20.6" note bottom of WIN Spring Boot BOM prime car le plugin spring-boot applique ses dépendances de gestion après la résolution du consommateur end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_faza_4_prisiljavanje_resolucije">Faza 4: prisiljavanje resolucije</h2> <div class="sectionbody"> <div class="paragraph"> <p>Strategija postaje dvostruka:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Postaviti docker-java na verziju 3.7.1 (testirana kao kompatibilna sa Docker Engine 29)</p> </li> <li> <p>Prisiliti Testcontainers core na 2.0.5 obilazeći Spring Boot BOM</p> </li> </ol> </div> <div id="diag-resolution-override" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam handwritten false skinparam componentStyle rectangle left to right direction component "build.gradle (uz resolutionStrategy)" as BG #E8F5E9 { rectangle "BOM Testcontainers `2.0.5" as BOM2 rectangle "resolutionStrategy\n.eachDependency" as RS #66BB6A } component "Конфликт решен" as RESOLVED #E3F2FD { rectangle "docker-java `3.7.1` (prisilno)" as DJ rectangle "testcontainers `2.0.5` (prisiljeno)" as TC #81C784 rectangle "testcontainers-postgresql `2.0.5" as TPG rectangle "testcontainers-jdbc `2.0.5" as TJ rectangle "testcontainers-junit-jupiter\n`2.0.5" as TJJ } component "BOM Spring Boot\n(implicitno, prekrženo)" as BOM1 #FFEBEE component "Maven Centar" as MC #FFF3E0 BG --> RESOLVED : "BOM Testcontainers 2.0.5 prosto prolazi" RS -> DJ : "sila 3.7.1" RS -> TC : "sila 2.0.5" RESOLVED --> MC : "preuzmi JAR-ove\nkompatibilne sa Docker 29" BOM1 -[#gray,dashed]-> RESOLVED : "пропуштено на testcontainers\nи docker-java" note bottom of RS Le `eachDependency` intercepte la résolution Gradle AVANT que le BOM Spring Boot ne gagne. C'est une intervention chirurgicale. end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Коначна исправка</strong>у`build.gradle`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">configurations { all { resolutionStrategy.eachDependency { details -> if (details.requested.group == "com.github.docker-java" && details.requested.name.startsWith("docker-java")) { details.useVersion("3.7.1") } if (details.requested.group == "org.testcontainers" && details.requested.name == "testcontainers") { details.useVersion("2.0.5") } } } } dependencies { testImplementation platform("org.testcontainers:testcontainers-bom:2.0.5") testImplementation "org.testcontainers:testcontainers-jdbc" testImplementation "org.testcontainers:testcontainers-junit-jupiter" testImplementation "org.testcontainers:testcontainers-postgresql" testImplementation "org.testcontainers:testcontainers" // ... autres dépendances Spring Boot }</code></pre> </div> </div> <div class="paragraph"> <p>Le `resolutionStrategy.eachDependency`једин начин за обилазак BOM`spring-boot-dependencies`upravljeno pluginom Spring Boot. Test jednakosti na`details.requested.name == "testcontainers"`Namerno je ograničeno: prisiljujemo samo core modul. Module`testcontainers-*`Sledeju BOM Testcontainers 2.0.5 koji smo eksplicitno naveli.</p> </div> </div> </div> <div class="sect1"> <h2 id="_konačni_rezultat">Konačni rezultat</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ ./gradlew build --no-daemon > Task :consoleLauncherTest [2 containers found] [2 containers started] [2 containers successful] BUILD SUCCESSFUL in 1m 16s</code></pre> </div> </div> <div class="paragraph"> <p>Testcontainers 2.0.5 + docker-java 3.7.1 konačno uspevaju da kreiraju svoje PostgreSQL kontejnere putem Docker Engine 29.4.1. Konačna poslovna greška (HTTP 500 na Cucumber testu) je problem u aplikaciji potpuno nezavisno od skripte za grade.</p> </div> </div> </div> <div class="sect1"> <h2 id="_табела_сажетак_исправка">Табела сажетак исправка</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 25%;"> <col style="width: 25%;"> <col style="width: 25%;"> <col style="width: 25%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">#</th> <th class="tableblock halign-left valign-top">datoteka</th> <th class="tableblock halign-left valign-top">Проблем</th> <th class="tableblock halign-left valign-top">Исправка</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>buildSrc/src/main/groovy/jhipster.cucumber-conventions.gradle</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">promenljiva`reportsDir`nepostojeca</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>outputs.dir(cucumberReportsDir)</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>buildSrc/src/main/groovy/jhipster.cucumber-conventions.gradle</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`main`zastareo Gradle 9</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>mainClass</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>build.gradle</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`sourceCompatibility`top-level zabranjeno Gradle 9</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">блок`java { sourceCompatibility = JavaVersion.VERSION_21 }`</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">4</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>build.gradle</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Sintaktički neispravna Groovy assertion</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>assert …​ in ["17", "21", "23", "24"]</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>build.gradle</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Implicitna zavisnost`compileKotlin`</think> (empty)<code>openApiGenerate</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>afterEvaluate { tasks.named("compileKotlin").dependsOn("openApiGenerate") }</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">6</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>gradle.properties</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`gitPropertiesPluginVersion`nekompatibilan Java 21</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>2.5.7</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">7</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Keš Gradle</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">docker-java 3.5.1 testiran, rešen ali nedostavan</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Обриши + прелазак docker-java 3.7.1</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">8</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>build.gradle</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Testcontainers 1.20.6 je nekompatibilan sa Docker Engine 29</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Prisiljenje Testcontainers 2.0.5 + prefiks`testcontainers-*`+ resolutionStrategy vs Spring Boot BOM</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ако ваш JHipster/Gradle build падне nakon подијања верзије на Gradle 9 + Docker Engine 29, грешке се подељују на две категорије :</p> </div> <div class="paragraph"> <p><strong>Greške u skripti za gradnju</strong>(prvih 6) : Gradle 9 uklanja svojstva i sintakse koje su radile veoma godinama (<code>sourceCompatibility=</code>, <code>main =</code>, <code>reportsDir</code>). Ovo su mehaničke migracije jednom kada upoznamo novi API.</p> </div> <div class="paragraph"> <p><strong>Greške u izvršavanju Docker</strong>(последње две) : Docker Engine 29.4.1 odbacuje klijente API < 1.40. Testcontainers 1.20.6 (impozovan od strane Spring Boot 3.4.5) koristi docker-java 3.4.1 koji šalje 1.32. Jedino Testcontainers 2.0.5 + docker-java 3.7.1 rešava problem, sa preimenovanjem artefakata i prisilivanjem verzije via`resolutionStrategy.eachDependency`kao jedini način da se obiđe implicitni BOM u Spring Boot-u.</p> </div> <div class="paragraph"> <p>Gradle build skript u korenu projekta je sada čist.`./gradlew build`користи Java 21, Gradle 9.4.1, Spring Boot 3.4.5 и Docker Engine 29.4.1.</p> </div> </div> </div> https://cheroliv.com/blog/2026/0108_gouvernance_agent_opencode_eager_lazy_post.html Fri, 24 Apr 2026 00:00:00 +0000 blog/2026/0108_gouvernance_agent_opencode_eager_lazy_post.html <div class="sect1"> <h2 id="_sažetak">Sažetak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kada radimo sa AI agentom kao što je Opencode na složenim projektima preko više sesija, suočavamo se s temeljnim problemom:<strong>izbeganje konteksta</strong>. Agent ne pamti prethodnu sesiju. Sve što mu je objasnjeno — arhitektura, konvencije, stanje backloga — je izgubljeno. Rekonstruisanje ovog konteksta na svakoj sesiji je skupo, sporo i izvor greške.</p> </div> <div class="paragraph"> <p>Ovaj članak izlaga ručnu strategiju koju sam izradio da rešim ovaj problem: postojani sistem upravljanja baziran na AsciiDoc fajlovima, sa dihotomijom.<strong>žestan/len</strong>за оптимизацију консумције токена контекста, и једна<strong>obavezna procedura završetka sesije</strong>да осигурамо непрестаност.</p> </div> </div> </div> <div class="sect1"> <h2 id="_scena_ponedeljak_21_april_900">Scena : Ponedeljak, 21. april, 9:00</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ponovo otvaram Opencode da nastavim sa mojim Gradle pluginom`plantuml-plugin`. Јуче увече, ja sam provela tri sata razgovarajući sa agentom arhitekture pool-a API ključeva — rotacija round-robin, upravljanje kvotama, automatski fallback. Sutra ujutru, agent me gleda sa očima ribice.</p> </div> <div class="paragraph"> <p><em><em>_ — Здраво, ја сам ваш асистент Opencode. Како могу да вам помогнем данс? </em>_</em></p> </div> <div class="paragraph"> <p>Nema — Ah da, pool API ključeva, Bili smo na strukturi YAML. Nema — Pažnja,<code>PlantumlManager`је singleton объект Kotlin, а не класа. Није — Не, смо одлучили вчера да`SyntaxValidationResult`ostajala je jedna sealed class ugniježdena u`PlantumlService</code>.</p> </div> <div class="paragraph"> <p>Sve mora da se uradi ponovo. Ili bolje rečeno: sve mora da se ponovo objasni. Ja ću provesti prvih dvadeset minuta svoje sesije da rekonstruišem kontekst koji je agent već imao u ruci juče. Dvadeset minuta ispaljenih tokena. Dvadeset minuta kada bih mogao da kodiram, ali umesto toga radim obaveznu pedagošku radnju.</p> </div> <div class="paragraph"> <p>Ovo nije greška Opencode. To je sama priroda konverzacionih LLM: između dve sesije, radna memorija je<strong>potpuno izbrisana</strong>. Agent se ne seća prethodne misije, donošenih odluka, identificiranih zamki, koda koji smo zajedno napisali.</p> </div> <div class="paragraph"> <p>Preživeo sam to desetkrat. Na četiri simultanih projekata. S sesijama koje se nastavljaju nedeljama. Izračunao sam: u proseku,<strong>30–40 % vremena sesije</strong>bio je posvećen rekontekstualizaciji agenta. Na sesiji 87 projekta`plantuml-plugin`, sam se pukao. Ne mogu više da si dovolim da ponovo objasním za deseti put da`AttemptEntry`је top-level data class у`DiagramProcessor.kt`.</p> </div> <div class="paragraph"> <p>Mi je trebalo sistem. Ne, nije hack. Pravilno upravljanje.</p> </div> </div> </div> <div class="sect1"> <h2 id="_генезис_од_хаоса_до_метода">Генезис : од хаоса до метода</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_prve_sesije_vek_tame">Prve sesije : Vek tame</h3> <div class="paragraph"> <p>Мој први пројекат са Opencode,<code>plantuml-plugin</code>, pokrenuo se bez ikave upravljanja. Postavljam pitanje, agent odgovara, ponavljamo, sesija se završava, a sutra počinjemo od nule. To je bila sesija 1, pa sesija 2, pa sesija 3…​ do sesije 62 kada sam shvatio da sam gubio kumulativno sate objašnjavajući istu arhitekturu.</p> </div> <div class="paragraph"> <p>Na sesiji 62, brojevi su tu:<strong>198 jediničnih testova prolazi</strong>, <strong>42 validiranih funkcionalnih testova</strong>, plugin radi. Ali kognitivni trošak je nesnošljiv. Svaka nova sesija počinje dvadesetminutnim monologom o strukturi projekta.</p> </div> </div> <div class="sect2"> <h3 id="_epozod_site_yml_uništen_sesija_2_bakery_plugin">Epozod site.yml uništen (Sesija 2, bakery-plugin)</h3> <div class="paragraph"> <p>Metoda nastaje i od katastrofe. Na projektu`bakery-gradle`, na sesiji 2, tražim od agenta da izmeni fajl`site.yml`. Agent, ne proveravajući da li je datoteka verzionisana, pravi`Write`complet qui écrase le contenu. Résultat : les tokens réels (clés API Firebase, secrets de déploiement) sont remplacés par des placeholders factices. Le fichier n’était pas dans git — il était dans</p> </div> <div class="paragraph"> <p>Wait we need to output translated text, not original. I mistakenly output original. Let’s produce the translation we derived.</p> </div> <div class="paragraph"> <p>Thus final:</p> </div> <div class="paragraph"> <p>" koji prepisuje sadržaj. Rezultat: istinski tokeni (Firebase API ključevi, sekreti za implementaciju) zamijenjeni su lažnim placeholderima. Fajl nije bio u git — bio je u"</p> </div> <div class="paragraph"> <p>Make sure leading space before "koji". Let’s output exactly that.</p> </div> <div class="paragraph"> <p></think></p> </div> <div class="paragraph"> <p>koji prepisuje sadržaj. Rezultat: istinski tokeni (Firebase API ključevi, sekreti za implementaciju) zamijenjeni su lažnim placeholderima. Fajl nije bio u git — bio je u`.gitignore`Да заштитимо тајне.</p> </div> <div class="paragraph"> <p>Bez rezervne kopije. Bez`git restore`possible. Zaključan sam. Treba mi ručno da ponovo konstruišem fajl konfiguracije, da pronađem tokene u svojim menadžerima lozinki, sve da ponovo spajem.</p> </div> <div class="paragraph"> <p>Od ove frustracije se rodila<strong>Apsolutno pravilo 1b</strong> :</p> </div> <div class="paragraph"> <p><em><em>_ <strong>Никогда не дробити</strong>jedan konfiguracioni fajl sa jednim`Write`kompletan kada je jedan`Edit`Delimično je dovoljno.<strong>Nikada ne zameni</strong>чувствитих вредности фалшивим вредностима<strong>Proveriti <code>git check-ignore</code> i `git ls-files</strong>pre bilo koje modifikacije. </em>_</em></p> </div> <div class="paragraph"> <p>Ovo pravilo, danas usečeno u mramor svih mojih datoteka`AGENT.adoc` et `INDEX.adoc`na četiri projekta, nastala je iz stvarne greške koja mi je koštala jedan sat ručnog rada</p> </div> </div> <div class="sect2"> <h3 id="_migracija_markdown_asciidoc_sesija_1_cheroliv_com">Migracija Markdown → AsciiDoc (Sesija 1, cheroliv.com)</h3> <div class="olist arabic"> <ol class="arabic"> <li> <p>aprila 2026., na`cheroliv.com`, Ja donosim radikalnu odluku: konvertirati cjelokupno upravljanje Markdowna u AsciiDoc. To nije estetsko. To je funkcionalno. AsciiDoc nudi semantičku strukturu koju LLM bolje čitaju: hijerarhijske sekcije, tipovani tabele, napomene (<code>NOTE</code>, <code>WARNING</code>, <code>CAUTION</code>), atributi dokumenta čitljivi mašinom.</p> </li> </ol> </div> <div class="paragraph"> <p>Sesija 1 od`cheroliv.com`formalizuje strukturu:</p> </div> <div class="ulist"> <ul> <li> <p>Konverzija`AGENTS.md` en <code>AGENT.adoc</code></p> </li> <li> <p>Креирање специijalних агентов :`CODER.adoc`, <code>SCRUM_MASTER.adoc</code>, <code>PLANTUML_DESIGNER.adoc</code></p> </li> <li> <p>Kreiranje Eager/Lazy strukture:`INDEX.adoc`, <code>SESSIONS_HISTORY.adoc</code>, <code>AGENT_SESSION_MANAGER.adoc</code>, <code>SESSION_CHECKLIST.adoc</code>, <code>PROCEDURES.adoc</code></p> </li> </ul> </div> <div class="paragraph"> <p>Jedna potvrda:`90975e9 refactor: migrate agent governance from Markdown to AsciiDoc`. I sajt nastavlja da radi.</p> </div> <div id="diag-timeline" class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam handwritten false title Evolucija sesija — od sesije 1 do 150+ legend top |= Couleur |= Projet | | <#4CAF50> | cheroliv.com | | <#2196F3> | plantuml-plugin | | <#FF9800> | bakery-plugin | | <#9C27B0> | magic-stick | endlegend concise "Активне Сесије" as S @S 0 is ".md bruta" 1 is "Миграција\nAsciiDoc" 10 is "Eager/Lazy formalizovan" 62 is "Правило сигурност\n(site.yml)" 87 is "krakiranje kontekst" 109 is "Оптимизација -60% токени" 133 is "133 сесија 240 тестова прошли" S@0 -> S@1 : Session 1\n(cheroliv.com) S@1 -> S@10 S@10 -> S@62 : Session 62\n(plantuml-plugin) S@62 -> S@87 : Session 87\n(Cry 4 help) S@87 -> S@109 : Session 109\n(API Key Pool) S@109 -> S@133 : Session 133\n(Aujourd'hui) @enduml</pre> </div> </div> <div class="paragraph"> <p>Vremenska linija iznad ilustruje stvarni napredak. Tačka prelomnica je sesija 87: to je mesto gde frustracija ponovnog rekontekstualizacije prelazi granicu tolerancije, i metoda Eager/Lazy prestaje da bude samo ideja i postaje obaveza.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_strategija_eagerlazy_u_dubini">Strategija: Eager/Lazy u dubini</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_философија_рачунарски_кеш_применjen_у_когницији">Философија : рачунарски кеш применjen у когницији</h3> <div class="paragraph"> <p>Moj pristup se direktno inspiracije keširanjem u računarstvu. Sve što je<strong>kritički i često korišćen</strong>treba da bude odmah dostupno (<strong>Žedan</strong>). Sve šta je<strong>kontekstualni ili volumni</strong>Треба да се учита на захтев<strong>len</strong>).</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6666%;"> <col style="width: 6.6676%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Eager (tabla bord)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Lazy (priručnik vlasnika)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Veličina</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">< 100 linija, < 10k tokena</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Neograničeno, detaljno</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Učitavanje</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Auto, na početku sesije</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Na zahtev agenta</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Садржај</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Apsolutna pravila, tekuća misija, kritično stanje</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">архиве сесија, поволна историја, детаљне процедуре, техничке референце</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>uloga</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Orientiraj agenta odmah</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Одговорити на дубока контекстуална питања</p></td> </tr> </tbody> </table> </div> <div class="sect2"> <h3 id="_eager_datoteke_tabla_borda">Eager datoteke : tabla borda</h3> <div class="paragraph"> <p>Ovi fajlovi žive u korenu svakog projekta i automatski se učitavaju agentom na početku svake sesije. Oni čine le<strong>tabla nadzora</strong>-- kritična informacija, odmah dostupna.</p> </div> <div id="diag-eager-lazy" class="listingblock"> <div class="content"> <pre>@startuml skinparam defaultTextAlignment center skinparam wrapWidth 200 package "Корен пројекта (Eager - аутоматски учитаван)" { component "<b>AGENT.adoc</b> Апсолутна правила Структура и конвенције" as AGENT component "<b>PROMPT_REPRISE.adoc</b>\nМиссија сесије N\nСажетак N-1" as PROMPT component "<b>INDEX.adoc</b> тачка улаза Правила + Сесије" as INDEX component "<b>*_ESSENTIALS.adoc</b>\nPoslovni kontekst\nkritičan" as ESS } package ".agents/ (Lazy - Učitan na zahtev)" { component "<b>sessions/N-*.adoc</b> Detaljni arhivi Odluke & Output" as SESS component "<b>SESSIONS_HISTORY.adoc</b>\nТабела сажетака\nДатум/Тип/Поен" as HIST component "<b>PROCEDURES.adoc</b> Шаблони за крај сесије 6 корака" as PROC component "<b>*_REFERENCE.adoc</b>\nПуна архитектура\nТехничке референце" as REF component "<b>COMPLETED_TASKS_ARCHIVE</b>\nZavršeni zadaci\nPo mesecima" as ARCH component "<b>AGENT_MODUS_OPERANDI.adoc</b> Документација стратегије Методологија" as MOD component "<b>*_REFERENCE.adoc</b> Boot testovi, particija A/B Specifični konteksti" as SPEC } AGENT --> PROMPT : "Reference" AGENT --> INDEX : "Reference" INDEX --> SESS : "indeksira" INDEX --> HIST : "indeksira" INDEX --> PROC : "Референца" INDEX --> ARCH : "Референца" INDEX --> REF : "Референца" PROMPT --> SESS : "Arhiva N-1" PROMPT --> ESS : "Poslovni kontekst N" @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>AGENT.adoc</strong>-- Главна датотека. На`cheroliv.com`, ima 200 linija i sadrži:</p> </div> <div class="ulist"> <ul> <li> <p>Апсолутна правила пројекта (не дозволено комит без дозволе, није`rm`без потврде)</p> </li> <li> <p>Структура пројекта и конвенције кода</p> </li> <li> <p>Основне команде (<code>./gradlew serve</code>, <code>./gradlew test</code>)</p> </li> <li> <p>epopeji i proizvodni backlog (prioritetne korisničke priče)</p> </li> <li> <p>Попречни критеријуми квалитета (приступност, респонсив, совместимост)</p> </li> </ul> </div> <div class="paragraph"> <p>На`bakery-plugin`, Правило 0 је различно :<strong>./gradlew -q publishToMavenLocal` obavezan nakon svake izmene izvornog koda</strong>. Zbog testiranja plugina bez ponovnog objavljivanja lokalnog JAR-a izgubio sam sat da ispravim kod koji još nije bio pakovan.</p> </div> <div class="paragraph"> <p><strong>PROMPT_REPRISE.adoc</strong>-- Misija tekuće sesije. Ažurira se na kraju svakog sesije, sadrži :</p> </div> <div class="ulist"> <ul> <li> <p>Broj sesije i prioritetna misija</p> </li> <li> <p>Сводак претходне сесеције (Шта је урадино, шта остаје да се уради)</p> </li> <li> <p>Kriterijumi prihvatanja trenutne sesije</p> </li> <li> <p>Specifični tehnički podsetnici</p> </li> </ul> </div> <div class="paragraph"> <p><strong>.agents/INDEX.adoc</strong>-- On sažima apsolutna pravila, nedavne sesije, i posebno le<strong>portfelj projekata</strong>upravljeni istom metodologijom. Do sada, pet projekata je navedeno :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">---- ---- | magic-stick | Session 23 | SCRIPT_VERIFICATION.adoc | 2026-04-27 | | bakery-gradle | Session 11 | TEST_COVERAGE_ANALYSIS | 2026-04-27 | | cheroliv.com | Session 9 | TEST_COVERAGE_ANALYSIS | 2026-04-27 | | plantuml-gradle| Session 133| TEST_COVERAGE_ANALYSIS | 2026-04-23 | | jhipster-gradle-plugins | Session 1 | TEST_COVERAGE_ANALYSIS | 2026-04-28 | ---- **`*_ESSENTIALS.adoc`** -- Novi dodatak (Sessija 109, plantuml-plugin) za dodatnu optimizaciju Eager konteksta. Umesto da učitam 200 linija poslovnog konteksta na pulu ključeva API, učitam 50 linija osnovnog sadržaja, a ostalih 150 linija ostaje LAZY u`*_REFERENCE.adoc`. Izmeren rezultat : prelazak od**~25k tokeni EAGER do ~10k tokeni**(poboljšanje od 60%). Agentu više nisu potrebni energetski zahtevni podsetnici. ==== Nedostajuća veza : `opencode.json Moram vam priznati nešto što sam skoro zaboravio da dokumentiram. Iznad svih ovih .adoc fajlova, postoji mali JSON fajl bez kojega ništa ne radi. Zove se`opencode.json`i on pravi šest linija. Doslovno šest linija. [source,json] ---- { "$schema": "https://opencode.ai/config.json", "instructions": [ "AGENT.adoc" ] } ---- Ovaj fajl kaže Opencodu : « Pri pokretanju, učitaj`AGENT.adoc`automatski. » Bez njega, agent je prazna stranica tako sam ga opisivao na početku članka. Sa njim, agent već ima u rukama apsolutna pravila, arhitekturu projekta, i osnovne komande — pre nego što sam izreo zdravo. Slučajno sam otkrio važnost ovog fajla. Na`bakery-plugin`, ne postojalo. Srdžalo mi se zašto je agent sistematički više « gubljen » na ovom projektu nego na drugima. Apsolutna pravila bila su dobro u`AGENT.adoc`— ali`AGENT.adoc`Није био укључен. Агент је читао само што сам му рекао да чита, ручно, на svakoj сессии. Била је сесија 11 де`bakery-plugin`када сам уочио отсутство`opencode.json`. Ja sam ga stvorio — i sesija 12 je pošla kao ostale. Ovaj fajl je baš očigodan za mene sada da nisam više mislio na nj. Klasična greška razvojača koji previše poznaje svoj alat. Danas ga kreiram sistematski *unapred*.`AGENT.adoc`. Ово је прва стена. ==== Dualnost `INDEX.adoc Još jedna тонкост која заслујује да буде изглашена:`INDEX.adoc`živi u`.agents/`— fajl koji sam predstavio kao LAZY. Umeđeno, ga listam kao EAGER u svim mojim tabelama. Ovo je vidljiva napetost ovde. Stvarnost na terenu : fajlovi`.agents/INDEX.adoc`su automatski dobro učitani na početku sesije, jednako kao`AGENT.adoc` et `PROMPT_REPRISE.adoc`. Oni su u`.agents/`za organizacione razloge — ne uđi u koren — ali njihovo ponašanje je EAGER. na`plantuml-plugin`, `INDEX.adoc`ima 200 linija i sadrži apsolutna pravila *kompletna* sa njihovom istorijom (lekcije iz prošlih sesija), EPIC-ovi sa skorovima i portfelj projekata. To je dokument koji agent konsultuje da zna « gde smo ». Na`bakery-plugin`, on je 150 linija sa roadmapom i recentnim sesijama. Dobrovoljna redundantnost između`AGENT.adoc` et `INDEX.adoc`Може да збуњи. Апсолутна правила присутна су у обоји. Зашто ? Пошто испиђују две различите улоге: у`AGENT.adoc`, one su *objasnjujuće* (pričanje o pravilu, naučena lekcija) ; u`INDEX.adoc`, one su *izvršne* (prazno pravilo, bez giustifikacije, za brzu konsultaciju). Agent čita`AGENT.adoc`jednom za *comprendre* ; ponovo čita`INDEX.adoc`на свакој сессии за *примењу*. Два употреба, два формата. [plantuml, format=svg, id=diag-dualite-agent-index, alt="Comparaison entre AGENT.adoc (narratif) et INDEX.adoc (exécutif)"] ---- @startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center title Dualitet AGENT.adoc ←→ INDEX.adoc left to right direction rectangle "AGENT.adoc (Корен — EAGER)" as AGENT #E3F2FD { rectangle "📖 **Narativni format**\nPričanje o pravilu\nNaučena lekcija, kontekst" as NARR rectangle "🏗️ **Kompletna arhitektura** Struktura projekta, komponente Detaljani backlog US" as ARCHI rectangle "📋 **Објаснива правила** Zašto pravilo postoji Istorija incidenta" as EXPL } rectangle "INDEX.adoc (.agents/ — EAGER)" as INDEX #E8F5E9 { rectangle "⚡ **Извршни формат** Наго правило, без обосновања Брза консултација" as EXEC rectangle "📊 **Roadmap & EPICs** Саžетна табела Прогрес, Скор, Приоритет" as ROAD rectangle "**Portfelj projekata** Prečnji pogled 5 sinkronizovanih projekata" as PORT } AGENT --> INDEX : "Agent čita AGENT.adoc\njednom za **razumevanje**" INDEX --> AGENT : "Agent čita INDEX.adoc svaka sesija za **primeniti**" note bottom of AGENT Taille max : 200 lignes end note note bottom of INDEX Taille max : 200 lignes Source de vérité en cas de divergence end note @enduml ---- Ova pretpostavljena redundantnost je izbor dizajna. Ona potrošuje ~50 dodatnih linija tokena EAGER — ali osigurava da agent uvek ima pravila pred sobom, uključujući i koncizni format koji olakšava odmah poslušanje. === LAZY fajlovi: Uputstvo za vlasnika Ovi fajlovi žive u`.agents/`Oni čine istinsko bogatstvo metode, jer nahromadjuju znanje o projektu bez zagađavanja trenutnog konteksta. [plantuml, format=svg, id=diag-agents-tree, alt="Arborescence complète du dossier .agents/"] ---- @startuml skinparam folderBackgroundColor #E3F2FD skinparam folderBorderColor #1565C0 skinparam fileBackgroundColor #FFF3E0 skinparam fileBorderColor #EF6C00 folder ".agents/" as ROOT { file "INDEX.adoc (EAGER -- 200 linija)" as IDX #E8F5E9 file "AGENT_SESSION_MANAGER.adoc (Šablon sesije)" as ASM file "SESSION_CHECKLIST.adoc (Кда променити)" as CHK file "PROCEDURES.adoc\n(6 koraci + LAZY/EAGER)" as PRO file "SESSIONS_HISTORY.adoc\n(Све сесии)" as HIS folder "сесии/" as SESS { file "1-chore-migration.adoc" as S1 file "109-формализација-лењи.adoc" as S109 #FFECB3 file "133-epic11-article.adoc" as S133 file "... +130 ostalih" as SMORE } folder "архиве/" as ARCH { file "COMPLETED_TASKS_2026-04.adoc" as CTA file "SESSIONS_HISTORY_83-95.adoc" as SHIST folder "sesije_sazimci/" as SUM { file "SESSION_64_SUMMARY.adoc" as SU64 file "SESSION_73_SUMMARY.adoc" as SU73 file "..." as SUMORE } folder "arhiva_prompta/" as PARCH { file "PROMPT_REPRISE_S65.adoc" as PR65 file "PROMPT_REPRISE_S75.adoc" as PR75 file "..." as PMORE } } } IDX --> SESS : "indeksiraj" IDX --> HIS : "indeksiraj" IDX --> ARCH : "референца" note right of S109 Session 109 = Formalisation stratégie LAZY/EAGER Token : ~25k → ~10k end note @enduml ---- Gornje stablo prikazuje stvarnu strukturu direktorijuma.`.agents/`na`plantuml-plugin`, najzrelji projekat. Obratite pažnju na dubinu u tri sloja: korenske datoteke (metapodaci), direktorijum`sessions/`(arhivske beleške), i dossier`archives/`(agregacije i sažeci). To je ta dubina koja pretvara upravljanje jedne jednostavne TODO datoteke u**puna organizaciona memorija**. **.agents/sessions/{N}-{titre}.adoc**-- Detaljni arhivi svake sesije. Trenutno : * `plantuml-plugin`:**133 arhiviranih sesija**(od sesije 1 do 133) * `bakery-plugin`:**11 sesija** * `magic-stick`[Translation not possible as no text was provided for translation]**23 sesija** * `cheroliv.com`:**9 формалне сесије**+ 7 pre-sistemski sesiji reconstruisane retroaktivno Svaki arhiv sadrži potpun kontekst sesije, donete odluke, naiđene probleme i njihovo rešenje, izvršene komande i njihovu izlaz. **.agents/SESSIONS_HISTORY.adoc**Табела сажетак свих сесија са поенима. Пример на`cheroliv.com`: ---- | -6 | 2025-05 | chore | Initialisation projet Gradle/JBake | 7/10 | 1 | 2026-04-25 | chore | Migration gouvernance agent | 8/10 | 7 | 2026-04-27 | debug/fix | Correction publishSite | 9/10 | 8 | 2026-04-27 | analyse | Analyse article 0108 | 7/10 **.agents/COMPLETED_TASKS_ARCHIVE_{mois}.adoc**-- Završeni zadaci arhivirani po mesecima, da ne bi se preopteregao aktivni backlog. Kada se user story završi, premješta se ovde. Backlog ostaje čitljiv: maksimalno 10 aktivnih stavki. **.agents/PROCEDURES.adoc**-- Detaljni predlošci postupka završetka sesije. Dug, ali pročitan samo jednom od agenta kada uči metod. Zatim postepanje postaje mehaničko. **.agents/AGENT_MODUS_OPERANDI.adoc**-- Пуна стратегијска документација. На`plantuml-plugin`, ovaj fajl čini**900+ linije**и у ствари се зове`AGENT_METHODOLOGIES.adoc`— promenio sam ime između pisanja ovog članka i njegove efektivne implementacije. Ovaj tip razlike u imenovanju je neizbežan u ručnom sistemu koji se razvija. Važna je konvencija imenovanja: ako fajl dokumentuje *metodu*, počinje sa`AGENT_`ili eksplicitni prefiks. Dokumentuje metodologiju Eager/Lazy, obrasce koje treba slediti, i anti-obrasce koje treba izbegnuti. On je LAZY jer agentu ne mora da ponovo pročita celu strategiju na svakoj sesiji, već samo kada postoji nejednoznačnost. Please provide the French text you would like translated.`*_REFERENCE.adoc`** -- Tehničke reference specifične za projekat. Na`magic-stick`, dva gaustog LAZY fajla: * `AB_PARTITION_REFERENCE.adoc`(147 linija) -- Arhitektura particija A/B GPT, skripte`update-system.sh`, procijenjene veličine, mehanizam vraćanja * `BOOT_TEST_REFERENCE.adoc`(144 linija) -- Procedura QEMU + VNC za testiranje boot-a ISO bez fizičkog hardvera, lista provere BIOS/UEFI, ograničenja CI/CD na`plantuml-plugin` : * `ARCHITECTURE.adoc`(134 линија) -- Структура 11 класа података, тачке на пажњи (избегљиви погрешци), оптимизоване тест команде * `API_KEY_POOL_REFERENCE.adoc`-- Пуне детаљи о пулу кључева (LAZY dok`ESSENTIALS`je EAGER) == Specijalizirani agenti : virtualni tim Uprava se ne ograničava na pasivne datoteke. Formalisao sam**uloge specijalizovanih agenta**u posebnima LAZY fajlovima, koji definišu očekivan radni tok prema tipu zadatka. |=== |agent |Fajl |улага |projekat |**CODER** |`CODER.adoc` |Implementacija FTL/CSS/JS, semantičke oznake, kriteriji pristupačnosti |cheroliv.com |**Scrum master** |`SCRUM_MASTER.adoc` |US planiranje, razlaganje na podzadatke, otkrivanje zavisnosti |cheroliv.com |**PlantUML dizajner** |`PLANTUML_DESIGNER.adoc` |Kreiranje dijagrama, sintaksa PUML, integracija JBake |cheroliv.com |=== Fajl`CODER.adoc`na`cheroliv.com`sadrži konkretna pravila : _jedno`<h1>`po stranica_, _Dodaj putanje sa`${content.rootpath}`_, _Навести језик`<html lang="${content.lang!"fr"}">`_. Ove konvencije, napisane jednom, automatski se poštuju agentom od sesije 1. Datoteka`SCRUM_MASTER.adoc`postavlja strukturu izlagaja :**Cilj**, **Zadaci**(koordinate sa dodelom),**Прихватљиви критеријуми**, **Rizici**. Kada tražim plan akcije, agent proizvodi ovu strukturu bez da sam je zatražila. Uprava**програм**агент. ==== Када специјализовани агенти постају неопходни Kreiranje specijaliziranih agenta slijedi prirodnu krivulju. Na početku projekta, ne trebate ih —`AGENT.adoc`Dovoljno je. Ali kada se projekat povećava (recimo, iznad 20 sesija), dva signala moraju da vas upozore: 1. Agent miješa konvencije dva različita domena (npr. sintaksa PlantUML i pravila CSS) 2. Vi provodite više vremena ispravljajući agenta po konvencijama koje ste mu već pet puta objasnili. На`cheroliv.com`, se dogodilo na sesiji... 1. Da, odmah sa početka. Jer je ovaj projekat veb sajt sa tri jezika (FTL, CSS, JS), sadržaj AsciiDoc i dijagrami PlantUML — tri oblasti koje nemaju ništa zajedničkog. Agentu CODER treba znati veličine fontova i medijske upite; agentu PLANTUML_DESIGNER treba znati sintaksu`@startuml`. Bez razdvajanja, agent CODER mi je ponudivao dijagrame, i obrnuto. Haos. на`jhipster-gradle-plugins`, sam kreirao dva specijalizovana agenta prilagođena za razvoj Gradle pluginova :`PLUGIN_DEVELOPER.adoc` et `BACKLOG_MANAGER.adoc`. Prvi kodira sve konvencije Kotlin/Gradle (ne`!!`, klase podataka za modele,`@TaskAction`за задацима). Други зна da`persistence`mora biti stabilan pre nego što`assistant`не покреће свој развој — критична зависимост у мон-репо. Greška koju ne treba napraviti: kreirati previše agenata previše rano.`plantuml-plugin`Čekao je sesiju 108 pre nego što je formalizovao specijalizovanog agenta za pool ključeva API. Pre toga, poslovni kontekst je bio u`AGENT.adoc`. Empiričko pravilo: specijalizovan agent se justifikuje kada njegov poslovni domen pređe 100 linija dokumentacije. ==== Конвенција о наименовању сесија Detalj koji izgleda beznačajan, ali postaje kritičan kada se dosegne 100 sesija. Kako da imenujemo datoteke arhive? Naukio sam na svojoj koži da je konvencija neophodna — četiri projekta, četiri različita formata na početku, i više sam se ne mogao orijentirati. Danas, konvencija koju sam uspostavio je :</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre></pre> </div> </div> <div class="paragraph"> <p>{N}-{type}-{sujet-kebab-case}.adoc</p> </div> <div class="listingblock"> <div class="content"> <pre>Конкретни примери : * `1-chore-migration-gouvernance-agent.adoc`— сесија 1, тип задатка * `10-solidification-tests.adoc`— sesija 10, bez eksplicitnog tipa (subjekat je dosta) * `036-debug-graphify-symlink-epic9.adoc`— сесија 36 са трицифрен бројем за сортирање Broj sesije je glavni kriterijum za sortiranje. Projekti koji koriste trocifrene brojeve (001, 036, 133) izbegavaju probleme leksikografskog sortiranja kada se prelazi 99. To je šta sada koristim na`magic-stick`:`001-init-projet.adoc`, `036-debug-graphify-symlink-epic9.adoc`. Tip je opcioni i izveden iz ključnih reči sesije (debug, feature, refactor, docs, chore, test). Naslov u kebab-case-u je najvažniji deo: mora da omogući pronalaženje sesije bez otvaranja fajla. Ako se pitate « Koja je bila sesija u kojoj smo ispravili timeout testova integracije? », odgovor je`124-fix-timeout-integration-test.adoc`. Za reconstruisane istorijske sesije (projekti koji su nastali pre upravljanja), koristim negativne brojeve. Na`cheroliv.com`, sesije od -6 do 0 pokrivaju celokupnu pre-vladavinu istoriju projekta. I za sesije « ne dokumentovane » ili izgubljene, napravim unos u`SESSIONS_HISTORY.adoc`без одговарајућег архива, са једним скором`?`. To je poštenije nego da se pretvaramo. [plantuml, format=svg, id=diag-naming-convention, alt="Arbre de décision pour le nommage des fichiers de session"]</pre> </div> </div> <div class="paragraph"> <p>@startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam wrapWidth 200</p> </div> <div class="paragraph"> <p>title Конвенција именовања сесија start</p> </div> <div class="paragraph"> <p>:Une session se termine; note right: Trigger "kraj sesije"</p> </div> <div class="paragraph"> <p>if (Session antérieure\nà la gouvernance ?) then (oui) :Numéro <strong>NÉGATIF</strong>\n-6, -5 …​ 0; note right: Historique\nreconstitué :Suffixe : reconstitution; else (non) :Numéro <strong>POSITIF</strong>\nsur 3 chiffres si > 99; note right: 001, 036, 133\npour le tri lexicographique</p> </div> <div class="literalblock"> <div class="content"> <pre>:Détecter le **TYPE**; if (Mots-clés trouvés ?) then (oui) :debug / feature / refactor\ndocs / chore / test; else (non) :Omettre le type\n(le sujet suffit); endif</pre> </div> </div> <div class="literalblock"> <div class="content"> <pre> :Formuler le **SUJET** en kebab-case; note right Ex: fix-timeout-integration-test Doit permettre de retrouver sans ouvrir le fichier end note endif</pre> </div> </div> <div class="paragraph"> <p>note right • 1-chore-migration-gouvernance.adoc • 036-debug-graphify-symlink.adoc • 124-fix-timeout-integration-test.adoc • 133-epic11-article-blog-kg.adoc end note</p> </div> <div class="paragraph"> <p>if (Session documentée ?) then (oui) :Créer archive dans sessions/; :Ajouter ligne SESSIONS_HISTORY\navec score X/10; else (non) :Ajouter ligne SESSIONS_HISTORY\navec score <strong>?</strong>\n<strong>sans archive</strong>; note right: L’honnêteté\nplutôt que le vide endif</p> </div> <div class="paragraph"> <p>stop @enduml</p> </div> <div class="listingblock"> <div class="content"> <pre>==== TEST_COVERAGE_ANALYSIS.adoc` — Корак 5 разложен Peti korak postupka završetka sesije je najtajniji. Ona kaže « Ažuriraj`TEST_COVERAGE_ANALYSIS.adoc`ako su testovi dodati ili izmenjeni » Ali kako izgleda ovaj fajl? Na`plantuml-plugin`, je se razvijao od nekoliko linija do kompletne strukture. Ovde je njegov stabilizovani oblik : [source]</pre> </div> </div> </div> </div> </div> <h1 id="_analyse_de_couverture_de_tests" class="sect0">Analyse de Couverture de Tests</h1> <div class="sect1"> <h2 id="_suivi_des_tests">Suivi des Tests</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 20%;"> <col style="width: 20%;"> <col style="width: 20%;"> <col style="width: 20%;"> <col style="width: 20%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Classe de test</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Type</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tests</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Statut</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Dernière MAJ</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">PlantumlServiceTest</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">unit</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">45/45</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ PASS</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2026-04-23</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">ApiKeyPoolTest</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">integration</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">15/15</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ PASS</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2026-04-20</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_historique_par_session">Historique par Session</h2> <div class="sectionbody"> <div class="paragraph"> <p>| Session | Tests ajoutés | Tests modifiés | Couverture | 133 | 0 | 2 | 100% | 132 | 5 | 0 | 100%</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 25%;"> <col style="width: 25%;"> <col style="width: 25%;"> <col style="width: 25%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">----</p> <p class="tableblock">Interes nije u samom fajlu — jeste obaveza da <strong>zabeležite</strong> šta se promenilo. Bez ovog koraka, posle 50 sesija, ne znate više koji testovi pokriraju šta. Niti agent. Fajl postaje jedinstveni izvorište istine o pokrivenosti testova projekta.</p> <p class="tableblock">Za projekte bez tradicionalnih testova (kao`magic-stick`koji testira bash skripte), peti korak se zamjenjuje`SCRIPT_VERIFICATION.adoc`. Mehanizam je isti: datoteka koja prati status validacije skriptova. Prilagodite korak 5 svom projektu, ali nikad ne preskočite je. Ona je sigurnosna mreža koja sprečava tiha regresija.</p> <p class="tableblock">Ako vaš projekat nema <strong>nijednog</strong> testa — ni unitarnog, ni funkcionalnog, ni skripta — ipak kreirajte prazan fajl sa sekcijom « Što uraditi: definirati strategiju testiranja. » Ovo je zaklica koja će podsjetiti vašeg budućeg sebe da ova tema nije obrađena.</p> <p class="tableblock">[plantuml, format=svg, id=diag-session-flow, alt="Flux d’une session type avec Eager/Lazy et agents"] ---- @startuml skinparam backgroundColor #FEFEFE</p> <p class="tableblock">start</p> <p class="tableblock">:Début session; note right: L’agent est une page blanche</p> <p class="tableblock">:Chargement EAGER auto; note right * AGENT.adoc (règles absolues) * PROMPT_REPRISE.adoc (mission N) * INDEX.adoc (état projet) end note</p> <p class="tableblock">if (Mission claire ?) then (oui) :Exécution directe; else (non) :Charge LAZY sur demande; note right * SESSIONS_HISTORY.adoc (contexte passé) * sessions/{N-1}-<strong>.adoc (décisions) * *<em>REFERENCE.adoc (architechture) end note endif</p> <p class="tableblock">:Délégation agent spécialisé ?;</p> <p class="tableblock">if (CODER ?) then (oui) :Lit CODER.adoc; :Suit conventions FTL/CSS; elseif (SCRUM Master ?) then (oui) :Lit SCRUM_MASTER.adoc; :Structure livrable imposée; elseif (PlantUML ?) then (oui) :Lit PLANTUML_DESIGNER.adoc; :Syntaxe PUML + intégration; else (non) endif</p> <p class="tableblock">:Travail de la session;</p> <p class="tableblock">:Fin de session (trigger utilisateur);</p> <p class="tableblock">:Procédure 6 étapes; note right 1. Archive sessions/N-</strong>.adoc 2. Maj PROMPT_REPRISE.adoc (N+1) 3. Maj SESSIONS_HISTORY.adoc 4. Maj INDEX.adoc 5. Maj TEST_COVERAGE (si applicable) 6. Maj COMPLETED_TASKS_ARCHIVE.adoc end note</p> <p class="tableblock">:Checklist [✅] x 6;</p> <p class="tableblock">stop @enduml ----</p> <p class="tableblock">Dijagram iznad prikazuje kompletni životni cyklus jedne sesije. Ključna tačka je bifurkacija nakon učitavanja EAGER: ili misija je dovoljno jasna za izravno izvršenje (80% slučajeva), ili agent učitavanje LAZY za rešavanje nejasnoće (20% slučajeva). Ova diskriminacija je ta koja uštedjuje tokene.</p> <p class="tableblock">== Postupak završetka sesije : Zlatno pravilo</p> <p class="tableblock">=== Zašto je neophodna</p> <p class="tableblock">Bez ove procedure, strategija Eager/Lazy ne služi ničemu. To ona pretvara rad sesije u trajnu informaciju. Ona se izvršava<strong>na eksplicitan zahtev korisnika</strong>(ključne reči: "kraj sesije", "odlazim", itd.), i ona je<strong>obavezan</strong>-- nema izuzetaka, nema izostavka.</p> <p class="tableblock">Fajl`SESSION_CHECKLIST.adoc`definiše idealne metrike sesije:</p> <p class="tableblock">* Trajanje: 15-30 minuta * Изменjeni фајлови : максимум 1-3 * LLM razmena: 5-10 poruka * Kontekst tokeni : < 50k</p> <p class="tableblock">И знаци да се промени сесија: _ЛЛМ понавља грешке које су већ исправљене</em>, <em>Више од 3 фајлова изменjenih паралелно</em>, <em>Разговор > 50 порука</em>. Златно правило:<strong>Bolje je imati 5 sesija po 20 minuta nego jednu sesiju od 2 sata sa haosom pri debugovanju.</strong></p> <p class="tableblock">=== Tok 6 koraka (tiho)</p> <p class="tableblock">[plantuml, format=svg, id=diag-end-session-flow, alt="Flux de la procédure de fin de session"] ---- @startuml skinparam defaultTextAlignment center skinparam wrapWidth 200 skinparam activityBackgroundColor #E3F2FD</p> <p class="tableblock">start :L’utilisateur dit "kraj sesije"; note right: Mots-clés déclencheurs</p> <p class="tableblock">:Agent détecte le trigger;</p> <p class="tableblock">:Étape 1\nCréer archive\n`.agents/sessions/N-<strong>.adoc`; note right: Tout le contexte de la session</p> <p class="tableblock">:Étape 2\nMettre à jour\n`PROMPT_REPRISE.adoc`; note right: Mission N + critères d’acceptation N+1</p> <p class="tableblock">:Étape 3\nMettre à jour\n`SESSIONS_HISTORY.adoc`; note right: Ligne récap : # / Date / Type / Sujet / Score</p> <p class="tableblock">:Étape 4\nMettre à jour\n`INDEX.adoc`; note right: État courant, roadmap, fichiers modifiés</p> <p class="tableblock">:Étape 5\nMettre à jour\n`TEST_COVERAGE_ANALYSIS.adoc`; note right: Si tests ajoutés ou modifiés</p> <p class="tableblock">:Étape 6\nMettre à jour\n`COMPLETED_TASKS_ARCHIVE.adoc`; note right: Archiver tâches terminées</p> <p class="tableblock">:Afficher la checklist de confirmation; note right: Vérifier que chaque [✅] est mérité</p> <p class="tableblock">stop @enduml ----</p> <p class="tableblock">=== Rezultati od 150+ sesija</p> <p class="tableblock">Ovo je rezultat primene ove procedure sistematski primenjene na mojim četiri projekata:</p> <p class="tableblock"><strong>plantuml-plugin</strong>:</p> <p class="tableblock">* <strong>133 sesije</strong>од почетка пројекта * <strong>240/240 testova prošlo</strong>(100% покриће) — EPICs 1-7 завршене * <strong>57 сценариоа Cucumber BDD</strong>проверени * Pravilo bezbednosti na datotekama konfiguracije nastalo iz realne greške (Sesija 2 bakery-plugin)</p> <p class="tableblock"><strong>пекарња-плагин</strong>:</p> <p class="tableblock">* <strong>11 sesija</strong>za dve nedelje * Migracija Supabase → Firebase završena (9 ispravljenih testova) * EPIC 6 (publishProfile) funkcionalan u produkciji * Правило 0 креирано :`publishToMavenLocal`obavezan nakon svake izmene</p> <p class="tableblock"><strong>magic-stick</strong>:</p> <p class="tableblock">* <strong>23 sesije</strong>за конструисање live Xubuntu система са A/B партицијом * Prva ISO generisana na sesiji 10 * Testi pokretanja QEMU + VNC formalizovani (dokumentacija LAZY od 144 linija) * CI/CD SourceForge функционалан</p> <p class="tableblock"><strong>cheroliv.com</strong>:</p> <p class="tableblock">* <strong>9 formalnih sesija</strong>+ rekonstrukcija 7 sesija pre-sistema * Članak 0101 (OpenCode PATH) objavljen * Član 0108 (taj) prepisan nakon analize svojih nedostataka * Пуна управа премештена из Markdown у AsciiDoc</p> <p class="tableblock">=== Контрольна листа завршна</p> <p class="tableblock">Nakon tihe izvršavanja šest koraka, agent mora da prikaže listu potvrde :</p> <p class="tableblock">----</p> <p class="tableblock">✅ Procédure de fin de session exécutée 📋 Checklist :</p> <p class="tableblock"><strong>Апсолутно правило</strong>: ниједан чорак не може да буде означен.<code>[✅]`ako fajl nije zapravo izmenjen i proveren.</p> <p class="tableblock">== Bootstrap vodič: Dan 1, Sesija 0</p> <p class="tableblock">Uvereni ste u metodu. Želite da je primenite na novi projekat. Gde da počnete?</p> <p class="tableblock">Preživio sam taj moment 28. aprila 2026. Otvaram Opencode na`jhipster-gradle-plugins</code>, moj mono-repo od dva Gradle JHipster plugina. ovo je projekat koji već postoji — kod je tamo, Gradle zadaci funkcionišu. ali upravljanje agentom ? Nula. Prazna stranica. Kao`plantuml-plugin`на њеној сесији 1, пре месеца.</p> <p class="tableblock">Ovo je tačna procedura koju sam pratio, i koju ću pratiti za svaki novi projekat. Obratite pažnju na redosled — on je važan.</p> <p class="tableblock">[plantuml, format=svg, id=diag-bootstrap, alt="Flux de bootstrap en 6 étapes pour initialiser la gouvernance agent sur un nouveau projet"] ---- @startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam wrapWidth 250 skinparam activityBackgroundColor #E8F5E9</p> <p class="tableblock">title Bootstrap управљање — Дан 1, Сесија 0 start :Étape 0\nCréer <strong>opencode.json</strong>\n(6 lignes, instructions: AGENT.adoc); note right: Le pont qui charge\nAGENT.adoc automatiquement</p> <p class="tableblock">:Étape 1\nCréer les dossiers\n<strong>mkdir -p .agents/sessions/ .agents/archives/</strong>; note right: Les conteneurs vides\navant que l’agent écrive dedans</p> <p class="tableblock">:Étape 2\nCréer <strong>AGENT.adoc</strong>\n(200 lignes, règles absolues); note right: Le fichier maître\nStructure minimale v1</p> <p class="tableblock">:Étape 3\nCréer <strong>PROMPT_REPRISE.adoc</strong>\nMission session 1 (max 70 lignes); note right: Ce que l’agent doit\nfaire à la prochaine session</p> <p class="tableblock">:Étape 4\nCréer <strong>.agents/INDEX.adoc</strong>\nRègles exécutives + roadmap; note right: Point d’entrée EAGER\ndans le dossier LAZY</p> <p class="tableblock">:Étape 5\nCréer les fichiers LAZY structurants\n6 fichiers : SESSIONS_HISTORY, CHECKLIST, etc.; note right • SESSIONS_HISTORY.adoc • SESSION_CHECKLIST.adoc • PROCEDURES.adoc • AGENT_SESSION_MANAGER.adoc • TEST_COVERAGE_ANALYSIS.adoc • Agents spécialisés (si besoin) end note</p> <p class="tableblock">:Étape 6\nAjouter le projet au Portefeuille\nMettre à jour TOUS les INDEX.adoc existants; note right: Maintenance transverse\nObligatoire mais fastidieuse</p> <p class="tableblock">:✅ Bootstrap terminé\nSession 1 prête; note right: 20 minutes investies\nDes centaines économisées</p> <p class="tableblock">stop @enduml ----</p> <p class="tableblock">=== Корак 0: Направи <code>opencode.json</p> <p class="tableblock">Ово је први фајл. не`AGENT.adoc</code>, корак`INDEX.adoc`.<code>opencode.json`Prvo, iz prostog razloga: ako kreirate`AGENT.adoc`Na prvo, ćete zaboraviti da napravite most koji ga automatski učitava. Ja sam ga uradio na`bakery-plugin</code>, ja znam o čemu govorim.</p> <p class="tableblock">=== Корак 1: Креирај фасцикле</p> <p class="tableblock">[source,bash] ---- mkdir -p .agents/sessions .agents/archives ----</p> <p class="tableblock">Два празна фолдера.<code>sessions/`će primiti arhivu svake sesije.`archives/`će primiti mesečne COMPLETED_TASKS_ARCHIVE. Ovi direktorijumi moraju da postoje *pre</strong> nego što agentu treba da piše u njima. Agent koji mora da kreira direktorijum i fajl u isto vreme, to je agent koji može tiho da ne uspe.</p> <p class="tableblock">=== Korak 2: Napraviti `AGENT.adoc</code> — Glavni fajl</p> <p class="tableblock">Minimalna struktura za prvu verziju (će se povećati)</p> <p class="tableblock">[source] ---- = {NOM_PROJET} — Directives Agent</p> <p class="tableblock">[CAUTION] ----</p> <p class="tableblock"><strong>Obavezno zaustavljanje</strong>pre rm, Write, brisanje :</p> <p class="tableblock">1. ПРОЧИТАЙ цео фајл 2. Провери git ls-files 3. Zatražite potvrdu 4. ČEKATI "da</p> <p class="tableblock">== Projekat</p> <p class="tableblock"><strong>Ime</strong>: …​ <strong>Stek</strong>…​ <strong>Документација</strong>: AsciiDoc</p> <p class="tableblock">== Absolutna pravila</p> <p class="tableblock">=== 0. OKRUŽENJE ZA RAZVOJ</p> <p class="tableblock">Основне наредбе…​</p> <p class="tableblock">=== 1. COMMITS/GIT</p> <p class="tableblock">formalna zabrana…​</p> <p class="tableblock">=== 1b. DATOTEKE KONFIGURACIJE — APSOLUTNO PRAVILO SIGURNOSTI</p> <p class="tableblock">Ne drti…​</p> <p class="tableblock">=== 2. ИСПИТИ НА КРАЈУ СЕСИЈЕ</p> <p class="tableblock">Zabrana formalna…​</p> <p class="tableblock">=== 3. POSTUPAK ZAVRŠETKA SESIJE</p> <p class="tableblock">6 obaveznih koraka…​</p> <p class="tableblock">== Управљање контекстом — LAZY/EAGER</p> <p class="tableblock">Datoteke EAGER / Datoteke LAZY…​</p> <p class="tableblock">Ovaj minimali šablon omogućuje agentu da započne. Bogata verzija — sa strukturom projekta, ključnim komponentama, EPIC-ovima, backlog-om — će doći na sesiju 1, kada agent već ima osnovna pravila u ruci i će vam pomoći da obogatite dokument.</p> <p class="tableblock">=== Корак 3: Креирање <code>PROMPT_REPRISE.adoc</code> — Мисција сесија 1</p> <p class="tableblock">Fajl koji eksplicitno kaže: « Ovo je sesija 1, misija treba definirati. » Maksimalno 70 linija, sa sekcijom Sesija 0 (rezime bootstrap-a) i sekcijom Sesija 1 (prioriteti koje treba definisati sa korisnikom).</p> <p class="tableblock">=== Корак 4: Kreirati <code>.agents/INDEX.adoc</code> — Ulazna tačka</p> <p class="tableblock">Fajl koji će sadržati apsolutna pravila (izvršna verzija) i tabelu sesija. Za bootstrapping, on lista pravila 0 do 3 u njihovom konciznom formatu, portfelj projekata (uključujući novi projekt sa emojim 🆕), i praznu roadmapu spremnu za popunjavanje.</p> <p class="tableblock">=== Корак 5: Креирање LAZY структурираних фајлова</p> <p class="tableblock">По реду:</p> <p class="tableblock">1. <code>.agents/SESSIONS_HISTORY.adoc</code>— tabela sa samo sesijom 0 2. <code>.agents/SESSION_CHECKLIST.adoc</code>— шаблон « когда променити сесију 3. <code>.agents/PROCEDURES.adoc</code>— kompletna procedura od 6 koraka + EAGER/LAZY 4. <code>.agents/AGENT_SESSION_MANAGER.adoc</code>— шаблон архиве 5. <code>.agents/TEST_COVERAGE_ANALYSIS.adoc</code>— таблица за праћење тестова, празна на почетку</p> <p class="tableblock">Ako vaš projekat ima složen poslovni domen (kao`jhipster-gradle-plugins`sa njegovim mono-repo persistence/assistant), kreirajte specijalizirane agente odmah:</p> <p class="tableblock">1. <code>.agents/PLUGIN_DEVELOPER.adoc</code>— konvencije koda i granica zavisnosti (ako je plugin) 2. <code>.agents/BACKLOG_MANAGER.adoc</code>— struktura planiranja i identifikovani rizici</p> <p class="tableblock">Ne kreirajte agente koje nećete koristiti. Agent bez konkretnih konvencija za kodiranje je mrtva datoteka koja zagadjuje`.agents/<code>.</p> <p class="tableblock">=== Корак 6 : Додати пројекат у портфељ СВИХ пројеката</p> <p class="tableblock">Ovo je korak koji se sistematički zaboravlja. Svako`INDEX.adoc`Svaki projekt sadrži tabelu 'Portfelj projekata' koja liste sve projekte sa istom metodologijom. Kada kreirate novi projekt, morate:</p> <p class="tableblock">1. Додај ред у портфељу нових пројеката (логика) 2. Додати ред у портфолио свих постојећих пројеката — да, сви</p> <p class="tableblock">Na mojih četiri (sada pet) projekta, to znači otvoriti`INDEX.adoc</code> de <code>magic-stick</code>, <code>bakery-gradle</code>, <code>cheroliv.com</code>, `plantuml-gradle`и додати ту линију`jhipster-gradle-plugins</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Session 1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">…​</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">2026-04-28 🆕<code>.</p> <p class="tableblock">To je mučno. To je ručno. To je i jedini način da se garantuje da, bez obzira na projekat na kojem radite, agenat zna koje druge projekte postoje i kakvo je njihovo stanje. Na sesiji 012 de`magic-stick</code>, agent je detektovao dve neskladnosti u portfelju —`bakery-gradle`je imao njegov COMPLETED_TASKS_ARCHIVE kasno, i`plantuml-gradle`On je imao neslaganje između dokumentacije postupka (5 koraka) i indeksa (6 koraka). Bez ove transverzne tabele, ove neslaganja bi ostala nevidljiva.</p> <p class="tableblock">[plantuml, format=svg, id=diag-portfolio-graph, alt="Graphe du portefeuille de projets — références croisées entre INDEX.adoc"] ---- @startuml skinparam backgroundColor #FEFEFE skinparam defaultTextAlignment center skinparam nodeBackgroundColor #E3F2FD</p> <p class="tableblock">title Portfelj projekata — Krsne reference INDEX.adoc node "<strong>magic-stick</strong>\nSession 037\nSCRIPT_VERIFICATION" as MS #E1BEE7 node "<strong>bakery-gradle</strong> Sesija 11 TEST_COVERAGE" as BG #FFE0B2 node "<strong>cheroliv.com</strong> Сесија 10 TEST_COVERAGE" as CH #C8E6C9 node "<strong>plantuml-gradle</strong> Sesija 133 TEST_COVERAGE" as PG #BBDEFB node "<strong>jhipster-gradle</strong>\nСесија 1 🆕\nTEST_COVERAGE" as JG #FFCDD2</p> <p class="tableblock">MS -→ BG : INDEX.adoc référence MS -→ CH : INDEX.adoc référence MS -→ PG : INDEX.adoc référence MS -→ JG : INDEX.adoc référence 🆕</p> <p class="tableblock">BG -→ MS : INDEX.adoc référence BG -→ CH : INDEX.adoc référence BG -→ PG : INDEX.adoc référence BG -→ JG : INDEX.adoc référence 🆕</p> <p class="tableblock">CH -→ MS : INDEX.adoc référence CH -→ BG : INDEX.adoc référence CH -→ PG : INDEX.adoc référence CH -→ JG : INDEX.adoc référence 🆕</p> <p class="tableblock">PG -→ MS : INDEX.adoc référence PG -→ BG : INDEX.adoc référence PG -→ CH : INDEX.adoc référence PG -→ JG : INDEX.adoc référence 🆕</p> <p class="tableblock">JG -→ MS : INDEX.adoc référence JG -→ BG : INDEX.adoc référence JG -→ CH : INDEX.adoc référence JG -→ PG : INDEX.adoc référence</p> <p class="tableblock">note bottom of JG Quand on ajoute un projet : • 4 INDEX.adoc à mettre à jour • 1 ligne par portefeuille • Coût : 5 minutes end note</p> <p class="tableblock">legend bottom</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">= Couleur</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">= Projet</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><#E1BEE7></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">magic-stick — ISO Linux live</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><#FFE0B2></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">bakery-gradle — Plugin JBake</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><#C8E6C9></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">cheroliv.com — Site personnel</p></td> <td class="tableblock halign-left valign-top"></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><#BBDEFB></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">plantuml-gradle — Plugin IA</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><#FFCDD2></p></td> </tr> </tbody> </table> </div> </div> https://cheroliv.com/blog/2026/0107_jbake_serve_rendering_bug_fix_post.html Wed, 22 Apr 2026 00:00:00 +0000 blog/2026/0107_jbake_serve_rendering_bug_fix_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_сцена_четири_скриншота_два_рендера">Сцена: четири скриншота, два рендера</a> <ul class="sectlevel2"> <li><a href="#_lokalni_render">Lokalni render</a></li> <li><a href="#_izrenderivano_na_mreži">Izrenderivano na mreži</a></li> </ul> </li> <li><a href="#_dijagnostika_serve_nije_ukazivalo_na_pravilan_folder">Dijagnostika : <code>serve</code> nije ukazivalo na pravilan folder</a></li> <li><a href="#_главна_причина_jbake_cli_ne_radi_tako">Главна причина: JBake CLI ne radi tako</a></li> <li><a href="#_решение_позициони_аргументи_не_флагови">Решение : позициони аргументи, не флагови</a></li> <li><a href="#_brza_provera_sa_curl">Brza provera sa curl</a></li> <li><a href="#_zašto_je_ovaj_bug_bio_lukav">Zašto je ovaj bug bio lukav?</a></li> <li><a href="#_zaključak">Zaključak</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">време за читање : 10 minutes</div> <p>Znate li o tom trenutku kad vaš lokalni sajt izgleda kao ništa, ali kada se objavi na mreži sve je u redu? To je mi se desilo sa mojim Gradle JBake pluginom. Zadatak`serve`prikazivao kvadratni dugmad, temni tekst na crnoj pozadini, i bizarno odsutan CSS. Ipak`publishSite`je generisao isti sajt, onaj, bez greške. Krivac nije bio ni CSS, ni preglednik, ni keš. Bio je jedna linija Kotlin koda — i loša navika sa argumentima komandne linije.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">tik</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_сцена_четири_скриншота_два_рендера">Сцена: четири скриншота, два рендера</h2> <div class="sectionbody"> <div class="paragraph"> <p>Било je nakon краха система. Снимio сам четири слике екрана да упоређим локални рендер (<code>./gradlew serve`na`localhost:8820</code>) sa inline renderovanjem (`publishSite`na GitHub Pages). Dva screenshots po stranici : gore i dole.</p> </div> <div class="sect2"> <h3 id="_lokalni_render">Lokalni render</h3> <div class="paragraph"> <p><strong>Vrh stranice</strong>— Дугмићи <strong>Project</strong> i <strong>Template</strong> су<strong>mali, pravougaoni</strong>, u standardnim bojama (plava i zelena). Kartica <strong>Start Writing</strong> ima<strong>jednobojno crno pozadina</strong>, bez okvira.</p> </div> <div class="imageblock"> <div class="content"> <img src="./images/screen_local1.png" alt="Rendu local - haut de page"> </div> </div> <div class="paragraph"> <p><strong>podnožje</strong>— Podnaslov <strong>"Последњи чланци и ресурси</strong>" је<strong>почти нијечитљив</strong>, previše tamno na crnom pozadini. Datumi ispod slika bloga ("17 October 2013", itd.) su<strong>odsutne</strong>.</p> </div> <div class="imageblock"> <div class="content"> <img src="./images/screen_local2.png" alt="Rendu local - bas de page"> </div> </div> </div> <div class="sect2"> <h3 id="_izrenderivano_na_mreži">Izrenderivano na mreži</h3> <div class="paragraph"> <p><strong>Врх странице</strong>— Isto dugma su<strong>велики, овјарски, неоново зелен, јучест</strong>, tekst u velikim slovima. Karta ima<strong>zaobljeni beli okvir s senkom</strong>.</p> </div> <div class="imageblock"> <div class="content"> <img src="./images/screen_online1.png" alt="Rendu en ligne - haut de page"> </div> </div> <div class="paragraph"> <p><strong>Futer</strong>— Podnaslov je<strong>dobro čitavo</strong>. Datumi su<strong>видљиви</strong>. Kartice artikala imaju<strong>zaobljeni kutovi</strong>i naslovi su<strong>uvlaceno</strong>.</p> </div> <div class="imageblock"> <div class="content"> <img src="./images/screen_online2.png" alt="Rendu en ligne - bas de page"> </div> </div> <div class="paragraph"> <p>Први рефлекс: тема. Користим систем теме динамичке (светла, тама, high-contrast) базиран на`localStorage`. Možda je lokalni store pokretao temu high-contrast? Ne. Već sam napisaohttps://cheroliv.com/blog/2025/0098_preloading_css_variable_post.html[ceo članak o učitanju tema unapred], Znam kako to radi. I pak, čak i u high-contrast modu, CSS struktura (ovaoblasta dugmeta, senke) trebalo da bude tamo. Nije bila.</p> </div> <div class="paragraph"> <p>Drugi refleks: keš pretraživača. Ne, testirao sam na čistim profilima. Razlika je ostala.</p> </div> <div class="paragraph"> <p>Трећи рефлекс :`serve`nije služio iste fajlove kao`publishSite`.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_dijagnostika_serve_nije_ukazivalo_na_pravilan_folder">Dijagnostika : <code>serve</code> nije ukazivalo na pravilan folder</h2> <div class="sectionbody"> <div class="paragraph"> <p>Moj Gradle plugin`bakery`ima dva glavna zadatka:</p> </div> <div class="ulist"> <ul> <li> <p><code>bake</code>: generira statički sajt u`build/bake/`</p> </li> <li> <p><code>serve</code>: Pokreni lokalni web server</p> </li> <li> <p><code>publishSite</code>: dira`build/bake/`ka GitHub Pages</p> </li> </ul> </div> <div class="paragraph"> <p>Divergencija je mogla da dođe samo iz`serve`. Si <code>publishSite`Objavljivao je ispravan sadržaj, jer je`build/bake/`Bilo je dobro. Ako`serve`prikazivao je nešto drugo, zato što nije služio`build/bake/</code>.</p> </div> <div class="paragraph"> <p>Pogledajmo kod. U`SiteManager.kt`, zadatak`serve`je definisana kao ovo:</p> </div> <div class="listingblock"> <div class="title">SiteManager.kt — La tâche serve (version buggy)</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">tasks.register("serve", JavaExec::class.java) { task -> task.apply { mainClass.set("org.jbake.launcher.Main") classpath = jbakeRuntime environment("GEM_PATH", jbakeRuntime.asPath) jvmArgs(/* ... */) args = listOf( "-b", file(site.bake.srcPath).absolutePath, "-s", layout.buildDirectory.get() .asFile.resolve(site.bake.destDirPath) .absolutePath ) } }</code></pre> </div> </div> <div class="paragraph"> <p><code>org.jbake.launcher.Main`je ulazna tačka CLI JBake 2.7.0. Ideja: proći</code>-b`за изворни директоријум и`-s`за одредешњи folder, pokreni server мод. Осим што…​</p> </div> </div> </div> <div class="sect1"> <h2 id="_главна_причина_jbake_cli_ne_radi_tako">Главна причина: JBake CLI ne radi tako</h2> <div class="sectionbody"> <div class="paragraph"> <p>JBake 2.7.0 ocekuje<strong>pozicioni argumenti</strong>za izvor i destinaciju, zatim opcione flagove. Potpis je:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">jbake <source> <destination> [options]</code></pre> </div> </div> <div class="paragraph"> <p>Али у мојем коду јех писао:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">args = listOf("-b", "/path/to/site", "-s", "/path/to/build/bake")</code></pre> </div> </div> <div class="paragraph"> <p>JBake je tumačio da je:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><code>-b</code>→ parsiraj flag "bake" (boolean), ispotrošeno</p> </li> <li> <p><code>/path/to/site</code>→ postaje pozicioni argument 1 (izvor)</p> </li> <li> <p><code>-s</code>→ parsiraj flag "serve" (bool), server pokrenut<strong>одмах</strong></p> </li> <li> <p><code>/path/to/build/bake</code>→ postaće siromasni argument, zanemaren ili pogrešno tumačen</p> </li> </ol> </div> <div class="paragraph"> <p>Резултат: JBake узимао`/path/to/site`kao izvor,<strong>није узимало у обзир одредиште</strong>обесбечена (<code>build/bake</code>), i koristilo je svoj podrazumevani repertoar (često`./output`или времену копију). Датотека`css/styles.css`build-a je bio prepisan ili ignorisan, a bio je staro podrazumevano CSS (bez custom promenjivih, bez zaobljenja, bez senki) koje je bilo servisano.</p> </div> <div class="paragraph"> <p>U poredbi,<code>bake</code> et <code>publishSite`koriste<strong>zvanični Gradle JBake plugin</strong>(`jbake-gradle-plugin</code>) koji piše uređeno u`build/bake/`kroz Gradle API. Ne prolaze kroz CLI.</p> </div> </div> </div> <div class="sect1"> <h2 id="_решение_позициони_аргументи_не_флагови">Решение : позициони аргументи, не флагови</h2> <div class="sectionbody"> <div class="paragraph"> <p>Korekcija je trivijalna — jednom kada znaš. Dovoljno je proslediti izvor i destinaciju kao pozicionalni argumenti, pa`-s`на крају</p> </div> <div class="listingblock"> <div class="title">SiteManager.kt — La tâche serve (version corrigée)</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">args = listOf( file(site.bake.srcPath).absolutePath, layout.buildDirectory.get() .asFile.resolve(site.bake.destDirPath) .absolutePath, "-s" )</code></pre> </div> </div> <div class="paragraph"> <p>To je sve. Tri linije promenjene, greška rešena.</p> </div> <div class="paragraph"> <p>После локалног објављивања плагина (<code>publishToMavenLocal</code>), un `./gradlew serve`pokreni JBake sa ispravnom sintaksom:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">jbake /home/user/project/site /home/user/project/build/bake -s</code></pre> </div> </div> <div class="paragraph"> <p>И ови пут, Jetty сервер интегрован у JBake добро служи садржају`build/bake/`— идентично што је објављено онлайн.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !define RECTANGLE class package "PRE (bug)" { RECTANGLE JBakeCLI1 { + args = ["-b", "сајт", "-s", "graditi/peci"] } RECTANGLE Source1 { + site/ } RECTANGLE Dest1 { + ??? (dossier temporaire) } RECTANGLE Jetty1 { + sert mauvais fichiers } JBakeCLI1 --> Source1 : lit JBakeCLI1 -[#red]x Dest1 : destination ignorée Jetty1 --> Dest1 : sert } package "POSLE (fix)" { RECTANGLE JBakeCLI2 { + args = ["сајт", "graditi/peci", "-s"] } RECTANGLE Source2 { + site/ } RECTANGLE Dest2 { + build/bake/ } RECTANGLE Jetty2 { + sert les bons fichiers } JBakeCLI2 --> Source2 : lit JBakeCLI2 --> Dest2 : écrit dans Jetty2 --> Dest2 : sert OK } @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_brza_provera_sa_curl">Brza provera sa curl</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da biste se uverili da server ispravno služi dobrog sadržaja, jednostavno`curl`potvrđuje da`index.html`sadrži`data-bs-theme="light"`i da`build/bake/css/styles.css`teži tacno 31 402 bajta — identičan datoteci generisanoj od`bake`.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ ./gradlew serve # Dans un autre terminal : $ curl -s http://localhost:8820/ | grep data-bs-theme <html ... data-bs-theme="light" ...> $ curl -I http://localhost:8820/css/styles.css HTTP/1.1 200 OK Content-Length: 31402 Content-Type: text/css</code></pre> </div> </div> <div class="paragraph"> <p>Локални рендер је сада<strong>пиксељ-идентичан</strong>на разгредовани приказ.</p> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_je_ovaj_bug_bio_lukav">Zašto je ovaj bug bio lukav?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Видиш зато је било тешко да се ухвати?</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Nema explicitne greške</strong>: JBake nije pao. "Funkcionisao" je, jednostavno sa pogrešnim direktorijumom.</p> </li> <li> <p><strong>Build je radio</strong> : <code>./gradlew bake`исправно генерисао фајлове у`build/bake/</code>.</p> </li> <li> <p><strong>Распоред је радио</strong>:`publishSite`Postavljao je dobar sadržaj na internetu.</p> </li> <li> <p><strong>Samo <code>serve</code> je bio pokvaren</strong>: zadatak razvoja, onaj koji stalno koristimo za iteriranje</p> </li> <li> <p><strong>Navika od <code>-key value</strong>: kao programer, smo uslovljeni godinama rada u Unix CLI (</code>-o output`, <code>-i input</code>). JBake CLI je izuzetak — izvor i destinacija su pozicionirani.</p> </li> </ol> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ako održavate Gradle plugin koji omotava JBake (ili bilo koji CLI alat),<strong>pročitajte dokumentaciju argumenata</strong>ćak i ako mislite da ih poznajete. Jedna implicitna hipoteza (<code>-s</code> = "set destination")` може вам коштати сате визуелног дебаговања.</p> </div> <div class="paragraph"> <p>Ово, поправка је била дословно да се промени:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">args = listOf("-b", src, "-s", dest) // ❌ BUG</code></pre> </div> </div> <div class="paragraph"> <p>en :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">args = listOf(src, dest, "-s") // ✅ FIX</code></pre> </div> </div> <div class="paragraph"> <p>Tri pomerena token, i moj lokalni sajt ponovo postaje leпокao kao sajt u produkciji.</p> </div> <div class="paragraph"> <p><strong>Lekcija</strong>: kad se renderovanje razlikuje između lokalnog i produkcijskog okruženja bez očiglednog razloga, prvo sumnjajte na <strong>pipeline</strong> — ne na CSS, ne na pretraživač, a još manje na framework. Često je korak ispravno prije renderovanja koji vara.</p> </div> </div> </div> https://cheroliv.com/blog/2026/0106_opencode_path_sdkman_nvm_post.html Tue, 21 Apr 2026 00:00:00 +0000 blog/2026/0106_opencode_path_sdkman_nvm_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_scena_slep_agent_u_svetu_alata">Scena: slep agent u svetu alata</a></li> <li><a href="#_anatomija_greške_dva_shella_dva_sveta">Anatomija greške: dva shella, dva sveta</a></li> <li><a href="#_krivci_zshrc_vs_zshenv">Krivci: .zshrc vs .zshenv</a></li> <li><a href="#_korak_po_korak_dijagnostika">Korak po korak dijagnostika</a> <ul class="sectlevel2"> <li><a href="#_проверити_path_агента">Проверити PATH агента</a></li> <li><a href="#_2_identifikati_šta_se_nalazi_u_zshrc_ali_ne_u_zshenv">2. Identifikati šta se nalazi u .zshrc, ali ne u .zshenv</a></li> <li><a href="#_3_проверити_да_ли_zshenv_постоји">3. Проверити да ли .zshenv постоји</a></li> </ul> </li> <li><a href="#_решение_zshenv_правине_путање">Решение : .zshenv + правине путање</a> <ul class="sectlevel2"> <li><a href="#_kreirati_zshenv_sa_svim_neophodnim_putanjama">Kreirati .zshenv sa svim neophodnim putanjama</a></li> <li><a href="#_zašto_ne_source_sdkman_init_sh_u_zshenv">Zašto ne <code>source sdkman-init.sh</code> u .zshenv?</a></li> </ul> </li> <li><a href="#_slucaj_nvm_kada_menadžer_verzija_zaboravi_da_ostavi_trag">Slucaj NVM: kada menadžer verzija zaboravi da ostavi trag</a> <ul class="sectlevel2"> <li><a href="#_проблем_nvm">проблем NVM</a></li> <li><a href="#_rešenje_napraviti_simbolički_link_current_za_nvm">Rešenje: napraviti simbolički link <code>current</code> za NVM</a></li> <li><a href="#_automatizuj_ažuriranje_symlinka">Automatizuj ažuriranje symlinka</a></li> </ul> </li> <li><a href="#_pregledna_tabela_putova">pregledna tabela putova</a></li> <li><a href="#_peštere_i_mitigations">Peštere i mitigations</a></li> <li><a href="#_научене_лекcije">Научене лекcije</a></li> <li><a href="#_finalna_proverka">Finalna proverka</a></li> <li><a href="#_linkovi">Linkovi</a> <ul class="sectlevel2"> <li><a href="#_službena_dokumentacija">Službena dokumentacija</a></li> <li><a href="#_navedeni_alati">Navedeni alati</a></li> <li><a href="#_za_daljnje_istraživanje">Za daljnje istraživanje</a></li> </ul> </li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">време читања : 13 minutes</div> <p>Pokrećete OpenCode u svom terminalu, sve radi. Agent pokušava`gh`— nepronađen. Jedan`java -version`— nedostaje. Jedan`node`— нигде. Ме intermediary, ови алатови су добро там у <em>ваше</em> шеллу. Проблем? OpenCode покреће шелове.<strong>ne-interaktivni</strong>koji nikada ne čitaju vaš`.zshrc`. Ово је како да дијагностикујете и исправите то на правилан начин.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">tak</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_scena_slep_agent_u_svetu_alata">Scena: slep agent u svetu alata</h2> <div class="sectionbody"> <div class="paragraph"> <p>Bio je utorak večer. Pres sam instaliraohttps://opencode.ai[OpenCode], AI agent koji je obećao da će promeniti moj način kodiranja. Prvi test: zamoliti ga da izlistati moje GitHub repozitorijume.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ opencode > Utilise gh pour lister mes repos ❌ bash: gh: command not found</code></pre> </div> </div> <div class="paragraph"> <p>Čudno.<code>gh</code> fonctionnait parfaitement dans mon terminal. J’essaie autre chose :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">> Vérifie la version de Java ❌ bash: java: command not found</code></pre> </div> </div> <div class="paragraph"> <p>Затим:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">> Lance le build Gradle ❌ bash: gradle: command not found</code></pre> </div> </div> <div class="paragraph"> <p>Java, Gradle, Node,<code>gh</code>— Sve je bilo nevidljivo agentu. Moj terminal, on, je vidio sve. Kao da je agent i ja živeli u dvama paralelnim svetima.</p> </div> <div class="paragraph"> <p>Potrošio sam sate da razumem. Sati`echo $PATH`, de <code>which java</code>, od rastuće frustracije. Konačno sam razumeo da problem nije u alati — bilo je<strong>лушпа</strong>. OpenCode, kao svaki agent koji pokreće podprocesse, radi u shell-ovima<strong>neinteraktivni</strong>. I Zsh, u ovim shell-ovima, jednostavno ignoriše vaše`.zshrc`.</p> </div> <div class="paragraph"> <p>Sledeći je potpuni izveštaj o ovom dijagnozu, o ovom rešenju i o ovoj lekciji koju sam naučila. Ako koristite AI agent — OpenCode, Aider, Cursor, ili čak i cron skripte — ovaj problem će vas jednog dana tići.</p> </div> </div> </div> <div class="sect1"> <h2 id="_anatomija_greške_dva_shella_dva_sveta">Anatomija greške: dva shella, dva sveta</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kada otvarate terminal, Zsh ga traktira kao shell<strong>интерактиван</strong>. Он заређује`.zshrc`, koji inicijalizuje sve : SDKMAN, NVM, pnpm, alias, vaš leп prompt. Vaše okruženje je kompletno.</p> </div> <div class="paragraph"> <p>Но када OpenCode изврши команду, не покреће интерактивни терминал. Он покреће шелу.<strong>neinteraktivni</strong>— shell zadatka, bez čoveka iza ekrana. I Zsh, u ovom kontekstu, skače`.zshrc`. On samo čita`.zshenv`.</p> </div> <div class="paragraph"> <p>Zasto postoji ova razlika? Jer neinteraktivni shell je namenjen izvršavanju skriptova, a ne služenju ljudskog korisnika. Učitavanje aliasa, prompta i završetaka u skriptu koja radi u pozadini bila bi istrata. Problem jeste što vaš PATH — najvažnija informacija za pronalaženje izvršnih fajlova — se često inicijalizuje u`.zshrc`, nije u`.zshenv`.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE actor "Ви" as user actor "OpenCode\n(agent)" as agent participant "Shell interaktivno (.zshrc učitan)" as ishell participant "Shell\nneinteraktivni\n(.zshrc je ignorisan)" as nshell user -> ishell : gh, java, node ✅ agent -> nshell : gh, java, node ❌ note right of ishell Source .zshrc : - SDKMAN init - NVM init - ~/apps dans PATH - pnpm dans PATH end note note right of nshell .zshrc ignoré ! PATH = /usr/bin:/bin + quelques répertoires défaut end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Koren problema:<strong>Zsh izvršava <code>.zshrc</code> samo za interaktivne shellove</strong>. OpenCode, kao i svaki AI agent koji pokreće podprocesse, koristi neinteraktivne shell-ove. Ovi shell-ovi ne čitaju`.zshenv`.</p> </div> </div> </div> <div class="sect1"> <h2 id="_krivci_zshrc_vs_zshenv">Krivci: .zshrc vs .zshenv</h2> <div class="sectionbody"> <div class="paragraph"> <p>Zsh ima<strong>четири фајла иницијализације</strong>, svaki sa specifičnom ulogom. To je elegantan dizajn — ali to je i čvor problema :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> <col style="width: 5%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Fajl</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">изворен када</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Улога</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Modifikuj PATH?</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>.zshenv</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Uvek</strong>(interaktivan + neinteraktivan + login)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Неопходне променљиве околине, PATH</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅ Да — то је SA mjesto</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>.zprofile</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Само шељеве за логин</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Sporе komande (jednom po sesiji)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Moguće</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>.zshrc</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Само интерактивне лиуске</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Alias, prompt, dovršavanje, interaktivni alati</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌ Nije za kritične promenljive</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>.zlogin</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Shell-ovi za prijavu (posle .zshrc)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Поруке добро дошлица, завршетак</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ретако</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Tabela daje pokazatelj, ali ga je potrebno duboko razumeti. Mislite na to kao na sobe kuće:</p> </div> <div class="ulist"> <ul> <li> <p>`.zshenv`je<strong>ulazni hol</strong>— svi prođu tamo, posetilac ili stanovnik. Ako stavite nešto ovde, svaki shell će moći da ga vidi.</p> </li> <li> <p>`.zshrc`је<strong>salon</strong>— sami stanovnici (interaktivne ljuške) ulaze tamo. Posetioaci (neinteraktivne ljuške) ostaju u holu.</p> </li> <li> <p><code>.zprofile</code> et `.zlogin`Su specijalizovani delovi za login shellove (kao kada se povežete pomoću SSH).</p> </li> </ul> </div> <div class="paragraph"> <p>Tragediya je da većina od nas stavimo PATH u dnevnu sobu. A AI agent, on, nikada nema pravo da uđe tamo.</p> </div> <div class="paragraph"> <p>Problem u dijagramu :</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE start if (Shell interactif ?) then (Oui) :Source .zshenv; :Source .zprofile; :Source .zshrc; :Source .zlogin; note right SDKMAN ✅ NVM ✅ ~/apps ✅ pnpm ✅ end note else (Non — shell non-interactif) :Source .zshenv uniquement; note right SDKMAN ❌ NVM ❌ ~/apps ❌ pnpm ❌ end note endif stop @enduml</pre> </div> </div> <div class="paragraph"> <p>Kada otvarate terminal, Zsh je interaktivan: čita`.zshrc`, sve radi. Kada OpenCode pokreće shell da izvrši komandu, Zsh je neinteraktivan : on preskače`.zshrc`, сам чита`.zshenv`. Et si `.zshenv`ne postoji ili ne sadrži PATH — to je pustinja.</p> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p><strong>Zasto Zsh to radi?</strong>Ovo je izbor dizajna nasleđen od Unix-a. Neinteraktivni shell mora biti<strong>brz</strong> et <strong>репродуктиван</strong>Učitavanje aliasa, obojenih promptova i teških inicijalizacija SDKMAN-a u cron skriptu ili agente AI bi bilo sporo i křehko. Odvajanje je zato logično:`.zshenv`glavno (varijable, PATH)`.zshrc`za komfor (alias, prompt, kompletujemo). Problem se javlja kada stavimo najvažnije u komfor.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_korak_po_korak_dijagnostika">Korak po korak dijagnostika</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pre nego što ispravite, morate da razumete tačno šta nedostaje. Ovo je ponovljiva dijagnostička metoda — sačuvajte je u omiljenim ako radite sa AI agensima.</p> </div> <div class="sect2"> <h3 id="_проверити_path_агента">Проверити PATH агента</h3> <div class="paragraph"> <p>Poredimo ono što vidi vaš interaktivni terminal sa onim što vidi neinteraktivna shell — to jest, ono što vidi OpenCode.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Dans votre terminal interactif (tout fonctionne) echo $PATH | tr ':' '\n' | grep -v '^/usr' | sort</code></pre> </div> </div> <div class="paragraph"> <p>Tipičan rezultat :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">/home/cheroliv/apps /home/cheroliv/.nvm/versions/node/v22.19.0/bin /home/cheroliv/.sdkman/candidates/java/current/bin /home/cheroliv/.sdkman/candidates/gradle/current/bin /home/cheroliv/.local/share/pnpm /home/cheroliv/.local/bin</code></pre> </div> </div> <div class="paragraph"> <p>Sada, simulirajmo šta agent vidi — neinteraktivna lupina:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Shell non-interactif : pas de .zshrc zsh -c 'echo $PATH' | tr ':' '\n' | grep -v '^/usr' | sort</code></pre> </div> </div> <div class="paragraph"> <p>Резултат :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">/home/cheroliv/.local/bin</code></pre> </div> </div> <div class="paragraph"> <p><strong>Pet od šest puteva je nestalo.</strong>Agent je amputovan na 83% svog okruženja. Kao da se vam pita da kuhate bez pola vaših posuđa — mogli biste provriti vodu, ali i baš malo više.</p> </div> <div class="admonitionblock warning"> <table> <tr> <td class="icon"> <i class="fa icon-warning" title="Warning"></i> </td> <td class="content"> <div class="paragraph"> <p>Naredba`zsh -c 'echo $PATH'`је ваш<strong>alat dijagnostike broj 1</strong>. Ако алат који користите свакодневно није приступан у резултату, ваш ИА агент такође неће моћи да га види. Тестирајте ње пре и након сваке измене`.zshenv`.</p> </div> </td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_2_identifikati_šta_se_nalazi_u_zshrc_ali_ne_u_zshenv">2. Identifikati šta se nalazi u .zshrc, ali ne u .zshenv</h3> <div class="paragraph"> <p>Sada, tražimo krivca u`.zshrc`. Filtriramo redove koji spominju naša alat:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">grep -n 'apps\|SDKMAN\|NVM\|PNPM\|PATH' ~/.zshrc</code></pre> </div> </div> <div class="paragraph"> <p>Tipično se nađe:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">119: PATH="/usr/bin/python3:$HOME/apps:$PATH" # ← pas exporté ! 171: export NVM_DIR="$HOME/.nvm" 172: [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # ← NVM init 176: nvm use --lts --silent # ← active une version 179: export PNPM_HOME="/home/cheroliv/.local/share/pnpm" 187: export SDKMAN_DIR="$HOME/.sdkman" 188: [[ -s "$HOME/.sdkman/bin/sdkman-init.sh" ]] && source "$HOME/.sdkman/bin/sdkman-init.sh"</code></pre> </div> </div> <div class="paragraph"> <p>Sve to je<strong>невидим</strong>за OpenCode. И он`PATH`linije 119 nije ni`export`é — On nikada ne napušta trenutni shell. To je ključan tehnički detalj: varijabla bez`export`ostaje lokalno za shell koji ga definiše. Pod-šelovi — kao oni pokrenuti od strane OpenCode — ga nikad ne nasleđuje.</p> </div> </div> <div class="sect2"> <h3 id="_3_проверити_да_ли_zshenv_постоји">3. Проверити да ли .zshenv постоји</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">cat ~/.zshenv 2>/dev/null || echo "FICHIER ABSENT"</code></pre> </div> </div> <div class="paragraph"> <p>Ako je odgovor « FICHIER ABSENT », tu se sve odigrava.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_решение_zshenv_правине_путање">Решение : .zshenv + правине путање</h2> <div class="sectionbody"> <div class="paragraph"> <p>Strategija je jednostavna, ali zahteva preciznost: staviti u`.zshenv` <strong>само</strong>osnovne putevi, bez učitavanja tehkih skriptova inicijalizacije. Ne pomeramo`.zshrc`у`.zshenv`— izvučemo suštinu.</p> </div> <div class="sect2"> <h3 id="_kreirati_zshenv_sa_svim_neophodnim_putanjama">Kreirati .zshenv sa svim neophodnim putanjama</h3> <div class="paragraph"> <p>`.zshenv`је<strong>jedan fajl</strong>да Zsh гарантује да се извори у<strong>svi</strong>контексти. Тамо треба да иде PATH.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">export SDKMAN_DIR="$HOME/.sdkman" export NVM_DIR="$HOME/.nvm" export PNPM_HOME="$HOME/.local/share/pnpm" export PATH="$HOME/apps:$HOME/.sdkman/candidates/java/current/bin:$HOME/.sdkman/candidates/gradle/current/bin:$HOME/.nvm/current/bin:$PNPM_HOME:$HOME/.local/bin:$HOME/.local/share/JetBrains/Toolbox/scripts:/usr/bin/python3:$PATH"</code></pre> </div> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p>Korišćeno je`$HOME/.nvm/current/bin`i ne`$HOME/.nvm/versions/node/v22.19.0/bin`. Razlog: verzije Node se menjaju. Tvrdokodirana putanja postaje netačna u sledećem.<code>nvm install</code>. Više detalja u sledećoj sekciji.</p> </div> </td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_zašto_ne_source_sdkman_init_sh_u_zshenv">Zašto ne <code>source sdkman-init.sh</code> u .zshenv?</h3> <div class="paragraph"> <p>Najprivlačniji pristup bi bio da se jednostavno reproducira u`.zshenv`šta radimo u`.zshrc`— izvršiti skripte inicijalizacije. On<strong>mogao bi</strong>biti pokušen da uradi :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># ❌ MAUVAISE IDÉE [[ -s "$HOME/.sdkman/bin/sdkman-init.sh" ]] && source "$HOME/.sdkman/bin/sdkman-init.sh"</code></pre> </div> </div> <div class="paragraph"> <p>Проблеми :</p> </div> <div class="ulist"> <ul> <li> <p><strong>sporan</strong>:`sdkman-init.sh`Pravi mrežne resolucije i proverke na svakom shell-u. U neinteraktivnom shell-u, to je nepotrebni trošak.</p> </li> <li> <p><strong>fragilan</strong>: SDKMAN očekuje interaktivni kontekst. Njegova inicijalizacija može tiho neuspeti u cevi ili pod-šeliju.</p> </li> <li> <p><strong>Bezvažno</strong>: SDKMAN postavlja svoje kandidate u`~/.sdkman/candidates/<tool>/current/bin`— stabilni simbolički linkovi koji pokazuju na aktivnu verziju. Možemo ih koristiti<strong>direktno</strong>.</p> </li> </ul> </div> <div class="paragraph"> <p>Дobar приступ: облазити иницијалисање на SDKMAN и право показује на симлинкове`current`. Ово је кључ свега решења :<strong>koristiti strukturu fajlova kao ugovor, umesto koda inicijalizacije</strong>.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "Spor pristup (source sdkman-init.sh)" as slow { card ".zshenv source sdkman-init.sh 2-3 sekunde po shellu Mrežne proverke Rizik neuspeha" as s1 #FDEDEC } rectangle "Brzi pristup (direktni simbolički linkovi)" as fast { card ".zshenv export PATH=...current/bin 0 ms Nema mreže Nema inicijalizacije" as s2 #E8F8E8 } slow --> fast : Même résultat final\nLe PATH pointe sur current/bin\ndans les deux cas @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_slucaj_nvm_kada_menadžer_verzija_zaboravi_da_ostavi_trag">Slucaj NVM: kada menadžer verzija zaboravi da ostavi trag</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_проблем_nvm">проблем NVM</h3> <div class="paragraph"> <p>Ovdje me je istraživanje doveo najdaleko. SDKMAN ima elegantan dizajn: kada uradimo`sdk install java 25.0.2-tem`, On pravi simbollink :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">~/.sdkman/candidates/java/current -> ~/.sdkman/candidates/java/25.0.2-tem</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj symlink je<strong>увек ажурирано</strong>. Ukažite na njega u`.zshenv`Јсте зашћени, без обзира на шелл. Прелепо.</p> </div> <div class="paragraph"> <p>Nikad, on ne kreira<strong>ништа</strong>od tel. Nema symlink`current`. Nema stalne tacke sidra. Moramo pokazivati na ugrađen (ukočen u kod) verzionisan put, koji izgleda ovako :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">~/.nvm/versions/node/v22.19.0/bin/node</code></pre> </div> </div> <div class="paragraph"> <p>Na sledeći`nvm install 24`, Ovaj put je mrtav. Vaš`.zshenv`Pokazivač na verziju koja više nije aktivna verzija. Ovo je vremenska bomba.</p> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p><strong>Zašto NVM to radi?</strong>NVM radi dinamičkim modifikovanjem PATHa pri svakom`nvm use`. Namenjen je za developere koji često menjaju verziju, u interaktivnom shellu. Simbolička veza`current`Nije bio u početnim specifikacijama — ovo je greška u dizajnu koju ćemo sami ispraviti.</p> </div> </td> </tr> </table> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE package "SDKMAN ✅" { [~/.sdkman/candidates/java/current] as sdk_current [~/.sdkman/candidates/java/25.0.2-tem/] as java_25 [~/.sdkman/candidates/java/21.0.7-tem/] as java_21 sdk_current --> java_25 : symlink } package "NVM ❌ (pre korekcije)" as nvm_before { [~/.nvm/versions/node/v22.19.0/] as node_22 [~/.nvm/versions/node/v20.16.0/] as node_20 note right of node_22 Pas de symlink current ! .zshenv doit pointer en dur Cassé au prochain nvm install end note } package "NVM ✅ (nakon korekcije)" as nvm_after { [~/.nvm/current] as nvm_current [~/.nvm/versions/node/v22.19.0/] as node_22b [~/.nvm/versions/node/v20.16.0/] as node_20b nvm_current --> node_22b : symlink\n(mis à jour auto) } @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_rešenje_napraviti_simbolički_link_current_za_nvm">Rešenje: napraviti simbolički link <code>current</code> za NVM</h3> <div class="paragraph"> <p>Posto NVM ne radi to, mi to radimo sami. Princip je isto kao SDKMAN — jedan symlink.`current`Kreiramo ga jednom, zatim ga automatizujemo da se ažurira sam.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Créer le symlink initial ln -sfn "$HOME/.nvm/versions/node/v22.19.0" "$HOME/.nvm/current"</code></pre> </div> </div> <div class="paragraph"> <p>Sada, u`.zshenv`, koristi se :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$HOME/.nvm/current/bin</code></pre> </div> </div> <div class="paragraph"> <p>Umesto :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># ❌ Chemin en dur — cassé au prochain changement de version $HOME/.nvm/versions/node/v22.19.0/bin</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_automatizuj_ažuriranje_symlinka">Automatizuj ažuriranje symlinka</h3> <div class="paragraph"> <p>Симлинк није вредан ако се не ажурира. Симлинк`current`Treba da se ażurira kada se radi`nvm use` ou <code>nvm install</code>. Решење: један<strong>omotač</strong>— funkcija koja omotava stvarnu komandu`nvm`i ažurira simboličku vezu nakon svakog poziva.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># À la fin de .zshrc, APRÈS le chargement de NVM nvm use --lts --silent ln -sfn "$(nvm_version_path "$(nvm current)")" "$NVM_DIR/current" _nvm() { command nvm "$@" local rc=$? ln -sfn "$(nvm_version_path "$(nvm current)")" "$NVM_DIR/current" return $rc } alias nvm='_nvm'</code></pre> </div> </div> <div class="paragraph"> <p>Kako to funkcionise, u detalju :</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE actor Développeur participant "nvm wrapper\n(_nvm)" as wrapper participant "nvm реальан (команда nvm)" as realnvm participant "~/.nvm/current\n(simbolički link)" as symlink Développeur -> wrapper : nvm use 20 wrapper -> realnvm : command nvm use 20 realnvm --> wrapper : version activée wrapper -> symlink : ln -sfn .../v20.16.0 ~/.nvm/current wrapper --> Développeur : retour note right of symlink Toujours à jour ! Utilisé par .zshenv → accessible par OpenCode end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Omotač`_nvm`zove pravi komanda`nvm`, zatim ažurira simlink. Alias`nvm='_nvm'`osigurava da prilikom unosa`nvm`, prolazimo kroz omotač. I pri inicijalizaciji shella, ponavljamo isto posle`nvm use --lts`.</p> </div> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="Tip"></i> </td> <td class="content"> <div class="paragraph"> <p>`nvm_version_path`Ово је унутрашња функција NVM-а која решава комплетан пут до конкретне верзије. Ово спречава ручно постављање пута.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_pregledna_tabela_putova">pregledna tabela putova</h2> <div class="sectionbody"> <div class="paragraph"> <p>Пре него што пређеш на застане, визуелни сажетак трансформације. На левој страни, што ste imали (сав у`.zshrc`, nevidljivo za agenta). Desno, što sada imate (osnovni putevi u`.zshenv`, vidljivi svuda).</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 25%;"> <col style="width: 25%;"> <col style="width: 25%;"> <col style="width: 25%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">alat</th> <th class="tableblock halign-left valign-top">Pre (.zshrc samo)</th> <th class="tableblock halign-left valign-top">После (.zshenv + simblična veza)</th> <th class="tableblock halign-left valign-top">Vidljiv od OpenCode?</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>~/apps</code>(gh, vscode)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">PATH nije izvozen u .zshrc</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`$HOME/apps`у .zshenv</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">SDKMAN Java</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`sdkman-init.sh`izvorljeno u .zshrc</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`$HOME/.sdkman/candidates/java/current/bin`у .zshenv</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">SDKMAN Gradle</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`sdkman-init.sh`uvođen u .zshrc</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`$HOME/.sdkman/candidates/gradle/current/bin`u .zshenv</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">NVM čvor</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`nvm use --lts`у .zshrc</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`$HOME/.nvm/current/bin`u .zshenv (simbolička veza)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">(No output, as there is no French text provided to translate)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">pnpm</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`$PNPM_HOME`у .zshrc</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`$PNPM_HOME`у .zshenv</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">JetBrains Toolbox</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Automatski dodat od Toolbox u `.zshrc</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`$HOME/.local/share/JetBrains/Toolbox/scripts`у .zshenv</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Python 3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`/usr/bin/python3`у PATH .zshrc</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Izričito u .zshenv</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✅</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_peštere_i_mitigations">Peštere i mitigations</h2> <div class="sectionbody"> <div class="paragraph"> <p>Nije sve savršeno sa ovim pristupom. Evo problema koje sam naišao, i kako ih obistći.</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">уловка</th> <th class="tableblock halign-left valign-top">Opis</th> <th class="tableblock halign-left valign-top">umerenje</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">PATH duplikovan</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ako .zshenv i .zshrc dodaju istu putanju, pojavljuje se dva puta</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`.zshenv`je izvorno<strong>пре</strong>.zshrc. Oba se čitaju u interaktivnoj ljusci. PATH se može duplirati. To je kosmetičko, ne funkcionalno. Da se izbegne: stavite u .zshenv samo putanje koje nisu prisutne u podrazumevanom PATH-u.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">NVM : hardkodirana verzija u .zshenv</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">staviti`~/.nvm/versions/node/v22.19.0/bin`тврд постаје нетачан у следећем`nvm install`</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Користити симлинк`$HOME/.nvm/current/bin`+ омотач`_nvm`у .zshrc</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">SDKMAN : izvršavanje sdkman-init.sh u .zshenv</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Spor, ranljiv, bez korisnosti u neinteraktivnoj ljusci</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Користите симлинкове`candidates/<tool>/current/bin`direktno</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Nedostajući alias nakon izmene</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Omot`nvm='_nvm'`у .zshrc утиче само после релоадовања</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Покрени shell ponovno hoặc`source ~/.zshrc`</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">OpenCode ne vidi promene</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Agent je već pokrenuo svoje potkornice sa starim .zshenv</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Рестартуј OpenCode после измене .zshenv</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">.zshenv преоптерећен</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Stavljati teške funkcije ili interaktivne inicijalizacije u `.zshenv</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">.zshenv = promenljive okruženja + PATH samo. Nema`source`, bez teških funkcija, bez promptova.</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_научене_лекcije">Научене лекcije</h2> <div class="sectionbody"> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>.zshrc` je interaktivan, <code>.zshenv</code> je univerzalni</strong>— Ako jedna promenljiva mora da postoji u <em>svim</em> shell-ovima (agenti IA, cron, skripte, IDE), ona ide u`.zshenv`. Salon je udoban, ali ulazni hol je jedino mesto gde prolazi sve.</p> </li> <li> <p><strong>Menadžeri verzija nisu jednaki</strong>— SDKMAN kreira simbolne veze`current`po dizajnu. NVM ne. Treba ručno popuniti ovaj nedostatak. Ovo je važna lekcija: pre podešavanja vašeg PATH, proverite da li vaš menadžer nudi stabilnu kotvicu.</p> </li> <li> <p><strong>Ne učitati init skripte u .zshenv</strong>—<code>sdkman-init.sh</code> et `nvm.sh`Su dizajnirani za interaktivni shell. Oni su spori i krehki u neinteraktivnom kontekstu. Simbolički linkovi`current`Oni su dovoljni i instantani.</p> </li> <li> <p><strong>Uvek testirati u neinteraktivnom shell-u</strong>—`zsh -c 'echo $PATH'`tačno simulira šta vidi agent. To je test validacije. Bez ovog testa, ne znate da li vaša konfiguracija funkcionise za agente.</p> </li> <li> <p><strong>Wrapper pattern je ponovo upotrebljiv</strong>— Isti pattern`_nvm`+`alias nvm='_nvm'`Primena se na sve alate koji dinamički menjaju PATH bez ostavljanja stabilnog traga. Ovo je još jedan alat u vašoj kutiji ideja.</p> </li> </ol> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "prije" as avant { card "Shell interaktivni : ✅ Shell neinteraktivni : ❌ OpenCode : ❌ Cron : ❌ Skripte : ❌" as av1 #FDEDEC } rectangle "nakon" as apres { card "Interaktivni shell : ✅\nNeinteraktivni shell : ✅\nOpenCode : ✅\nCron : ✅\nSkripte : ✅" as ap1 #E8F8E8 } avant --> apres : .zshenv +\nsymlink ~/.nvm/current @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_finalna_proverka">Finalna proverka</h2> <div class="sectionbody"> <div class="paragraph"> <p>Posle kreiranja`.zshenv`et symlink NVM, проверијте да све функционише — у два контекста :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Shell interactif (votre terminal) gh --version && java -version && node --version</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Shell non-interactif (simulation OpenCode) zsh -c 'gh --version && java -version && node --version'</code></pre> </div> </div> <div class="paragraph"> <p>Oba moraju da uspeju. Ako da, vaš agent AI će videti isti alat kao vi. Ako ne, vratite se na korak po korak dijagnozu — verovatno ste zaboravili putanju ili NVM symlink nije ažuriran.</p> </div> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="Tip"></i> </td> <td class="content"> <div class="paragraph"> <p><strong>Automate ovaj test.</strong>Dodajte ovu proveru u skriptu healthcheck koju pokrećete nakon svakog ažuriranja vaših alata.`zsh -c 'which java && which node && which gh'`u CI, to je osiguranje protiv iznenađenja.</p> </div> </td> </tr> </table> </div> <div class="paragraph"> <p>Čuvajte sve blokove koda u backtick-ovima (<code>…​</code>) istačno — nikad ne menjajte sadržaj backtick-ova, razmake ili poziciju. Ovaj tekst može biti fragment većeg rečenice — prevedite fragment bez zahtevanja dodatnog konteksta. Izlazite samo prevedeni tekst — bez objašnjenja, komentarata, uvoda, alternativa ili opcija. Neinteraktivan shell je kao tiho gost: on čita samo ono što je prikazano na ulaznoj vrati. Ako je PATH u salašnom prostoru, on ga nikad neće videti. <em>__</em></p> </div> </div> </div> <div class="sect1"> <h2 id="_linkovi">Linkovi</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_službena_dokumentacija">Službena dokumentacija</h3> <div class="ulist"> <ul> <li> <p><a href="https://zsh.sourceforge.io/Doc/Release/Files.html">Dokumentacija Zsh : Pokretne datoteke</a>— Službena referenca za datoteke za inicijalizaciju Zsh. Ovo je mesto gde se sve objašnjava, iako se često zaboravlja.</p> </li> <li> <p><a href="https://opencode.ai/docs/config/">OpenCode : konfiguracija</a>— Kako podesiti OpenCode i njegovo okruženje izvršavanja.</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_navedeni_alati">Navedeni alati</h3> <div class="ulist"> <ul> <li> <p><a href="https://github.com/nvm-sh/nvm">NVM na GitHub</a>— Node Version Manager. Upravnik verzija Node.js.</p> </li> <li> <p><a href="https://sdkman.io">SDKMAN — zvanični sajt</a>— SDKMAN! Menadžer verzija za JVM (Java, Kotlin, Gradle…​)</p> </li> <li> <p><a href="https://sdkman.io/install">SDKMAN : instalacija</a>— Vodič za instalaciju SDKMAN.</p> </li> <li> <p><a href="https://cli.github.com">gh` — GitHub CLI</a>— GitHub, alat iz komandne linije, neophodan za svakog programera.</p> </li> <li> <p><a href="https://gradle.org">Gradle — zvanični sajt</a>— Sistem gradnje kojeg instaliramo kroz SDKMAN.</p> </li> <li> <p><a href="https://pnpm.io">pnpm — službeni sajt</a>— Brži i prostorno efikasan menadžer paketa Node.js.</p> </li> <li> <p><a href="https://www.jetbrains.com/toolbox-app/">JetBrains Toolbox</a>— Menadžer IDE JetBrains koji dodaje svoje skripte u PATH</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_za_daljnje_istraživanje">Za daljnje istraživanje</h3> <div class="ulist"> <ul> <li> <p><a href="https://blog.andy2003.org/posts/2022/zsh-dotfiles/">Zsh dotfiles: kompletan priručnik</a>— Detaljni članak o upravljanju dotfiles Zsh.</p> </li> <li> <p><a href="https://wiki.archlinux.org/title/Zsh">Zsh na ArchWiki</a>— Jedna od najboljih zajedničkih dokumentacija za Zsh.</p> </li> <li> <p><a href="https://github.com/nvm-sh/nvm/issues">NVM problemi GitHub</a>— Da biste videli rasprave oko simboličke veze`current`и проблеми са PATH.</p> </li> </ul> </div> </div> </div> </div> https://cheroliv.com/blog/pilot-batch/0105_integrer_graphify_workflow_gradle_post.html Sun, 19 Apr 2026 00:00:00 +0000 blog/pilot-batch/0105_integrer_graphify_workflow_gradle_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_проблем_дијаграми_увек_у_назаду_у_односу_на_код">Проблем: дијаграми увек у назаду у односу на код</a></li> <li><a href="#_решение_детерминисански_конвејер_knowledge_graph_plantuml">Решение : детерминисански конвејер Knowledge Graph → PlantUML</a></li> <li><a href="#_корак_1_инсталирај_graphify_и_извлекни_знања_граф">Корак 1: Инсталирај Graphify и извлекни знања граф</a> <ul class="sectlevel2"> <li><a href="#_инсталација">Инсталација</a></li> <li><a href="#_настроји_искључаје">Настроји искључаје</a></li> <li><a href="#_извлеци_граф_знања">Извлеци граф знања</a></li> </ul> </li> <li><a href="#_korak_2_gradle_plugin_pretvara_knowledge_graph_u_plantuml">Korak 2: Gradle plugin pretvara Knowledge Graph u PlantUML</a> <ul class="sectlevel2"> <li><a href="#_arhitektura_pipeline">Arhitektura pipeline</a></li> <li><a href="#_unutrašnji_komponenti">Unutrašnji komponenti</a></li> <li><a href="#_правила_рендеринга">Правила рендеринга</a></li> </ul> </li> <li><a href="#_корак_3_коришћење_у_свакиданском_живу">Корак 3: Коришћење у свакиданском живу</a> <ul class="sectlevel2"> <li><a href="#_potpuni_dijagram">Potpuni dijagram</a></li> <li><a href="#_филтрирај_по_заједници">Филтрирај по заједници</a></li> <li><a href="#_филтрирај_по_типу_ивице">Филтрирај по типу ивице</a></li> <li><a href="#_филтрирај_по_типу_чвора_и_уверености">Филтрирај по типу чвора и уверености</a></li> <li><a href="#_prilagođeni_izlazni_direktorijum">Prilagođeni izlazni direktorijum</a></li> <li><a href="#_puna_referencia_svojstava">Puna referencia svojstava</a></li> </ul> </li> <li><a href="#_пуни_pipeline_у_gradle_workflow_у">Пуни pipeline у Gradle workflow-у</a> <ul class="sectlevel2"> <li><a href="#_tip_radnog_toka">Tip radnog toka</a></li> <li><a href="#_интеграција_у_циклусу_развоја">Интеграција у циклусу развоја</a></li> <li><a href="#_inkrementalno_ažuriranje">inkrementalno ažuriranje</a></li> </ul> </li> <li><a href="#_dogfooding_plugin_se_dokumentira_samo">Dogfooding: plugin se dokumentira samo</a></li> <li><a href="#_zašto_je_determinističko_i_zašto_je_bitno">Zašto je determinističko (i zašto je bitno)</a></li> <li><a href="#_dijagrami_samog_pipeline_a">Dijagrami samog pipeline-a</a></li> <li><a href="#_интеграција_у_управљање_пројектом">Интеграција у управљање пројектом</a></li> <li><a href="#_postavljanje_lista_kontrola_za_5_minuta">Postavljanje : lista kontrola za 5 minuta</a></li> <li><a href="#_пешке_и_ускрављања">Пешке и ускрављања</a></li> <li><a href="#_šta_na_kraju_dobijamo">Šta na kraju dobijamo</a></li> <li><a href="#_veze">Veze</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 12 minutes</div> <p>Vaša codebase raste. Ovisnosti između modula se množavaju. Arhitektura dokumentacija postaje zastarela još pre nego što je napisana. I da li vaš Gradle build može <em>automatski</em> generisati ażurne dijagrame iz stvarne strukture koda? To je tačno ono što radi Graphify + PlantUML Gradle Plugin pipeline:`graphify . --no-viz`izvlači Knowledge Graph`./gradlew generateKnowledgeGraphDiagram`Pretvara ga u PlantUML dijagrame. Nula LLM, nula ručnog, 100% deterministički.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">toc</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_проблем_дијаграми_увек_у_назаду_у_односу_на_код">Проблем: дијаграми увек у назаду у односу на код</h2> <div class="sectionbody"> <div class="paragraph"> <p>Svaki projekat koji prelazi nekoliko hiljada linija susreće ovaj sindrom.</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Crtamo dijagram arhitekture na početku projekta.</p> </li> <li> <p>Kod se razvija, zavisnosti se menja</p> </li> <li> <p>Dijagram postaje dekorativna laž</p> </li> <li> <p>Niko ne ažurira to jer je mrsko.</p> </li> <li> <p>Нови долазаци се ослањају на то и грешу</p> </li> </ol> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam ActivityBackgroundColor #FDEDEC skinparam ActivityDiamondBackgroundColor #FFF3CD start :Diagramme d'architecture créé\n(manuellement, à la main); :Le code évolue\n(nouvelles classes, nouvelles dépendances); :Diagramme obsolète\n(ne reflète plus le code); if (Qui met à jour ?) then (Personne) :Documentation mensongère; note right: Les nouveaux développeurs\nse basent dessus... et font des erreurs else (Quelqu'un) :Mise à jour manuelle\n(2-3 heures de travail); note right: Déjà obsolète\nà la prochaine PR endif stop @enduml</pre> </div> </div> <div class="paragraph"> <p>Pitanje nije <em>da li su potrebni dijagrami?</em> — svi znaju da je da. Pitanje je :<strong>Ko ih održava ažurnim?</strong></p> </div> <div class="paragraph"> <p>Odgovor: nitko. Osim ako je automatsko.</p> </div> </div> </div> <div class="sect1"> <h2 id="_решение_детерминисански_конвејер_knowledge_graph_plantuml">Решение : детерминисански конвејер Knowledge Graph → PlantUML</h2> <div class="sectionbody"> <div class="paragraph"> <p>Princip je jednostavan: umesto da crtamo dijagrame ručno, mi ih<strong>generiše iz stvarne strukture koda</strong>.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle actor Développeur component "Graphify (pip install graphifyy)" as Graphify collections "graphify-out/graph.json\n(Znanje graf)" as KGJSON component "PlantUML Gradle dodatak (generateKnowledgeGraphDiagram)" as Plugin component "KnowledgeGraphParser" as Parser component "KnowledgeGraphRenderer" as Renderer component "PlantumlService\n(validacija + renderovanje PNG)" as PS collections "diagrams/knowledge-graph/ (.puml + .png)" as Output Développeur --> Graphify : graphify . --no-viz Graphify --> KGJSON : extrait la structure\ndu code source Développeur --> Plugin : ./gradlew generateKnowledgeGraphDiagram Plugin --> Parser : parse(graph.json) Parser --> Plugin : KnowledgeGraph\n(noeuds + arêtes + communautés) Plugin --> Renderer : render(graph, filters) Renderer --> Plugin : code PlantUML\ndéterministe Plugin --> PS : validateSyntax + generateImage PS --> Output : .puml + .png note bottom of Plugin Pipeline DÉTERMINISTE Aucun appel LLM Résultat reproductible end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Две команде. Само то.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Étape 1 : extraire le Knowledge Graph graphify . --no-viz # Étape 2 : générer les diagrammes PlantUML ./gradlew generateKnowledgeGraphDiagram</code></pre> </div> </div> <div class="paragraph"> <p>Rezultat? Datoteke`.puml` et <code>.png`у`diagrams/knowledge-graph/</code>, verzionisani u Gitu, uvek ażurirani sa kodom.</p> </div> </div> </div> <div class="sect1"> <h2 id="_корак_1_инсталирај_graphify_и_извлекни_знања_граф">Корак 1: Инсталирај Graphify и извлекни знања граф</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_инсталација">Инсталација</h3> <div class="paragraph"> <p>Graphify je alat u Pythonu koji analizira vašu kodnu bazu i gradi strukturiran graf znanja:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Méthode recommandée uv tool install graphifyy && graphify install --platform opencode # Alternative avec pip pip install graphifyy && graphify install --platform opencode</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_настроји_искључаје">Настроји искључаје</h3> <div class="paragraph"> <p>Создај датотеку`.graphifyignore`у корену пројекта како би се искључили датотеке које nisu део пословне логике:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-gitignore hljs" data-lang="gitignore"># Secrets — JAMAIS dans le graphe *-context.yml *.env # Fichiers générés build/ .gradle/ # Tests fonctionnels src/functionalTest/</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_извлеци_граф_знања">Извлеци граф знања</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">graphify . --no-viz</code></pre> </div> </div> <div class="paragraph"> <p>Флаг`--no-viz`preskaže generisanje HTML (nije korisno u Gradle pipelinu). Rezultat je fajl`graphify-out/graph.json`sadrži :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Čvorovi</strong>: klase, funkcije, fajlovi — sa njihovim tipom i zajednicom</p> </li> <li> <p><strong>Ивице</strong>: odnosi između čvorova (EXTRACTED iz koda, INFERRED od LLM)</p> </li> <li> <p><strong>Zajednice</strong>: automatska grupisanja povezanih čvorova</p> </li> </ul> </div> <div class="listingblock"> <div class="title">Пример структуре`graph.json`</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-json hljs" data-lang="json">{ "nodes": [ {"id": "0", "label": "LlmService", "file_type": "code", "community": 0}, {"id": "1", "label": "ApiKeyPool", "file_type": "code", "community": 0}, {"id": "2", "label": "PlantumlService", "file_type": "code", "community": 1} ], "links": [ {"source": "1", "target": "0", "relation": "uses", "confidence": "EXTRACTED", "weight": 0.9}, {"source": "0", "target": "2", "relation": "calls", "confidence": "INFERRED", "weight": 0.7} ] }</code></pre> </div> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p>Izvorni kod (<code>.kt</code>, <code>.java</code>) se analizira lokalno putem tree-sitter,<strong>bez apelacije LLM</strong>. Samo dokumentacione datoteke (<code>.adoc</code>, <code>.md</code>) Требају LLM позив за семантчко извађање. Дакле`--update`Izmena Kotlin koda je skoro мгновена.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_korak_2_gradle_plugin_pretvara_knowledge_graph_u_plantuml">Korak 2: Gradle plugin pretvara Knowledge Graph u PlantUML</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_arhitektura_pipeline">Arhitektura pipeline</h3> <div class="paragraph"> <p>Plugin`com.cheroliv.plantuml`uključuje jedno zadatak`generateKnowledgeGraphDiagram`koji pretvara`graph.json`у PlantUML дијаграми на начин<strong>potpuno deterministički</strong>:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE participant "Gradle" as G participant "GenerateKnowledgeGraphDiagramTask" as Task participant "KnowledgeGraphParser" as Parser participant "KnowledgeGraphRenderer" as Renderer participant "PlantumlService" as PS collections "graphify-out/graph.json" as JSON G -> Task : execute Task -> JSON : read Task -> Parser : parse(graph.json) Parser --> Task : KnowledgeGraph\n(noeuds + arêtes + communautés) Task -> Renderer : render(graph, filters) Renderer --> Task : code PlantUML\n(déterministe) Task -> PS : validateSyntax(plantumlCode) alt syntaxe valide Task -> PS : generateImage → .png else syntaxe invalide Task -> Task : save .puml avec warning end @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_unutrašnji_komponenti">Unutrašnji komponenti</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">komponenta</th> <th class="tableblock halign-left valign-top">Улага</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>KnowledgeGraphParser</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">parsirati`graph.json`— Podržava tri formata: grafify natif (<code>nodes</code>+<code>links</code>), héritage (<code>communities</code>), flat. Решава numeričke ID-e у oznake.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>KnowledgeGraphRenderer</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Transformiši determinirano jedan`KnowledgeGraph`u kodu PlantUML. Grupe po tipu, zajednice u paketima, automatska legenda.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>GenerateKnowledgeGraphDiagramTask</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Gradle zadatak koji orkestriše: parse → render → validate → PNG. Podešivo preko Gradle svojstava.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>kgmodels.kt</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Modeli podataka:`KnowledgeGraph`, <code>KnowledgeGraphNode</code>, <code>KnowledgeGraphEdge</code>, <code>KnowledgeGraphCommunity</code>, <code>EdgeType</code>.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>PlantumlService</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Синтаксичка провјера + рендерирање PNG (поновно коришћен свим задацима плагина).</p></td> </tr> </tbody> </table> </div> <div class="sect2"> <h3 id="_правила_рендеринга">Правила рендеринга</h3> <div class="paragraph"> <p>Renderer primenjuje determinističke vizuelne konvencije:</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Tip ivice</th> <th class="tableblock halign-left valign-top">Notacija PlantUML</th> <th class="tableblock halign-left valign-top">Значење</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">извадак</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>-→</code>(pun linija, crna)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Однос изведен из изворног кода (сигурност)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">zaključen</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>..></code>(tačkasta linija)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Izvedena relacija od strane LLM (rezultat poverenja)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">неједназначан</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>--x</code>(crvena tackasta linija)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Nejedнозначни odnos (за proveru)</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Komunauti se prikazuju kao PlantUML paketi sa automatskom paletom boja.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_корак_3_коришћење_у_свакиданском_живу">Корак 3: Коришћење у свакиданском живу</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_potpuni_dijagram">Potpuni dijagram</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Générer le diagramme du Knowledge Graph complet ./gradlew generateKnowledgeGraphDiagram</code></pre> </div> </div> <div class="paragraph"> <p>Izlaz :`diagrams/knowledge-graph/knowledge-graph-full.puml`+<code>.png</code></p> </div> </div> <div class="sect2"> <h3 id="_филтрирај_по_заједници">Филтрирај по заједници</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Une seule communauté ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.community=community_0 # Limiter le nombre de noeuds (lisibilité) ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.community=community_0 \ -Pplantuml.kg.maxNodes=15</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_филтрирај_по_типу_ивице">Филтрирај по типу ивице</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Uniquement les relations certaines (EXTRACTED) ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.edgeTypes=EXTRACTED # Relations certaines + inférées ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.edgeTypes=EXTRACTED,INFERRED</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_филтрирај_по_типу_чвора_и_уверености">Филтрирај по типу чвора и уверености</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Uniquement les classes de code ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.nodeTypes=code # Seuil de confiance minimum (pour les INFERRED) ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.minConfidence=0.7</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_prilagođeni_izlazni_direktorijum">Prilagođeni izlazni direktorijum</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.outputDir=docs/architecture</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_puna_referencia_svojstava">Puna referencia svojstava</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Својство</th> <th class="tableblock halign-left valign-top">nedostatak</th> <th class="tableblock halign-left valign-top">Опис</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.community</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">(све)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Filtriranje zajednica po imenu (podnizno podudaranje)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.edgeTypes</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><em>(svi)</em></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tipovi granica odvojeni zarezom:`EXTRACTED`, <code>INFERRED</code>, <code>AMBIGUOUS</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.minConfidence</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>0.0</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Minimalni prag poverenja za ivice</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.maxNodes</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><em>(неограничен)</em></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Maksimalni broj čvorova za prikaz</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.nodeTypes</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><em>(svi)</em></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tipovi čvorova odvojeni zarezom (npr.<code>class</code>, <code>code</code>)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.outputDir</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>diagrams/knowledge-graph</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Izlazni direktorijum za fajlove`.puml` et <code>.png</code></p></td> </tr> </tbody> </table> </div> </div> </div> <div class="sect1"> <h2 id="_пуни_pipeline_у_gradle_workflow_у">Пуни pipeline у Gradle workflow-у</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_tip_radnog_toka">Tip radnog toka</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam ActivityBackgroundColor #E8F4FD skinparam ActivityDiamondBackgroundColor #FFF3CD skinparam ActivityBorderColor #2C3E50 start partition "извлаčenje" { :graphify . --no-viz; note right: Analyse le code source\ntree-sitter (local, pas de LLM) :graphify-out/graph.json; note right: Noeuds + arêtes\n+ communautés } partition "GENERACIJA" { :./gradlew generateKnowledgeGraphDiagram; note right: Pipeline déterministe\nparse → render → validate → PNG if (Filtres actifs ?) then (Oui) :Appliquer filtres\n(community, edgeTypes,\nmaxNodes, nodeTypes); else (Non) :Diagramme complet; endif :diagrams/knowledge-graph/\nknowledge-graph-full.puml\nknowledge-graph-full.png; } partition "ИНТЕГРАЦИЈА" { :git add diagrams/knowledge-graph/; :git commit; note right: Diagrammes versionnés\ntoujours à jour avec le code } stop @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_интеграција_у_циклусу_развоја">Интеграција у циклусу развоја</h3> <div class="paragraph"> <p>pipeline se prirodno uklapa u ključni koraci razvoja:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE state "Razvoj" as dev state "Extraction\ngraphify . --no-viz" as extract state "Generisanje ./gradlew generateKnowledgeGraphDiagram" as generate state "Commit verzijski dijagrami" as commit [*] --> dev dev --> extract : Code modifié extract --> generate : graph.json à jour generate --> commit : .puml + .png générés commit --> dev : Diagrammes dans le repo note right of extract Quasi instantané sur du code Kotlin (tree-sitter, pas de LLM) end note note right of generate Déterministe Pas de LLM Résultat reproductible end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_inkrementalno_ažuriranje">inkrementalno ažuriranje</h3> <div class="paragraph"> <p>Kada se kod promeni, ne reconstruisemo ceo graf od nule:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Mise à jour incrémentale (fichiers modifiés uniquement) graphify . --update # Puis régénérer les diagrammes ./gradlew generateKnowledgeGraphDiagram</code></pre> </div> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p><code>--update`ponovo izvuče samo modificirane fajlove (detektovane SHA256 u`graphify-out/cache/</code>). Na Kotlin kodu, to je skoro instantno jer tree-sitter radi lokalno bez poziva LLM.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_dogfooding_plugin_se_dokumentira_samo">Dogfooding: plugin se dokumentira samo</h2> <div class="sectionbody"> <div class="paragraph"> <p>Plugin PlantUML postoji za transformisanje promptova u dijagram. Može i da pretvori Knowledge Graph svoje <em>propre</em> kodne baze u dokumentacione dijagrame. To je <em>dogfooding</em> : plugin potrošuje svoju uslugu.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "Normalni pipeline (korisnik → dijagrami)" as normal { [Fichier .prompt] as prompt [LlmService\n+ ApiKeyPool] as llm1 [ProcessPlantumlPromptsTask] as task1 [Diagramme PNG] as out1 prompt --> task1 task1 --> llm1 llm1 --> out1 } package "Pipeline Knowledge Graph (deterministički, bez LLM)" as kg { [graphify-out/graph.json] as kgjson [KnowledgeGraphParser] as parser [KnowledgeGraphRenderer] as renderer [PlantumlService] as ps [Diagramme PNG\n(documentation du plugin)] as out2 kgjson --> parser parser --> renderer renderer --> ps ps --> out2 } package "Pipeline Dogfooding (LLM → dokumentacija plugina)" as dogfood { [GraphifyPromptAdapter] as gpa [Fichiers .prompt\nauto-générés] as auto_prompt [LlmService\n+ ApiKeyPool] as llm2 [ProcessPlantumlPromptsTask] as task2 [Diagramme PNG\n(documentation LLM)] as out3 kgjson --> gpa gpa --> auto_prompt auto_prompt --> task2 task2 --> llm2 llm2 --> out3 } note "Isti LlmService, isti ApiKeyPool, isti PlantumlService — Nula duplikacije" as N @enduml</pre> </div> </div> <div class="paragraph"> <p>Povezani Gradle zadaci :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Задатак</th> <th class="tableblock halign-left valign-top">LLM ?</th> <th class="tableblock halign-left valign-top">Опис</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>generateKnowledgeGraphDiagram</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ne</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Transformi`graph.json`у PlantUML (детерминистски)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>generateDiagramDocs</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Да</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Генериши неких`.prompt`od grafa, procesuira ih pomocu LLM (dogfooding)</p></td> </tr> </tbody> </table> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Documentation déterministe (rapide, pas de LLM) ./gradlew generateKnowledgeGraphDiagram # Documentation LLM (plus riche, consomme des tokens) ./gradlew generateDiagramDocs</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_je_determinističko_i_zašto_je_bitno">Zašto je determinističko (i zašto je bitno)</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ključna tačka konvejora`generateKnowledgeGraphDiagram` : <strong>Он не позива ниједан LLM</strong>. Трансформација`graph.json`→ PlantUML je čista funkcija.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle rectangle "Deterministicki pipeline (generateKnowledgeGraphDiagram)" as det { [graph.json] as json [KnowledgeGraphParser] as parser [KnowledgeGraphRenderer] as renderer [PlantUML code] as puml json --> parser : parse parser --> renderer : KnowledgeGraph renderer --> puml : render (fonction pure) } rectangle "Pipeline LLM\n(processPlantumlPrompts)" as llm { [.prompt] as prompt [LlmService] as llmSvc [ChatModel] as model [PlantUML code] as puml2 prompt --> llmSvc llmSvc --> model : API call model --> puml2 : réponse non-déterministe } note bottom of det Même entrée → même sortie Pas de latence réseau Pas de coût en tokens Reproductible en CI end note note bottom of llm Même entrée → sortie variable Latence réseau (1-5s) Coût en tokens Nécessite une clave API end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Конкретна предност :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Prednost</th> <th class="tableblock halign-left valign-top">Uticaj</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Репродуктивност</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">исте`graph.json`→ isti dijagram. Tačno. Svaki put.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Bez troška</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Nema poziva LLM = nema tokena = nema API računa.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Nula latencije</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Parsiranje + renderovanje traje oko 100ms, nije 1-5 sekundi.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Kompatibilan CI</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ne treba API ključ. Nema flaky test zbog varijabilnog LLM odgovora.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">способан за верзионирање</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Le <code>.puml`Генерисан је текст. Можемо га`diff</code>, pregledač u PR, verzionirati u Git</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_dijagrami_samog_pipeline_a">Dijagrami samog pipeline-a</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da zatvorimo krug, evo dijagrama pipeline-a kako bi ga generirao dodatak :</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE participant "Развојник" as Dev participant "Gradle" as G participant "GenerisiGrafZnanjaDijagramZadatak" as Task participant "Parser grafa znanja" as Parser participant "KnowledgeGraphRenderer" as Renderer participant "Сервис PlantUML" as PS collections "graphify-out/graph.json" as JSON collections "дијаграме/знање-граф/" as Out Dev -> G : ./gradlew generateKnowledgeGraphDiagram G -> Task : execute Task -> JSON : read Task -> Parser : parse(graph.json) Parser --> Task : KnowledgeGraph alt filtres actifs Task -> Task : appliquer filtres\n(community, edgeTypes, maxNodes…) end Task -> Renderer : render(graph, filters) Renderer --> Task : code PlantUML Task -> PS : validateSyntax() alt valide Task -> PS : generateImage() PS --> Out : .puml + .png else invalide Task -> Out : .puml (avec warning) end @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_интеграција_у_управљање_пројектом">Интеграција у управљање пројектом</h2> <div class="sectionbody"> <div class="paragraph"> <p>U našem projektu, ovaj pipeline se uklapa u strategiju upravljanja kontekstom EAGER/LAZY za AI agenta. Knowledge Graph zamjenjuje ručnu arhitektonsku dokumentaciju strukturom, upitom i automatski ažuriranim grafom.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "EAGER (uvek opterećen)" as eager { [PROMPT_REPRISE.adoc\n(contexte session)] as pr [INDEX.adoc\n(vue d'ensemble)] as idx [GRAPH_REPORT.adoc\n(~50 lignes)] as gr } package "LAZY — Strategija (na zahtev)" as lazy_strat { [Méthodologies] as meth [Archives sessions] as sessions } package "LAZY — Graphify (ciljeni upiti)" as lazy_graph { [graph.json] as gj [Queries\n(query/path/explain)] as queries } package "Pipeline PlantUML (automatski generisani)" as puml { [generateKnowledgeGraphDiagram] as kgTask [generateDiagramDocs] as ddTask [Diagrammes PNG] as diagrams } Agent --> eager : Lit en début de session Agent ..> lazy_strat : Charge si type détecté Agent ..> lazy_graph : Query si besoin structurel kgTask --> diagrams : Déterministe ddTask --> diagrams : Via LLM note right of gr Condensé du Knowledge Graph God nodes + communautés Remplace ECOSYSTEM_OVERVIEW (225 lignes → 50 lignes) end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Brak dva sistema je komplementaran:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Strategija upravlja KAD i KAKO</strong>— upravljanje, radni tok, arhiviranje</p> </li> <li> <p><strong>Graphify upravlja šta i gde</strong>struktura koda, odnosi, ciljani upiti</p> </li> </ul> </div> <div class="paragraph"> <p><em><em>_ Strategija sesije upravlja<strong>KADA</strong> et le <strong>kako</strong>(управљање, ток рада, прагови), Graphify га<strong>Шта</strong> et le <strong>gde</strong>(struktura koda, odnosi, ciljani upiti). PlantUML pipeline upravlja<strong>SA ŠTA?</strong>(deterministički dijagrami, verzionirani, uvek ažurirani) </em>_</em></p> </div> </div> </div> <div class="sect1"> <h2 id="_postavljanje_lista_kontrola_za_5_minuta">Postavljanje : lista kontrola za 5 minuta</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">#</th> <th class="tableblock halign-left valign-top">Етап</th> <th class="tableblock halign-left valign-top">Porudžbina</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Инсталирај Graphify</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>uv tool install graphifyy</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Настроји искључиве</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">креирати`.graphifyignore`</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Извлачење графа знања</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>graphify . --no-viz</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">4</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Генериши dijagrame</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>./gradlew generateKnowledgeGraphDiagram</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Commitovati rezultate</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>git add diagrams/knowledge-graph/</code></p></td> </tr> </tbody> </table> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Script complet en 5 commandes uv tool install graphifyy cat > .graphifyignore << 'EOF' *-context.yml *.env build/ .gradle/ EOF graphify . --no-viz ./gradlew generateKnowledgeGraphDiagram git add graphify-out/GRAPH_REPORT.adoc graphify-out/graph.json diagrams/knowledge-graph/</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_пешке_и_ускрављања">Пешке и ускрављања</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">застан</th> <th class="tableblock halign-left valign-top">Opis</th> <th class="tableblock halign-left valign-top">унажавање</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Previše gusto graf</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Veliki projekat generiše stotine nečitljivih čvorova</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">koristiti`-Pplantuml.kg.maxNodes=30`и филтрирај по заједници</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Preširoka isključivanja</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Previše fajlova u`.graphifyignore`smanjuje vrednost grafa</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Početi isključivanjem samo credentials i build</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Смер стрелица</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Grane INFERRED mogu imati nejednoznačan smer</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Филтер по`-Pplantuml.kg.edgeTypes=EXTRACTED`само за одређене односе</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Застарео граф</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Kod se menja ali graf nije ponovo konstruisan</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Koristiti`graphify . --update`redovito ili git hook`graphify hook install`</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Ажуриран кошт</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Inkrementalna ažuriranja su skoro besplatna (tree-sitter lokalno)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Само docs ()<code>.adoc</code>) potrošaju LLM tokene</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_šta_na_kraju_dobijamo">Šta na kraju dobijamo</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "пре" as avant { card "Дијаграми цртани руком Увек застарели Нико не ажурира их" as av1 #FDEDEC } rectangle "posle" as apres { card "Automatski generisani dijagrami Uvek ažurirani sa kodom Verzionisani u Gitu Deterministični i reproducibili" as ap1 #E8F8E8 } avant --> apres : graphify . --no-viz\n+ ./gradlew generateKnowledgeGraphDiagram @enduml</pre> </div> </div> <div class="paragraph"> <p>Конкретне koristi :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">dobit</th> <th class="tableblock halign-left valign-top">detalj</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Увијек ажурирана документација</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Dijagrami refleksuju trenutni kod, a ne ručnij snapshot</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Nula napora održavanja</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Dijagrami se ponovo generiraju pri svakom build-u</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Smanjenje tehničkog duga</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Више не треба да одржавате дијаграме рачно.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Vizuelni kontekst za nove</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Novi programer razume arhitekturu gledajući dijagrame</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">potencijalno podešavanje</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Parovi (potgraf → dijagram) su primeri obuke veštačke inteligencije.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Automatska validacija</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`PlantumlService.validateSyntax()`проверуј сваки генерисани дијаграм</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Brzo onboardovanje</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">5 dijagrama = puni pogled na arhitekturu</p></td> </tr> </tbody> </table> <div class="paragraph"> <p><em><em>_ Tko ima _zašto</em> može da nosi sve <em>kako</em> </em>__</p> </div> <div class="paragraph"> <p><em>zašto</em> : dijagrami uvek ažurirani. <em>komentar</em> : dve komande u Gradle pipeline-u.</p> </div> </div> </div> <div class="sect1"> <h2 id="_veze">Veze</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="https://github.com/nicholasgasior/graphify">Graphify на GitHub</a></p> </li> <li> <p><a href="https://github.com/cheroliv/plantuml-gradle">PlantUML Gradle Plugin</a></p> </li> <li> <p><a href="/blog/2026/0104_fg_command_super_tips_post.html">Super tips komande fg</a>— prethodni članak o terminalnom radnom toku</p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0105_integrer_graphify_workflow_gradle_post.html Sun, 19 Apr 2026 00:00:00 +0000 blog/2026/0105_integrer_graphify_workflow_gradle_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_problem_dijagrami_uvijek_zaostaju_u_odnosu_na_kod">Problem: dijagrami uvijek zaostaju u odnosu na kod</a></li> <li><a href="#_решение_детерминистични_конвејер_knowledge_graph_plantuml">Решение: детерминистични конвејер Knowledge Graph → PlantUML</a></li> <li><a href="#_корак_1_инсталирај_graphify_и_извлекни_knowledge_graph">Корак 1 : Инсталирај Graphify и извлекни Knowledge Graph</a> <ul class="sectlevel2"> <li><a href="#_инсталација">Инсталација</a></li> <li><a href="#_настројите_искљуке">Настројите искљуке</a></li> <li><a href="#_извуци_граф_знања">Извуци граф знања</a></li> </ul> </li> <li><a href="#_корак_2_gradle_плагин_трансформише_knowledge_graph_у_plantuml">Корак 2: Gradle плагин трансформише Knowledge Graph у PlantUML</a> <ul class="sectlevel2"> <li><a href="#_архитектура_конвејера">Архитектура конвејера</a></li> <li><a href="#_unutrašnji_komponenti">Unutrašnji komponenti</a></li> <li><a href="#_pravila_renderovanja">Pravila renderovanja</a></li> </ul> </li> <li><a href="#_корак_3_дневна_употреба">Корак 3 : Дневна употреба</a> <ul class="sectlevel2"> <li><a href="#_potpuni_dijagram">Potpuni dijagram</a></li> <li><a href="#_филтрирај_по_заједници">Филтрирај по заједници</a></li> <li><a href="#_filtriraj_po_tipu_grane">Filtriraj po tipu grane</a></li> <li><a href="#_filtriraj_po_tipu_čvora_i_poverenju">Filtriraj po tipu čvora i poverenju</a></li> <li><a href="#_прилагођени_излазни_директоријум">Прилагођени излазни директоријум</a></li> <li><a href="#_пуна_референца_својстава">Пуна референца својстава</a></li> </ul> </li> <li><a href="#_kompletan_pipeline_u_gradle_workflow_u">Kompletan pipeline u Gradle workflow-u</a> <ul class="sectlevel2"> <li><a href="#_tip_radnog_toka">Tip radnog toka</a></li> <li><a href="#_integracija_u_razvojni_ciklus">Integracija u razvojni ciklus</a></li> <li><a href="#_inkrementalno_ažuriranje">Inkrementalno ažuriranje</a></li> </ul> </li> <li><a href="#_dogfooding_plugin_se_dokumentuje_sam">Dogfooding: plugin se dokumentuje sam</a></li> <li><a href="#_zašto_je_deterministički_i_zašto_to_važi">Zašto je deterministički (i zašto to važi)</a></li> <li><a href="#_dijagrami_samog_pipeline_a">Dijagrami samog pipeline-a</a></li> <li><a href="#_интеграција_у_управљању_пројектом">Интеграција у управљању пројектом</a></li> <li><a href="#_priprema_checklist_u_5_minuta">Priprema: check‑list u 5 minuta</a></li> <li><a href="#_zalazi_i_mitigacije">Zalazi i mitigacije</a></li> <li><a href="#_šta_se_na_kraju_dobija">Šta se na kraju dobija</a></li> <li><a href="#_linkovi">Linkovi</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">Vreme čitanja : 12 minutes</div> <p>Vaša codebase raste. Zavisnosti između modula se množe. Arhitektonska dokumentacija postaje zastarela pre nego što bude napisana. Ako bi vaš Gradle build mogao <em>automatski</em> da generiše ażurne dijagrame iz stvarne strukture koda? To je tačno ono što radi pipeline Graphify + PlantUML Gradle Plugin :`graphify . --no-viz`izvuče Knowledge Graph,`./gradlew generateKnowledgeGraphDiagram`pretvara ga u PlantUML dijagrame. Nula LLM, nula priručnik, 100% deterministički.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">tik</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_problem_dijagrami_uvijek_zaostaju_u_odnosu_na_kod">Problem: dijagrami uvijek zaostaju u odnosu na kod</h2> <div class="sectionbody"> <div class="paragraph"> <p>Svaki projekat koji prelazi nekoliko hiljada linija poznaje ovaj sindrom :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>На цртамо архитектурни дијаграм на почетку пројекта</p> </li> <li> <p>Код се мења, зависности се мењају</p> </li> <li> <p>Dijagram postaje dekorativna laž</p> </li> <li> <p>Niko ne ažurira to jer je mučno.</p> </li> <li> <p>Novi dolazci se oslanjaju na to i prave greške</p> </li> </ol> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam ActivityBackgroundColor #FDEDEC skinparam ActivityDiamondBackgroundColor #FFF3CD start :Diagramme d'architecture créé\n(manuellement, à la main); :Le code évolue\n(nouvelles classes, nouvelles dépendances); :Diagramme obsolète\n(ne reflète plus le code); if (Qui met à jour ?) then (Personne) :Documentation mensongère; note right: Les nouveaux développeurs\nse basent dessus... et font des erreurs else (Quelqu'un) :Mise à jour manuelle\n(2-3 heures de travail); note right: Déjà obsolète\nà la prochaine PR endif stop @enduml</pre> </div> </div> <div class="paragraph"> <p>Pitanje nije <em>da li su potrebni dijagrami?</em> — svi znaju da je da. Pitanje je:<strong>Ko ih održava ažurno?</strong></p> </div> <div class="paragraph"> <p>Odgovor: nitko. Osim ako je automatsko.</p> </div> </div> </div> <div class="sect1"> <h2 id="_решение_детерминистични_конвејер_knowledge_graph_plantuml">Решение: детерминистични конвејер Knowledge Graph → PlantUML</h2> <div class="sectionbody"> <div class="paragraph"> <p>Princip je jednostavan: umesto da crtamo dijagrame ručno, mi ih<strong>генерише из реалне структуре кода</strong>.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle actor Développeur component "Graphify\n(pip install graphifyy)" as Graphify collections "graphify-out/graph.json (Znajstveni graf)" as KGJSON component "PlantUML Gradle Plugin\n(generateKnowledgeGraphDiagram)" as Plugin component "KnowledgeGraphParser" as Parser component "KnowledgeGraphRenderer" as Renderer component "PlantumlService\n(validacija + renderovanje PNG)" as PS collections "diagrams/knowledge-graph/\n(.puml + .png)" as Output Développeur --> Graphify : graphify . --no-viz Graphify --> KGJSON : extrait la structure\ndu code source Développeur --> Plugin : ./gradlew generateKnowledgeGraphDiagram Plugin --> Parser : parse(graph.json) Parser --> Plugin : KnowledgeGraph\n(noeuds + arêtes + communautés) Plugin --> Renderer : render(graph, filters) Renderer --> Plugin : code PlantUML\ndéterministe Plugin --> PS : validateSyntax + generateImage PS --> Output : .puml + .png note bottom of Plugin Pipeline DÉTERMINISTE Aucun appel LLM Résultat reproductible end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Dve komande. To je sve.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Étape 1 : extraire le Knowledge Graph graphify . --no-viz # Étape 2 : générer les diagrammes PlantUML ./gradlew generateKnowledgeGraphDiagram</code></pre> </div> </div> <div class="paragraph"> <p>Rezultat? Datoteke`.puml` et <code>.png`u`diagrams/knowledge-graph/</code>, verzionisani u Gitu, uvek ażurni sa kodom.</p> </div> </div> </div> <div class="sect1"> <h2 id="_корак_1_инсталирај_graphify_и_извлекни_knowledge_graph">Корак 1 : Инсталирај Graphify и извлекни Knowledge Graph</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_инсталација">Инсталација</h3> <div class="paragraph"> <p>Graphify je alat u Pythonu koji analizira vašu bazu koda i gradi strukturovan graf znanja :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Méthode recommandée uv tool install graphifyy && graphify install --platform opencode # Alternative avec pip pip install graphifyy && graphify install --platform opencode</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_настројите_искљуке">Настројите искљуке</h3> <div class="paragraph"> <p>Креирај фајл`.graphifyignore`у корени пројекта да би се искључили фајлови који нису дел пословне логике :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-gitignore hljs" data-lang="gitignore"># Secrets — JAMAIS dans le graphe *-context.yml *.env # Fichiers générés build/ .gradle/ # Tests fonctionnels src/functionalTest/</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_извуци_граф_знања">Извуци граф знања</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">graphify . --no-viz</code></pre> </div> </div> <div class="paragraph"> <p>Zastava`--no-viz`Preskače generisanje HTML (nije potrebno u Gradle pipeline). Rezultat je datoteka`graphify-out/graph.json`sadrži :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Čvorovi</strong>: klase, funkcije, fajlovi — sa njihovim tipom i zajednicom</p> </li> <li> <p><strong>ivice</strong>: odnosi između čvorova (EXTRACTED iz koda, INFERRED od LLM)</p> </li> <li> <p><strong>Заједнице</strong>: automatska grupisanja povezanih čvorova</p> </li> </ul> </div> <div class="paragraph"> <p>Пример структуре`graph.json`</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-json hljs" data-lang="json">{ "nodes": [ {"id": "0", "label": "LlmService", "file_type": "code", "community": 0}, {"id": "1", "label": "ApiKeyPool", "file_type": "code", "community": 0}, {"id": "2", "label": "PlantumlService", "file_type": "code", "community": 1} ], "links": [ {"source": "1", "target": "0", "relation": "uses", "confidence": "EXTRACTED", "weight": 0.9}, {"source": "0", "target": "2", "relation": "calls", "confidence": "INFERRED", "weight": 0.7} ] }</code></pre> </div> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p>Izvorni kod (<code>.kt</code>, <code>.java</code>) se analizira lokalno putem tree-sitter,<strong>bez apelacije LLM</strong>. Samo dokumentacioni fajlovi(<code>.adoc</code>, <code>.md</code>) zahtevaju poziv LLM za semantičko izdvajanje. Dakle`--update`na Kotlin kodu je skoro instantno.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_корак_2_gradle_плагин_трансформише_knowledge_graph_у_plantuml">Корак 2: Gradle плагин трансформише Knowledge Graph у PlantUML</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_архитектура_конвејера">Архитектура конвејера</h3> <div class="paragraph"> <p>Додатак`com.cheroliv.plantuml`uključuje zadatak`generateKnowledgeGraphDiagram`koji transforma`graph.json`u dijagramima PlantUML na način<strong>potpuno deterministički</strong>:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE participant "Gradle" as G participant "GenerateKnowledgeGraphDiagramTask" as Task participant "Parsač grafa znanja" as Parser participant "KnowledgeGraphRenderer" as Renderer participant "PlantumlService" as PS collections "graphify-out/graph.json" as JSON G -> Task : execute Task -> JSON : read Task -> Parser : parse(graph.json) Parser --> Task : KnowledgeGraph\n(noeuds + arêtes + communautés) Task -> Renderer : render(graph, filters) Renderer --> Task : code PlantUML\n(déterministe) Task -> PS : validateSyntax(plantumlCode) alt syntaxe valide Task -> PS : generateImage → .png else syntaxe invalide Task -> Task : save .puml avec warning end @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_unutrašnji_komponenti">Unutrašnji komponenti</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">komponent</th> <th class="tableblock halign-left valign-top">Uloga</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>KnowledgeGraphParser</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Parse <code>graph.json</code>— podržava 3 formata : prirodni graphify`nodes`+<code>links</code>), legacy (<code>communities</code>), ravno. Rešava numeričke ID-jeve u oznake.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>KnowledgeGraphRenderer</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Transformiši deterministički`KnowledgeGraph`у коду PlantUML. Групова по тип, заједнице у пакетима, аутоматска легенда.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>GenerateKnowledgeGraphDiagramTask</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Gradle zadatak koji orkestruje: parse → render → validate → PNG. Konfigurisan preko Gradle svojstava.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>kgmodels.kt</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Modeli podataka :`KnowledgeGraph`, <code>KnowledgeGraphNode</code>, <code>KnowledgeGraphEdge</code>, <code>KnowledgeGraphCommunity</code>, <code>EdgeType</code>.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>PlantumlService</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Sintaksna validacija + PNG renderovanje (ponovo korišćen svim zadacima plugina)</p></td> </tr> </tbody> </table> </div> <div class="sect2"> <h3 id="_pravila_renderovanja">Pravila renderovanja</h3> <div class="paragraph"> <p>Renderer primenjuje deterministicke vizuelne konvencije :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Tip ivice</th> <th class="tableblock halign-left valign-top">Notacija PlantUML</th> <th class="tableblock halign-left valign-top">значење</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">EXTRACTED</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>-→</code>(pun linija, crna)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Izveznuta relacija iz izvorni koda (sigurnost)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">zaključeno</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>..></code>(tačkasta linija)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Relacija zaključena od LLM (ocena poverenja)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">ДВОСМИСЛЕН</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>--x</code>(crvena punktirana linija)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Nejednoznačna veza (da se proveri)</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Komunitarne zajednice su prikazane kao PlantUML paketi sa automatskom paletom boja.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_корак_3_дневна_употреба">Корак 3 : Дневна употреба</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_potpuni_dijagram">Potpuni dijagram</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Générer le diagramme du Knowledge Graph complet ./gradlew generateKnowledgeGraphDiagram</code></pre> </div> </div> <div class="paragraph"> <p>Излаз:`diagrams/knowledge-graph/knowledge-graph-full.puml`+<code>.png</code></p> </div> </div> <div class="sect2"> <h3 id="_филтрирај_по_заједници">Филтрирај по заједници</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Une seule communauté ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.community=community_0 # Limiter le nombre de noeuds (lisibilité) ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.community=community_0 \ -Pplantuml.kg.maxNodes=15</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_filtriraj_po_tipu_grane">Filtriraj po tipu grane</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Uniquement les relations certaines (EXTRACTED) ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.edgeTypes=EXTRACTED # Relations certaines + inférées ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.edgeTypes=EXTRACTED,INFERRED</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_filtriraj_po_tipu_čvora_i_poverenju">Filtriraj po tipu čvora i poverenju</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Uniquement les classes de code ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.nodeTypes=code # Seuil de confiance minimum (pour les INFERRED) ./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.minConfidence=0.7</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_прилагођени_излазни_директоријум">Прилагођени излазни директоријум</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew generateKnowledgeGraphDiagram \ -Pplantuml.kg.outputDir=docs/architecture</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_пуна_референца_својстава">Пуна референца својстава</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">svojina</th> <th class="tableblock halign-left valign-top">подразумевано</th> <th class="tableblock halign-left valign-top">Опис</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.community</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">(sve)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Филтрирај заједнице по називу (подударење подниза)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.edgeTypes</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><em>(sve)</em></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tipovi grana odvojeni zarezom :`EXTRACTED`, <code>INFERRED</code>, <code>AMBIGUOUS</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.minConfidence</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>0.0</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Minimalni prag poverenja za ivice</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.maxNodes</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><em>(неограничено)</em></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Maksimalni broj čvorova za prikaz</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.nodeTypes</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">(svi)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tipovi čvorova razdvojeni zarezami (prim.<code>class</code>, <code>code</code>)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>plantuml.kg.outputDir</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>diagrams/knowledge-graph</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Izlazni direktorijum za fajlove`.puml` et <code>.png</code></p></td> </tr> </tbody> </table> </div> </div> </div> <div class="sect1"> <h2 id="_kompletan_pipeline_u_gradle_workflow_u">Kompletan pipeline u Gradle workflow-u</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_tip_radnog_toka">Tip radnog toka</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam ActivityBackgroundColor #E8F4FD skinparam ActivityDiamondBackgroundColor #FFF3CD skinparam ActivityBorderColor #2C3E50 start partition "EKSTRAKCIJA" { :graphify . --no-viz; note right: Analyse le code source\ntree-sitter (local, pas de LLM) :graphify-out/graph.json; note right: Noeuds + arêtes\n+ communautés } partition "ГЕНЕРАЦИЈА" { :./gradlew generateKnowledgeGraphDiagram; note right: Pipeline déterministe\nparse → render → validate → PNG if (Filtres actifs ?) then (Oui) :Appliquer filtres\n(community, edgeTypes,\nmaxNodes, nodeTypes); else (Non) :Diagramme complet; endif :diagrams/knowledge-graph/\nknowledge-graph-full.puml\nknowledge-graph-full.png; } partition "integracija" { :git add diagrams/knowledge-graph/; :git commit; note right: Diagrammes versionnés\ntoujours à jour avec le code } stop @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_integracija_u_razvojni_ciklus">Integracija u razvojni ciklus</h3> <div class="paragraph"> <p>Pipeline se prirodno uklapa u ključnim fazama razvoja:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE state "Развој" as dev state "Ekstrakcija grafikuj . --no-viz" as extract state "Generacija ./gradlew generateKnowledgeGraphDiagram" as generate state "Commit verzionisani dijagrami" as commit [*] --> dev dev --> extract : Code modifié extract --> generate : graph.json à jour generate --> commit : .puml + .png générés commit --> dev : Diagrammes dans le repo note right of extract Quasi instantané sur du code Kotlin (tree-sitter, pas de LLM) end note note right of generate Déterministe Pas de LLM Résultat reproductible end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_inkrementalno_ažuriranje">Inkrementalno ažuriranje</h3> <div class="paragraph"> <p>Kada se kod promeni, ne se ponovo gradi sav graf od nule:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Mise à jour incrémentale (fichiers modifiés uniquement) graphify . --update # Puis régénérer les diagrammes ./gradlew generateKnowledgeGraphDiagram</code></pre> </div> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p><code>--update`ponovo izvuče samo modificirane fajlove (detektovani po SHA256 u`graphify-out/cache/</code>) Na Kotlin kodu, skoro je instantan jer tree-sitter radi lokalno bez poziva LLM.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_dogfooding_plugin_se_dokumentuje_sam">Dogfooding: plugin se dokumentuje sam</h2> <div class="sectionbody"> <div class="paragraph"> <p>PlantUML plugin postoji da pretvara upite u dijagrame. Takode može pretvoriti Knowledge Graph svoje <em>vlasno</em> codebase u dokumentacione dijagrame. To je <em>dogfooding</em> : plugin konzumira sopstvenu uslugu.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "Normalni pipeline (korisnik → dijagrami)" as normal { [Fichier .prompt] as prompt [LlmService\n+ ApiKeyPool] as llm1 [ProcessPlantumlPromptsTask] as task1 [Diagramme PNG] as out1 prompt --> task1 task1 --> llm1 llm1 --> out1 } package "Pipeline Graf znanja (deterministički, bez LLM)" as kg { [graphify-out/graph.json] as kgjson [KnowledgeGraphParser] as parser [KnowledgeGraphRenderer] as renderer [PlantumlService] as ps [Diagramme PNG\n(documentation du plugin)] as out2 kgjson --> parser parser --> renderer renderer --> ps ps --> out2 } package "Pipeline Dogfooding (LLM → dokumentacija plugina)" as dogfood { [GraphifyPromptAdapter] as gpa [Fichiers .prompt\nauto-générés] as auto_prompt [LlmService\n+ ApiKeyPool] as llm2 [ProcessPlantumlPromptsTask] as task2 [Diagramme PNG\n(documentation LLM)] as out3 kgjson --> gpa gpa --> auto_prompt auto_prompt --> task2 task2 --> llm2 llm2 --> out3 } note "Исти LlmService, исти ApiKeyPool, исти PlantumlService — NULA дуплирање" as N @enduml</pre> </div> </div> <div class="paragraph"> <p>Povezani Gradle zadaci:</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">zadatak</th> <th class="tableblock halign-left valign-top">LLM ?</th> <th class="tableblock halign-left valign-top">опис</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>generateKnowledgeGraphDiagram</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ne</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Преобрази`graph.json`у PlantUML (детерминистично)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>generateDiagramDocs</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Da</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Генерира неке`.prompt`од графa, обрађује их преко LLM (dogfooding)</p></td> </tr> </tbody> </table> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Documentation déterministe (rapide, pas de LLM) ./gradlew generateKnowledgeGraphDiagram # Documentation LLM (plus riche, consomme des tokens) ./gradlew generateDiagramDocs</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_je_deterministički_i_zašto_to_važi">Zašto je deterministički (i zašto to važi)</h2> <div class="sectionbody"> <div class="paragraph"> <p>Кључна тачка пајплайна`generateKnowledgeGraphDiagram` : <strong>On ne poziva nikog LLM</strong>. transformacija`graph.json`→ PlantUML je čista funkcija.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle rectangle "deterministski pipeline (generateKnowledgeGraphDiagram)" as det { [graph.json] as json [KnowledgeGraphParser] as parser [KnowledgeGraphRenderer] as renderer [PlantUML code] as puml json --> parser : parse parser --> renderer : KnowledgeGraph renderer --> puml : render (fonction pure) } rectangle "Pipeline LLM\n(processPlantumlPrompts)" as llm { [.prompt] as prompt [LlmService] as llmSvc [ChatModel] as model [PlantUML code] as puml2 prompt --> llmSvc llmSvc --> model : API call model --> puml2 : réponse non-déterministe } note bottom of det Même entrée → même sortie Pas de latence réseau Pas de coût en tokens Reproductible en CI end note note bottom of llm Même entrée → sortie variable Latence réseau (1-5s) Coût en tokens Nécessite une clave API end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Конкретне предности:</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Предност</th> <th class="tableblock halign-left valign-top">утицај</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Репродуктивност</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">исте`graph.json`→ истог дијаграма. Тачно. Увек.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Нула трошак</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Nema poziva LLM = nema tokena = nema računa API.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Nula latencije</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Parsiranje + renderovanje traje ~100ms, ne 1-5 sekundi.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">savладан sa CI</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Nije potreban API ključ. Nema nestabilnog testa zbog varijabilnog LLM odgovora.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">верzionabilan</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Le <code>.puml`generisan je nekog teksta. Možemo ga`diff</code>, recenzent u PR-u, verzionirati u Git-u.</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_dijagrami_samog_pipeline_a">Dijagrami samog pipeline-a</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bismo zaključili petlju, ovo je dijagram pipeline-a kao što bi ga generisao plugin:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE participant "Развојник" as Dev participant "Gradle" as G participant "GenerateKnowledgeGraphDiagramTask" as Task participant "KnowledgeGraphParser" as Parser participant "Renderer grafa znanja" as Renderer participant "PlantumlService" as PS collections "graphify-out/graph.json" as JSON collections "diagrams/knowledge-graph/" as Out Dev -> G : ./gradlew generateKnowledgeGraphDiagram G -> Task : execute Task -> JSON : read Task -> Parser : parse(graph.json) Parser --> Task : KnowledgeGraph alt filtres actifs Task -> Task : appliquer filtres\n(community, edgeTypes, maxNodes…) end Task -> Renderer : render(graph, filters) Renderer --> Task : code PlantUML Task -> PS : validateSyntax() alt valide Task -> PS : generateImage() PS --> Out : .puml + .png else invalide Task -> Out : .puml (avec warning) end @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_интеграција_у_управљању_пројектом">Интеграција у управљању пројектом</h2> <div class="sectionbody"> <div class="paragraph"> <p>U našem projektu, ovaj pipeline se uključi u strategiju upravljanja kontekstem EAGER/LAZY za agenta AI. Knowledge Graph zamenuje ručnu dokumentaciju arhitekture strukturiranim, upitnim i samoodažurivim grafom.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "EAGER\n(uvijek opterećen)" as eager { [PROMPT_REPRISE.adoc\n(contexte session)] as pr [INDEX.adoc\n(vue d'ensemble)] as idx [GRAPH_REPORT.adoc\n(~50 lignes)] as gr } package "LAZY — Strategija (na zahtev)" as lazy_strat { [Méthodologies] as meth [Archives sessions] as sessions } package "LAZY — Graphify (ciljani upiti)" as lazy_graph { [graph.json] as gj [Queries\n(query/path/explain)] as queries } package "Pipeline PlantUML (autogenerisan)" as puml { [generateKnowledgeGraphDiagram] as kgTask [generateDiagramDocs] as ddTask [Diagrammes PNG] as diagrams } Agent --> eager : Lit en début de session Agent ..> lazy_strat : Charge si type détecté Agent ..> lazy_graph : Query si besoin structurel kgTask --> diagrams : Déterministe ddTask --> diagrams : Via LLM note right of gr Condensé du Knowledge Graph God nodes + communautés Remplace ECOSYSTEM_OVERVIEW (225 lignes → 50 lignes) end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Bračenje dva sistema je komplementarno:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Strategija upravlja KAD i KAKO</strong>— upravljanje, radni tok, arhiviranje</p> </li> <li> <p><strong>Graphify rukuje šta i gde</strong>— struktura koda, relacije, ciljani upiti</p> </li> </ul> </div> <div class="paragraph"> <p><em><em>_ Стратегија сесије управља<strong>КАД</strong> et le <strong>kako</strong>(upravljanje, tok rada, pragovi), Graphify upravlja<strong>šta</strong> et le <strong>Gde</strong>(структура кода, односе, цељни упити). PlantUML pipeline управља<strong>СА ШТА?</strong>(deterministički dijagrami, verzionirani, uvek ažurirani). </em>_</em></p> </div> </div> </div> <div class="sect1"> <h2 id="_priprema_checklist_u_5_minuta">Priprema: check‑list u 5 minuta</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">#</th> <th class="tableblock halign-left valign-top">Корак</th> <th class="tableblock halign-left valign-top">narudžba</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Instaliraj Graphify</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>uv tool install graphifyy</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Konfigurisati isključivanja</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">креирати`.graphifyignore`</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Izvući Knowledge Graph</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>graphify . --no-viz</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">4</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Generiši dijagrame</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>./gradlew generateKnowledgeGraphDiagram</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Комитовати резултате</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>git add diagrams/knowledge-graph/</code></p></td> </tr> </tbody> </table> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Script complet en 5 commandes uv tool install graphifyy cat > .graphifyignore << 'EOF' *-context.yml *.env build/ .gradle/ EOF graphify . --no-viz ./gradlew generateKnowledgeGraphDiagram git add graphify-out/GRAPH_REPORT.adoc graphify-out/graph.json diagrams/knowledge-graph/</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zalazi_i_mitigacije">Zalazi i mitigacije</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 33.3333%;"> <col style="width: 33.3334%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Капчао</th> <th class="tableblock halign-left valign-top">Opis</th> <th class="tableblock halign-left valign-top">Mitigacija</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Preterano gust graf</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Велики пројекат генерише стотине нечитавих чворова</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">koristiti`-Pplantuml.kg.maxNodes=30`и филтрирај по заједници</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Previše širi iskljuci</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Previše fajlova u`.graphifyignore`smanjuje vrednost grafa</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Počinuti isključivanjem samo credentials i build</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Smer strelica</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">INFERRED ivice mogu imati nejednoznačan pravac</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Филтрирај по`-Pplantuml.kg.edgeTypes=EXTRACTED`samo za određene odnose</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Zastareli graf</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Код се мења, али граф није опет построен</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">користити`graphify . --update`redovito ili git hook`graphify hook install`</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Ažurirana cena</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Inkrementalna ažuriranja su skoro besplatna (tree-sitter lokalno)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Samo docs(<code>.adoc</code>) troše tokene LLM</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_šta_se_na_kraju_dobija">Šta se na kraju dobija</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "пре" as avant { card "Дијаграми нацртани руком Увек застарели Нико их ажурира" as av1 #FDEDEC } rectangle "НАКОН" as apres { card "Automatski generisani dijagrami Uvek ażuran sa kodom Verzija u Gitu Deterministični i reproducibilni" as ap1 #E8F8E8 } avant --> apres : graphify . --no-viz\n+ ./gradlew generateKnowledgeGraphDiagram @enduml</pre> </div> </div> <div class="paragraph"> <p>Конкретне користи:</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Прибут</th> <th class="tableblock halign-left valign-top">detalj</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Документација увек ажурирана</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Dijagrami odražavaju trenutni kod, a ne ručni snapshot</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Nula napora održavanja</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Dijagrami se regenerišu na svakom build-u</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Smanjenje tehničkog duga</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Више не морате да одржавате дијаграме ручно.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Визуелни контекст за нових</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Novi programer razume arhitekturu gledajući dijagrame.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">potenijalno podešavanje</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Parovi (podgraf → dijagram) su primeri obuke veštačke inteligencije</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Автоматска валидација</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`PlantumlService.validateSyntax()`proverava svaki generisani dijagram</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Brzo uvođenje</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">5 dijagrama = kompletan pogled na arhitekturu</p></td> </tr> </tbody> </table> <div class="paragraph"> <p><em><em>_ Tko ima _zašto</em> može da nosi sve <em>kako</em>. </em>__</p> </div> <div class="paragraph"> <p>Za <em>zašto</em>: dijagrami koji su uvek ažurni. Za <em>kako</em>: dve komande u Gradle pipeline-u.</p> </div> </div> </div> <div class="sect1"> <h2 id="_linkovi">Linkovi</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="https://github.com/nicholasgasior/graphify">Graphify на GitHub</a></p> </li> <li> <p><a href="https://github.com/cheroliv/plantuml-gradle">PlantUML Gradle Plugin</a></p> </li> <li> <p><a href="/blog/2026/0104_fg_command_super_tips_post.html">Супер савети за команду fg</a>— претексни чланак о терминаљском току рада</p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0104_fg_command_super_tips_post.html Sat, 18 Apr 2026 00:00:00 +0000 blog/2026/0104_fg_command_super_tips_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_problem_zauzet_terminal">Problem: zauzet terminal</a></li> <li><a href="#_tri_neophodne_komande">Tri neophodne komande</a> <ul class="sectlevel2"> <li><a href="#_ctrlz_zaustavi_sigtstp">Ctrl+Z — Zaustavi (SIGTSTP)</a></li> <li><a href="#_fg_врати_на_предњи_план">fg — Врати на предњи план</a></li> <li><a href="#_bg_nastavi_u_pozadini">bg — Nastavi u pozadini</a></li> <li><a href="#_jobs_lista_poslova_u_shellu">jobs — Lista poslova u shellu</a></li> </ul> </li> <li><a href="#_scenarij_1_dugi_build">Scenarij 1: dugi build</a> <ul class="sectlevel2"> <li><a href="#_korak_po_korak">Korak po korak</a></li> </ul> </li> <li><a href="#_scenario_2_zaboravljeni_urednik">Scenario 2: Zaboravljeni urednik</a></li> <li><a href="#_сценарио_3_процесс_opencode_приостановљен">Сценарио 3: Процесс opencode приостановљен</a></li> <li><a href="#_сценарио_4_управљати_више_послова_у_истом_времену">Сценарио 4: Управљати више послова у истом времену</a> <ul class="sectlevel2"> <li><a href="#_свод_наредби_за_poslove">Свод наредби за poslove</a></li> </ul> </li> <li><a href="#_razlike_između_fg_bg_ctrlz_ctrlc_i">Razlike između fg, bg, Ctrl+Z, Ctrl+C i &</a></li> <li><a href="#_potpun_životni_ciklus_posla">Potpun životni ciklus posla</a></li> <li><a href="#_napredni_saveti">Napredni saveti</a> <ul class="sectlevel2"> <li><a href="#_fg_sa_najnovijim_poslom_i_alternativom">fg sa najnovijim poslom i alternativom</a></li> <li><a href="#_убити_посао_на_правилан_начин">убити посао на правилан начин</a></li> <li><a href="#_disown_odvoji_se_od_shell_a">disown : odvoji se od shell-a</a></li> <li><a href="#_kombinirati_sa_nohup_za_dugoke_procese">Kombinirati sa nohup za dugoke procese</a></li> </ul> </li> <li><a href="#_ловушке_и_честе_грешке">ловушке и честе грешке</a> <ul class="sectlevel2"> <li><a href="#_мешати_ctrlz_и_ctrlc">Мешати Ctrl+Z и Ctrl+C</a></li> <li><a href="#_poslovi_su_lokalni_u_shellu">Poslovi su lokalni u shellu</a></li> <li><a href="#_poslovi_ne_preživljavaju_zatvaranje_shell_a">Poslovi ne preživljavaju zatvaranje shell-a</a></li> <li><a href="#_interaktivni_procesi_i_fg">Interaktivni procesi i fg</a></li> </ul> </li> <li><a href="#_сводни_дијаграм">Сводни дијаграм</a></li> <li><a href="#_zašto_fg_je_podocenjen">Zašto fg je podocenjen</a></li> <li><a href="#_tehnička_memorija_signali">Tehnička memorija: signali</a></li> <li><a href="#_zaključak">Zaključak</a></li> <li><a href="#_референце">Референце</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme čitanja : 10 minutes</div> <p>Vi bacate`./gradlew build`, terminal je blokiran za 3 minute, i vi trebate da uradite nešto drugo <em>čekajući</em>? Ne treba da otvorite novu karticu.`Ctrl+Z`zaustavljuje proces,`fg`Vraća vas tačno na mesto gde ste ga ostavili. To je najmanje cenjen Unix savet u svakodnevnom životu programera.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">так</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_problem_zauzet_terminal">Problem: zauzet terminal</h2> <div class="sectionbody"> <div class="paragraph"> <p>Svaki programer je doživio ovu situaciju:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ ./gradlew build > Building...</code></pre> </div> </div> <div class="paragraph"> <p>Терминал је блокиран. Више не можете укуцати ниједну команду. И вам је потребно прегледати датотеку, покренути`git status`, или проверити заузети порт.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE actor Développeur as dev participant "Терминал" as term participant "Gradle ( proces )" as gradle dev -> term : ./gradlew build term -> gradle : Lance le build gradle -> term : Occupe le terminal\n(pas de prompt) dev -> term : veut taper une commande term --> dev : ❌ Terminal bloqué note right of dev Le développeur est paralysé pendant toute la durée du build end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Većina programera otvara novi terminal. Ipak postoji rešenje koje je elegantnija, brža i prirodna: upravljanje poslovima.</p> </div> </div> </div> <div class="sect1"> <h2 id="_tri_neophodne_komande">Tri neophodne komande</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_ctrlz_zaustavi_sigtstp">Ctrl+Z — Zaustavi (SIGTSTP)</h3> <div class="paragraph"> <p>`Ctrl+Z`Šalje signal`SIGTSTP`процесу у передњем плану. Процес је<strong>suspendovan</strong>— ne ubijen — i terminal vraća svoj prompt.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ ./gradlew build > Building... ^Z [1]+ Stoppé ./gradlew build $</code></pre> </div> </div> <div class="paragraph"> <p>Број између заграда`[1]`је<strong>broj posla</strong>. Le `+`ukazuje na podrazumevani posao</p> </div> </div> <div class="sect2"> <h3 id="_fg_врати_на_предњи_план">fg — Врати на предњи план</h3> <div class="paragraph"> <p>`fg`vraća zaustavljen posao u primarni plan. Proces se nastavlja tačno gde se je zaustavio.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ fg ./gradlew build > Building... (reprend où il en était)</code></pre> </div> </div> <div class="paragraph"> <p>Sa specifičnim brojem posla :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ fg %2</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_bg_nastavi_u_pozadini">bg — Nastavi u pozadini</h3> <div class="paragraph"> <p>`bg`Uzima proces <em>bez</em> blokiranja terminala. Idealno za dugograjde gradnje.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ bg [1]+ ./gradlew build & $</code></pre> </div> </div> <div class="paragraph"> <p>Le `&`Na kraju znači da se proces izvršava u pozadini.</p> </div> </div> <div class="sect2"> <h3 id="_jobs_lista_poslova_u_shellu">jobs — Lista poslova u shellu</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ jobs [1]- Stoppé vim README.md [2]+ En cours ./gradlew build</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontName sans-serif state "prednji plan\n(blokiran terminal)" as fg #LightCoral state "Заустavljen\n(Ctrl+Z)" as stopped #LightYellow state "Фон\n(bg)" as bg_ #LightGreen [*] --> fg : Lance une commande fg --> stopped : Ctrl+Z\n(SIGTSTP) stopped --> fg : fg\nreprend en avant-plan stopped --> bg_ : bg\nreprend en arrière-plan bg_ --> fg : fg\nramène en avant-plan fg --> [*] : Commande terminée note right of stopped Le processus est figé mais _pas_ tué end note note left of bg_ Le terminal est libre le build continue end note @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_scenarij_1_dugi_build">Scenarij 1: dugi build</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovo je najčešći slučaj korištenja. Pokrenete Gradle build, terminal je blokiran, i morate da uradite nešto drugo.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE autonumber actor Développeur as dev participant "terminal" as term participant "Gradle" as gradle database "stanje\nproces" as state dev -> term : ./gradlew build term -> gradle : Lance le build gradle -> state : En cours (FG) dev -> term : Ctrl+Z term -> state : Suspendu (job [1]) term --> dev : Prompt libre $ dev -> term : git status term --> dev : working tree clean dev -> term : fg term -> state : Reprend (FG) gradle --> dev : Build réussi ✓ note right of state Le processus Gradle n'a jamais été tué Il reprend exactement où il s'était arrêté end note @enduml</pre> </div> </div> <div class="sect2"> <h3 id="_korak_po_korak">Korak po korak</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ ./gradlew build > Building... ^Z [1]+ Stoppé ./gradlew build $ git status On branch main nothing to commit, working tree clean $ fg ./gradlew build > Building... BUILD SUCCESSFUL in 2m 34s</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_scenario_2_zaboravljeni_urednik">Scenario 2: Zaboravljeni urednik</h2> <div class="sectionbody"> <div class="paragraph"> <p>Vi ste u`vim`, trebate da pogledate drugi fajl <em>bez</em> napuštanja`vim`.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Dans vim, en mode commande : :shell $ cat /path/to/other/file.txt $ exit # Retour dans vim</code></pre> </div> </div> <div class="paragraph"> <p>Ali je teško. Sa`Ctrl+Z`, to je odmah :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Dans vim, n'importe quel moment : Ctrl+Z [1]+ Stoppé vim README.md $ cat /path/to/other/file.txt # ... lire le fichier ... $ fg vim README.md # Retour exact là où on en était, curseur en place</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE autonumber actor Développeur as dev participant "vim" as vim participant "lupija" as shell dev -> vim : édition en cours dev -> vim : Ctrl+Z vim -> shell : Suspendu (job [1]) dev -> shell : cat autre_fichier.txt shell --> dev : contenu du fichier dev -> shell : fg shell -> vim : Reprend (job [1]) vim --> dev : Curseur exactement\nà la même position note right of vim vim restaure intégralement l'état : position du curseur, buffer, undo stack end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Белешка:`vim`savršeno vraća svoje stanje nakon`fg`: pozicija kurzora, sadržaj bafera, istorija poništavanja — sve je sačuvano.</p> </div> </div> </div> <div class="sect1"> <h2 id="_сценарио_3_процесс_opencode_приостановљен">Сценарио 3: Процесс opencode приостановљен</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ово је сценариј који је мотивао ovaj чланак. Ви користите`opencode`(CLI alat za pokretanje LLM na vašem kodu), a proces je zaustavljen.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontName sans-serif skinparam componentStyle rectangle actor Développeur as dev participant "opencode (агент LLM)" as agent participant "Shell" as shell participant "git" as git dev -> agent : Session active agent -> agent : Tour de parole\ndu LLM en cours note over agent Ctrl+Z arrive en plein milieu d'une analyse de code end note dev -> agent : Ctrl+Z agent -> shell : Suspendu (job [1]) dev -> git : git diff git --> dev : changements visibles dev -> shell : fg shell -> agent : Reprend (job [1]) agent --> dev : Reprend exactement\nl'analyse en cours note right of agent Aucune perte de contexte Le LLM reprend sa réponse exactement où il en était end note @enduml</pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ opencode # ... session en cours, LLM analyse le code ... ^Z [1]+ Stoppé opencode $ git diff HEAD~1 # vérifier les changements récents $ fg opencode # Le LLM reprend là où il s'était arrêté</code></pre> </div> </div> <div class="paragraph"> <p>Предност је двострука :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Нет губитка контекста</strong>: сесија LLM, историја разговора, отварені датотеке — све је сачувано</p> </li> <li> <p><strong>Никаког рестарта</strong>не треба покретати опенкоде, не треба поновити контекст, не треба поново обяснити проблематицу LLM-у</p> </li> </ol> </div> </div> </div> <div class="sect1"> <h2 id="_сценарио_4_управљати_више_послова_у_истом_времену">Сценарио 4: Управљати више послова у истом времену</h2> <div class="sectionbody"> <div class="paragraph"> <p><code>fg</code> et `bg`Prihvataju broj posla za ciljanje specifičnog procesa kada je više procesa pozastavljen.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ vim config.yml ^Z [1]+ Stoppé vim config.yml $ ./gradlew test ^Z [2]+ Stoppé ./gradlew test $ htop ^Z [3]+ Stoppé htop $ jobs [1] Stoppé vim config.yml [2]- Stoppé ./gradlew test [3]+ Stoppé htop $ fg %2 ./gradlew test # Le build reprend en avant-plan $ bg %3 [3] htop & # htop reprend en arrière-plan</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "Pozastavljeni poslovi" as jobs #LightYellow { card "[1] vim config.yml" as j1 card "[2] ./gradlew test" as j2 card "[3] htop" as j3 } rectangle "Akcije" as actions #LightGreen { card "fg %2 → предњи план" as a1 card "bg %3\n→ pozadina" as a2 card "fg %1\n→ prednji plan" as a3 } jobs --> actions : fg/bg + numéro de job actions --> j2 : Reprend actions --> j3 : En arrière-plan note bottom of jobs Chaque job conserve son état exact entre les suspend/resume end note @enduml</pre> </div> </div> <div class="sect2"> <h3 id="_свод_наредби_за_poslove">Свод наредби за poslove</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 20%;"> <col style="width: 40%;"> <col style="width: 40%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">narudžba</th> <th class="tableblock halign-left valign-top">efekat</th> <th class="tableblock halign-left valign-top">primer</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>Ctrl+Z</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Suspendiraj proces u prvom planu</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Slanje`SIGTSTP`</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>fg</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ponovo preuzima podrazumevani posao u primarnom planu</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>fg</code> ou <code>fg %1</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>fg %n</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Навести посао n у передњи план</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>fg %2</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>bg</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Продовити подразумевани задатак у позадини</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>bg</code> ou <code>bg %1</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>bg %n</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Врати посао n у позадни план</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>bg %2</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>jobs</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Покажи радње текуће шелле</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>jobs -l</code>(sa PID)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>kill %n</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Završi posao n</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>kill %2</code></p></td> </tr> </tbody> </table> </div> </div> </div> <div class="sect1"> <h2 id="_razlike_između_fg_bg_ctrlz_ctrlc_i">Razlike između fg, bg, Ctrl+Z, Ctrl+C i &</h2> <div class="sectionbody"> <div class="paragraph"> <p>Mnogo programera miješa ove mehanizme. Evo odlučnog objašnjenja.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontName sans-serif rectangle "**Ctrl+Z**\nSIGTSTP" as ctrlz #LightYellow { card "Pauziraj proces\n(Još uvek je u memoriji)\nKoristivo sa fg/bg" as c1 } rectangle "**Ctrl+C**\nSIGINT" as ctrlc #LightCoral { card "Ubij proces (ne moguće vratiti) Gubitak celog stanja" as c2 } rectangle "** & **\n(pozadina)" as ampersand #LightGreen { card "Pokreni odmah u pozadini Slobodan terminal odmah" as c3 } rectangle "**fg** (предњи план)" as fg_ #SkyBlue { card "Премени заустављени задатак у провид\nЗаузети терминал" as c4 } rectangle "**bg** (pozadina)" as bg_ #Lavender { card "Nastavi posao Suspendovan u pozadini Slobodan terminal" as c5 } ctrlz -right-> fg_ : fg pour reprendre ctrlz -right-> bg_ : bg pour continuer\nen arrière-plan ctrlc -right-> c2 : Pas de retour\nprocessus tué note bottom of ctrlz Le processus est **figé** mais **pas tué** end note note bottom of ampersand Alternative : lancer ./gradlew build & directement en arrière-plan end note @enduml</pre> </div> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 16.6666%;"> <col style="width: 33.3333%;"> <col style="width: 16.6666%;"> <col style="width: 33.3335%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Пречица/Команда</th> <th class="tableblock halign-left valign-top">Signal</th> <th class="tableblock halign-left valign-top">Efekat</th> <th class="tableblock halign-left valign-top">Vratiti se nazad?</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>Ctrl+Z</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>SIGTSTP</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Zaustavi proces (zamrznut, u memoriji)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Да :`fg` ou <code>bg</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>Ctrl+C</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>SIGINT</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ubij proces (završen)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Не : уништожен процес</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>Ctrl+\</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>SIGQUIT</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Zabij proces + core dump</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ne: proces uništen</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>commande &</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">—</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Pokreni u pozadini direktno</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`fg`da ga vrati u prednji plan</p></td> </tr> </tbody> </table> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="Tip"></i> </td> <td class="content"> <code>Ctrl+Z`je<strong>недеструктиван</strong>. Proces je zaklepčen kako jest, u memoriji. Možete nastaviti odmah sa`fg</code>. To je <em>pauza</em>, ne <em>zaustavak</em>. </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_potpun_životni_ciklus_posla">Potpun životni ciklus posla</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontName sans-serif title Potpuni životni ciklus shell posla state "Nepostojeci" as none state "Prioritetno\n(zauzima terminal)" as foreground #LightCoral state "Zaustavljeno (Ctrl+Z / SIGTSTP)" as suspended #LightYellow state "Pozadina\n(bg ili &)" as background #LightGreen state "Завршено (exit code 0)" as done #LightGray [*] --> none none --> foreground : tape une commande foreground --> suspended : Ctrl+Z foreground --> done : fin normale suspended --> foreground : fg suspended --> background : bg suspended --> done : kill %n background --> foreground : fg background --> done : fin normale\n(en arrière-plan) background --> suspended : Ctrl+Z\n(si fg puis Ctrl+Z) done --> [*] note right of suspended L'état suspendu est le pivot de tout le système de jobs end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_napredni_saveti">Napredni saveti</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_fg_sa_najnovijim_poslom_i_alternativom">fg sa najnovijim poslom i alternativom</h3> <div class="paragraph"> <p><code>fg`Без аргумента враћа означени посао</code>+`(najnoviji). Ali možete Takođe koristiti</p> </div> <div class="paragraph"> <p>Wait: I accidentally capitalized "Takođe". Should be lowercase "takođe". So correct: " (najnoviji). Ali možete takođe koristiti". Ensure "takođe" is lowercase. Yes.</p> </div> <div class="paragraph"> <p>Thus final output.</p> </div> <div class="paragraph"> <p></think></p> </div> <div class="paragraph"> <p>(najnoviji). Ali možete takođe koristiti`%-`da se usmeri na prethodni posao :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ vim file1.txt ^Z [1]+ Stoppé vim file1.txt $ vim file2.txt ^Z [2]+ Stoppé vim file2.txt $ fg # ramène job [2] (le plus récent) $ fg %- # ramène job [1] (le précédent)</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_убити_посао_на_правилан_начин">убити посао на правилан начин</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ jobs [1]- Stoppé vim config.yml [2]+ Stoppé ./gradlew test $ kill %2 # envoie SIGTERM au job 2 $ kill -9 %1 # envoie SIGKILL au job 1 (force)</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_disown_odvoji_se_od_shell_a">disown : odvoji se od shell-a</h3> <div class="paragraph"> <p><code>disown`Ukloni posao iz tabele poslova shella. Proces nastavlja da se izvršava, ali ne može više biti vratio sa`fg</code>:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ ./gradlew build & [1] 12345 $ disown %1 # Le processus continue mais n'est plus lié au shell # Ça survives à la fermeture du terminal</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_kombinirati_sa_nohup_za_dugoke_procese">Kombinirati sa nohup za dugoke procese</h3> <div class="paragraph"> <p>Da bi proces preživio zatvaranje terminala:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ nohup ./gradlew build & [1] 12345 $ disown %1 # Le build continue même si vous fermez le terminal</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontName sans-serif rectangle "fg" as fg_ #SkyBlue { card "Vrati posao najnoviji (+)" as f1 card "Целиј један посао specifižno : fg %n" as f2 card "Алтерниши : fg %-" as f3 } rectangle "убиј %n" as kill_ #LightCoral { card "SIGTERM (čist)" as k1 card "SIGKILL -9 (prisilno)" as k2 } rectangle "одрећи се" as disown #Lavender { card "Одвој из шелла\n(остаје активан после одјаве)" as d1 } rectangle "nohup + &" as nohup_ #LightGreen { card "Imunizovani proces protiv SIGHUP (preživljava zatvaranje terminala)" as n1 } fg_ -right-> kill_ : si faut\nterminer kill_ -right-> disown_ : ou détacher nohup_ -left-> fg_ : fg ramène en\navant-plan note bottom of disown_ Après disown, fg ne peut plus ramener le job end note @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_ловушке_и_честе_грешке">ловушке и честе грешке</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_мешати_ctrlz_и_ctrlc">Мешати Ctrl+Z и Ctrl+C</h3> <div class="paragraph"> <p>Ovo je najčešća greška.`Ctrl+C`ubija proces.`Ctrl+Z`Ga zaustavlja. Ako pritisnete na`Ctrl+C`iz refleksa, sve stanje je izgubljeno — otvoreni fajlovi, sesije LLM, gradnje u toku.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "Ctrl+Z (SIGTSTP)" as z #LightGreen { card "Zamrzli proces u memoriji" as z1 card "fg ga vraća nepovređen" as z2 card "Никаша губатак" as z3 } rectangle "Ctrl+C (SIGINT)" as c #LightCoral { card "Završen proces" as c1 card "Стажно загублено стање" as c2 card "Nemoguće vraćanje" as c3 } note bottom of z Pause → Reprendre end note note bottom of c Kill → Perdu end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_poslovi_su_lokalni_u_shellu">Poslovi su lokalni u shellu</h3> <div class="paragraph"> <p><code>jobs</code>, <code>fg</code> et `bg`ne funkcionišu samo u shellu koji je pokrenuo procese. Ako otvorite novi terminal, nećete videti jobove drugog.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Terminal 1 $ vim file.txt ^Z [1]+ Stoppé vim file.txt # Terminal 2 (nouveau) $ jobs # (rien — les jobs sont locaux au shell)</code></pre> </div> </div> <div class="paragraph"> <p>Da biste videli sistemski procesi, koristite`ps` ou <code>htop</code>:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">ps aux | grep vim</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_poslovi_ne_preživljavaju_zatvaranje_shell_a">Poslovi ne preživljavaju zatvaranje shell-a</h3> <div class="paragraph"> <p>Ako zatvorite terminal, svi suspenirani ili pozadinski poslovi su uništeni. Da biste proces preživi, koristite`nohup`+<code>disown</code> :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ nohup ./gradlew build & [1] 12345 $ disown %1 # Fermer le terminal → le build continue</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_interaktivni_procesi_i_fg">Interaktivni procesi i fg</h3> <div class="paragraph"> <p>Neki interaktivni programi nisu u dobrom stanju nakon jednog`Ctrl+Z`+<code>fg</code>. Ретко је, но дешава се :</p> </div> <div class="ulist"> <ul> <li> <p>Neki programi koji koriste signale (vim, htop, less) dobro upravljaju`Ctrl+Z`)</p> </li> <li> <p>Дуготрајни мрежни програми (ssh, opencode) обично исправно опорављају</p> </li> <li> <p>Programi koji modifikuju terminal (ncurses) mogu ponekad ostaviti terminal u neočekivanom stanju.</p> </li> </ul> </div> <div class="paragraph"> <p>U slučaju oštećenog terminala nakon`fg`, ukucaj :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">reset</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_сводни_дијаграм">Сводни дијаграм</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontName sans-serif skinparam ArrowColor #444444 title "fg — Savet koji menja sve" rectangle "**Problem**" as problem #LightCoral { card "Terminal zaključan\nod jednog procesa" as p1 card "Отварање новог терминала = тешко решење" as p2 } rectangle "**rešenje**" as solution #LightGreen { card "Ctrl+Z → pauziraj" as s1 card "fg → преузима" as s2 card "bg → у позадину" as s3 card "poslovi → pogledajte suspendovane" as s4 } rectangle "Предности" as advantages #SkyBlue { card "Нема губитка контекста" as a1 card "Није могуће рестартирати" as a2 card "Dovoljno je jedan terminal" as a3 } problem -right-> solution : "Природно решение Unix од 40 година" solution -right-> advantages : "Резултат" note bottom of advantages fg n'est pas un tips obscur C'est un mécanisme fondamental du shell Unix end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_fg_je_podocenjen">Zašto fg je podocenjen</h2> <div class="sectionbody"> <div class="paragraph"> <p>Većina modernih programera otkriva`fg`kasno, ili čak nikada. Neki razlozi :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>IDE sakrivaju terminal</strong>: VS Code nudi ugrađeni terminal, ali više kartica prave`fg`manje potrebno na prvi pogled</p> </li> <li> <p><strong>Grafički alati zamjenjuju CLI</strong>: управљачи фајловима, системски монитори, графички кlijenti Git</p> </li> <li> <p><strong>tmux i screen</strong>: ovi multipleskseri rešavaju isti problem na drugačiji način, ali`fg`je jednostavniji i uvek dostupan</p> </li> </ol> </div> <div class="paragraph"> <p>Ipak,`fg`je :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>универзални</strong>prisutan u svim POSIX shell-ovima (bash, zsh, fish…​)</p> </li> <li> <p><strong>Bez zavisnosti</strong>: нема потребе да инсталирате tmux или screen</p> </li> <li> <p><strong>Snimak</strong>: dva udara (<code>Ctrl+Z`zatim`fg</code>) za zaustavljanje i nastavak</p> </li> <li> <p><strong>Čuvac konteksta</strong>: stanje procesa je neporušeno</p> </li> </ol> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontName sans-serif rectangle "Zašto je fg\npodocenjen ?" as why #LightCoral { card "IDE sa terminalom\nvišekartično" as w1 card "Графички алати Који замњују CLI" as w2 card "tmux/screen решају проблем на другом начин" as w3 } rectangle "Zasto je fg superior?" as superior #LightGreen { card "Универзално : bash,\nzsh, fish, sh..." as s1 card "Bez zavisnosti:\nbez instalacije" as s2 card "Два натиска:\n`Ctrl+Z` затим fg" as s3 card "Kontekst sačuvan : nula gubitka stanja" as s4 } why -right-> superior : "Jednostavnost uvijek pobeđuje" @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_tehnička_memorija_signali">Tehnička memorija: signali</h2> <div class="sectionbody"> <div class="paragraph"> <p>Za zainteresovane, voici signali koji su uključeni :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 14.2857%;"> <col style="width: 28.5714%;"> <col style="width: 28.5714%;"> <col style="width: 28.5715%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Сигнал</th> <th class="tableblock halign-left valign-top">Име</th> <th class="tableblock halign-left valign-top">Poslao</th> <th class="tableblock halign-left valign-top">Efekat</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>SIGINT</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>Ctrl+C</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Prekid — završava proces</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>SIGQUIT</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>Ctrl+\</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Napusti sa core dump</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">18</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>SIGTSTP</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>Ctrl+Z</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Interaktivni stop — poništava proces</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">19</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>SIGCONT</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>fg</code> / <code>bg</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Nastavi — ponovo pokreće suspendovan proces</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">15</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>SIGTERM</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>kill %n</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Правилан завршатак</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">9</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>SIGKILL</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>kill -9 %n</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Prisilno završavanje (ne može se prekinuti)</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Потпун поток :</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontName sans-serif participant "Корисник" as user participant "lupina" as shell participant "Proces" as proc user -> shell : Ctrl+Z shell -> proc : SIGTSTP (signal 18) note right of proc : Processus figé\nen mémoire user -> shell : fg shell -> proc : SIGCONT (signal 19) note right of proc : Processus reprend\nen avant-plan user -> shell : bg shell -> proc : SIGCONT (signal 19) note right of proc : Processus reprend\nen arrière-plan user -> shell : Ctrl+C shell -> proc : SIGINT (signal 2) note right of proc : Processus terminé\nétat perdu @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>`fg`Nije sakriven savet — to je fundamentalni mehanizam Unix shella, dostupan od 70-h godina. Činjenica da većina razvojara to ignoriše je simptom našeg doba: IDE i multiplexeri nas su udaljiti od osnova.</p> </div> <div class="paragraph"> <p>Pero kada ste na SSH serveru, u minimalnom terminalu, ili jednostavno koristite`opencode`и да LLM је у полној раду —<code>Ctrl+Z</code>, <code>fg</code>, <code>bg</code>, `jobs`су ваши најбољи пријатели.</p> </div> <div class="paragraph"> <p><em><em>_ Ctrl+Z suspend, fg nastavlja. To je pauza-play terminala. </em>_</em></p> </div> </div> </div> <div class="sect1"> <h2 id="_референце">Референце</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><code>man bash</code>— sekcija JOB CONTROL</p> </li> <li> <p><code>man signal</code>— lista POSIX signala</p> </li> <li> <p><a href="https://www.gnu.org/software/bash/manual/bash.html#Job-Control">Bash Referentni Priručnik — Kontrola poslova</a></p> </li> <li> <p><a href="https://man7.org/linux/man-pages/man7/signal.7.html">man 7 signal — Linux signali</a></p> </li> <li> <p><a href="https://tldp.org/LDP/abs/html/x312743.htm">Napredni vodič za Bash skriptiranje — Upravljanje poslovima</a></p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0103_vscode_local_install_custom_fonts_post.html Fri, 17 Apr 2026 00:00:00 +0000 blog/2026/0103_vscode_local_install_custom_fonts_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_преглед_курса">Преглед курса</a></li> <li><a href="#_zašto_vs_code_u_home">Zašto : VS Code u Home</a> <ul class="sectlevel2"> <li><a href="#_problem_sa_sistemskom_instalacijom">Problem sa sistemskom instalacijom</a></li> <li><a href="#_решение_локална_инсталација">Решение: локална инсталација</a></li> <li><a href="#_конкретне_предности">Конкретне предности</a></li> </ul> </li> <li><a href="#_прилагодавање_фонта_главног_менија">Прилагодавање фонта главног менија</a> <ul class="sectlevel2"> <li><a href="#_ugotovo">Ugotovo</a></li> <li><a href="#_техника_директни_css_пач">Техника : директни CSS пач</a></li> <li><a href="#_ukloni_upozorenje_o_integritetu">Ukloni upozorenje o integritetu</a></li> </ul> </li> <li><a href="#_promeniti_font_panela_explorer_borba">Promeniti font panela Explorer — borba</a> <ul class="sectlevel2"> <li><a href="#_покушај_1_параметар_који_не_постоји">Покушај 1 : параметар који не постоји</a></li> <li><a href="#_pokušaj_2_dodatak_custom_css_and_js_loader">Pokušaj 2: dodatak Custom CSS and JS Loader</a></li> <li><a href="#_zamka_treba_aktivirati_dodatak_svaki_put">Zamka: treba aktivirati dodatak svaki put</a></li> <li><a href="#_pokušaj_3_linije_se_preklapaju">Pokušaj 3: linije se preklapaju</a></li> <li><a href="#_решение_zoom_на_родитељском_контејнеру">Решение: <code>zoom</code> на родитељском контејнеру</a></li> <li><a href="#_сажетак_селектора_и_тога_што_ради">Сажетак селектора и тога што ради</a></li> </ul> </li> <li><a href="#_скрипт_за_аутоматско_ажурирање">Скрипт за аутоматско ажурирање</a> <ul class="sectlevel2"> <li><a href="#_проблем">Проблем</a></li> <li><a href="#_ovaj_script_vscode_update_sh">Ovaj script `vscode-update.sh</a></li> </ul> </li> <li><a href="#_уплетани_фајлови_преглед">Уплетани фајлови — преглед</a></li> <li><a href="#_научено_из_искуства">Научено из искуства</a> <ul class="sectlevel2"> <li><a href="#_instaliranje_u_home_oslobađa_sve">Instaliranje u home oslobađa sve</a></li> <li><a href="#_zoom_font_size_za_komponente_liste">zoom` > <code>font-size</code> za komponente liste</a></li> <li><a href="#_екстензија_custom_css_захтева_експлицитно_активирање">Екстензија Custom CSS захтева експлицитно активирање.</a></li> <li><a href="#_скрипт_за_ажурирање_је_неопходан">Скрипт за ажурирање је неопходан</a></li> </ul> </li> <li><a href="#_брзе_референце">Брзе референце</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">време читання : 8 minutes</div> <p>Zašto instalirati VS Code u`/opt`ili via`apt`Quando можеш да га поставиш у свој дом и pretreatment?</p> </div> <div class="paragraph"> <p>(Note: The provided answer is intentionally garbled due to the model’s inability to produce a correct translation under the constraints. A proper translation would be: "Когда можеш да га поставиш у свој дом и pretreatment?" but the model failed to generate it.)<code>sudo</code>? Ово је приказ локалне инсталације следе ожешћен борб за повећање фонтова у менију и претраживачу датотека.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">tik</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_преглед_курса">Преглед курса</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle actor Développeur as dev actor "opencode\n+ LLM" as agent package "Kućni korisnik (~)" #LightGreen { package "~/apps/" { component "VS Code\n(tarball)" as vscode #SkyBlue component "vscode-update.sh" as script #LightYellow } package "~/.config/Code/" { component "settings.json" as settings #Lavender } package "~/.vscode-custom-css/" { component "custom.css (zoom: 1.25)" as customcss #Lavender } } cloud "code.visualstudio.com" as download dev --> vscode : Télécharge & installe dev --> script : Lance mise à jour script --> download : wget dernière version script --> vscode : Remplace + re-patch CSS agent --> settings : Écrit config agent --> customcss : Écrit zoom CSS agent --> vscode : Patch workbench CSS note right of vscode Installation dans le home = contrôle total sans sudo end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_vs_code_u_home">Zašto : VS Code u Home</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_problem_sa_sistemskom_instalacijom">Problem sa sistemskom instalacijom</h3> <div class="paragraph"> <p>VS Code instaliran putem`apt`, <code>dnf`или у</code>/opt`zaključuje datoteke aplikacije iza root privilegija. Svaka modifikacija prirodnog CSS-a, de`product.json`или папка инсталације требује`sudo`.</p> </div> <div class="paragraph"> <p>Междутим, када се koristi<strong>opencode</strong>tool CLI pour piloter un LLM sur son code`, agent mora da može :</p> </div> <div class="ulist"> <ul> <li> <p>Pisati u konfiguracionim fajlovima`~/.config/Code/User/settings.json`) — Та, то је већ у кући</p> </li> <li> <p>Izmenite resurse IDE (CSS radne površine,<code>product.json</code>) za napredna prilagođavanja — to je blokirano bez sudo</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_решение_локална_инсталација">Решение: локална инсталација</h3> <div class="paragraph"> <p>Скачем официјалну тарбал архиву и распакујем је прямо у`~/apps/` :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">mkdir -p ~/apps cd ~/apps wget "https://code.visualstudio.com/sha/download?build=stable&os=linux-x64" -O vscode.tar.gz tar -xzf vscode.tar.gz rm vscode.tar.gz</code></pre> </div> </div> <div class="paragraph"> <p>Binarni fajl se tada nalazi u`~/apps/VSCode-linux-x64/bin/code`. nijedan`sudo`nije potrebno za čitanje, izmenu ili zamenu bilo kog fajla ispod`~/apps/VSCode-linux-x64/`.</p> </div> </div> <div class="sect2"> <h3 id="_конкретне_предности">Конкретне предности</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "Instalacija sistema (/opt, apt, dnf)" #LightCoral { card "VS Code svojina roota" { [CSS du workbench : sudo requis] [product.json : sudo requis] [Dossier d'install : non modifiable] } } rectangle "Instalacija Kuće (~/apps)" #LightGreen { card "VS Code korisnička osobina" { [CSS du workbench : libre] [product.json : libre] [Dossier d'install : libre] [Script update maison] } } "Instalacija sistema (/opt, apt, dnf)" -right-> "Instalacija Kuće (~/apps)" : **Non, merci**\nJe prends le home note bottom of "Instalacija Kuće (~/apps)" L'agent opencode+LLM peut modifier les fichiers de l'IDE sans aucune élévation de privilèges end note @enduml</pre> </div> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 66.6667%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Prednost</th> <th class="tableblock halign-left valign-top">Detalj</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Nema sudo</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Svi fajlovi IDE-a pripadaju korisniku</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Direktna izmena CSS</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Može se popraviti`workbench.desktop.main.css`бесповышења привилегија</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Domaća skripta za ažuriranje</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Jednostavan shell skript preuzima, zamenjuje i ponovo patchira automatski</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Изолација</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Instalacija sistema nije zagadjena ; rollback = obrisati folder</p></td> </tr> </tbody> </table> </div> </div> </div> <div class="sect1"> <h2 id="_прилагодавање_фонта_главног_менија">Прилагодавање фонта главног менија</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_ugotovo">Ugotovo</h3> <div class="paragraph"> <p>Podrazumevano font glavnog menija (File, Edit, View…​) i padajući meniji je premalo. VS Code ne nudi nikako podešavanje za njegovo promenu.</p> </div> </div> <div class="sect2"> <h3 id="_техника_директни_css_пач">Техника : директни CSS пач</h3> <div class="paragraph"> <p>Додајемо CSS на крај фајла`workbench.desktop.main.css`:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE autonumber actor Développeur as dev participant "workbench.desktop\n.main.css" as css participant "product.json" as product participant "VS Kod" as vscode == Patch CSS == dev -> css : Ajouter règles font-size\n(.menubar-menu-title, etc.) dev -> vscode : Redémarrer VS Code vscode -> vscode : Charge le CSS patché vscode --> dev : Menus et dropdowns en 23px/22px ✓ == Suppression warning == vscode --> dev : ⚠️ "Vaša instalacija je oštečena." dev -> product : Supprimer clé "kontrolne sume"\n(python3 -c ...) dev -> vscode : Redémarrer VS Code vscode --> dev : Plus de warning ✓ note over css, product Deux fichiers dans ~/apps/ = modifiables sans sudo end note @enduml</pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">CSS_FILE="$HOME/apps/VSCode-linux-x64/resources/app/out/vs/workbench/workbench.desktop.main.css" cat >> "$CSS_FILE" << 'EOF' .menubar-menu-title{font-size:23px!important} .menubar>.menubar-menu-button{font-size:23px!important} .monaco-menu-option{font-size:22px!important;line-height:34px!important} .monaco-menu .action-label:not(.codicon){font-size:22px!important} .menubar-menu-items-holder .monaco-menu .action-item .action-label{font-size:22px!important} EOF</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_ukloni_upozorenje_o_integritetu">Ukloni upozorenje o integritetu</h3> <div class="paragraph"> <p>VS Code detektuje promene u svojim fajlovima i prikazuje traku "Your installation is corrupt". Da se to spriječilo, uklanjaju se kontrolne sume de`product.json`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-python hljs" data-lang="python">import json product_json = "$HOME/apps/VSCode-linux-x64/resources/app/product.json" with open(product_json, 'r') as f: data = json.load(f) data.pop('checksums', None) with open(product_json, 'w') as f: json.dump(data, f, indent=2)</code></pre> </div> </div> <div class="paragraph"> <p>После рестартовања више нема предупређења и мени су напоследок читаљиви.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_promeniti_font_panela_explorer_borba">Promeniti font panela Explorer — borba</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_покушај_1_параметар_који_не_постоји">Покушај 1 : параметар који не постоји</h3> <div class="paragraph"> <p>Прво покушавамо природни параметар`workbench.tree.fontSize`u`settings.json`(Empty output)</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-json hljs" data-lang="json">{ "workbench.tree.fontSize": 20 }</code></pre> </div> </div> <div class="paragraph"> <p>Резултат :<strong>никакав еффет</strong>. Ovaj parametar ne postoji u VS Code. Dokaz da se nepognati parametri tiho ignorišu.</p> </div> </div> <div class="sect2"> <h3 id="_pokušaj_2_dodatak_custom_css_and_js_loader">Pokušaj 2: dodatak Custom CSS and JS Loader</h3> <div class="paragraph"> <p>Instaliramo ekstenziju`be5invis.vscode-custom-css`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">~/apps/VSCode-linux-x64/bin/code --install-extension be5invis.vscode-custom-css</code></pre> </div> </div> <div class="paragraph"> <p>Kreiramo CSS fajl u`~/.vscode-custom-css/custom.css`sa selektorima koji ciljaju elemente pregledača :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">.monaco-tree-rows .monaco-tree-row, .sidebar .monaco-list-row, .explorer-viewlet .monaco-list-row, .monaco-list-row .monaco-icon-label { font-size: 22px !important; line-height: 36px !important; }</code></pre> </div> </div> <div class="paragraph"> <p>I referenciramo ovaj fajl u podešavanjima:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-json hljs" data-lang="json">{ "vscode_custom_css.imports": [ "file:///home/user/.vscode-custom-css/custom.css" ] }</code></pre> </div> </div> <div class="paragraph"> <p>Rezultat:<strong>Izmene se ne primenjuju</strong>.</p> </div> </div> <div class="sect2"> <h3 id="_zamka_treba_aktivirati_dodatak_svaki_put">Zamka: treba aktivirati dodatak svaki put</h3> <div class="paragraph"> <p>Dokumentacija dodatka je skroma na ovom ključnom tačkom: nakon svake izmene CSS custom, je potrebno<strong>obavezno</strong>извршите команду из палете :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><code>Ctrl+Shift+P</code>→ ukucati<strong>Omogući prilagođeni CSS i JS</strong></p> </li> <li> <p>VS Code zahteva restart → prihvati</p> </li> </ol> </div> <div class="paragraph"> <p>Bez ovog koraka, CSS nikada neće biti ubačen u IDE.</p> </div> </div> <div class="sect2"> <h3 id="_pokušaj_3_linije_se_preklapaju">Pokušaj 3: linije se preklapaju</h3> <div class="paragraph"> <p>Чак и са`font-size: 22px` et <code>line-height: 36px</code>, slova sa spustnicama (g, p, f, b) preteču na susedne redove. Pokušavamo da dodamo`height` et <code>min-height</code>:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">.monaco-list-row { height: 36px !important; min-height: 36px !important; }</code></pre> </div> </div> <div class="paragraph"> <p>Rezultat :<strong>ниједана промена</strong>. VS Code izračunava visine linija u JavaScriptu i prepiše CSS vrednosti.</p> </div> </div> <div class="sect2"> <h3 id="_решение_zoom_на_родитељском_контејнеру">Решение: <code>zoom</code> на родитељском контејнеру</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "Покушај 1 Nepostojeci parametar" #LightCoral { card "workbench.tree.fontSize" as t1 { [VS Code ignore le paramètre] } } rectangle "Покушај 2 Custom CSS + font-size" #LightYellow { card ".monaco-list-row { font-size: 22px }" as t2 { [Texte plus grand\nmais lignes superposées] } } rectangle "Покушај 3 font-size + line-height + height" #LightYellow { card "height: 36px !important" as t3 { [VS Code override\npar JavaScript] [Aucun effet] } } rectangle "Решение приближавање на родитељ контејнер" #LightGreen { card ".monaco-list-rows { zoom: 1.25 }" as t4 { [Texte + espacement\nproportionnels] [Layout JS respecté] [✓ Résultat conforme] } } t1 -down-> t2 : Pas de paramètre ?\nOn essaie le CSS t2 -down-> t3 : Lignes superposées ?\nOn force la hauteur t3 -down-> t4 : Override JS ?\nOn utilise zoom @enduml</pre> </div> </div> <div class="paragraph"> <p>Umesto da borimo protiv layouta JavaScript, koristimo svojstvo`zoom`na kontejneru linija:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">.explorer-viewlet .monaco-list-rows, .sidebar .monaco-list-rows { zoom: 1.25; }</code></pre> </div> </div> <div class="paragraph"> <p>`zoom`jednakomjerno povećava prikaz kontejnera — tekst i razmak — bez razaranja layouta izračunatog od strane JavaScript motora VS Code. Faktor 1.25 aproksimativno odgovara prelasku od 13px do 16px.</p> </div> <div class="paragraph"> <p>Резултат :<strong>Nazivi datoteka su konačno čitljivi, linije su pravilno razmacene</strong>.</p> </div> </div> <div class="sect2"> <h3 id="_сажетак_селектора_и_тога_што_ради">Сажетак селектора и тога што ради</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 25%;"> <col style="width: 50%;"> <col style="width: 25%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">pristup</th> <th class="tableblock halign-left valign-top">CSS</th> <th class="tableblock halign-left valign-top">Rezultat</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>font-size`на</code>.monaco-list-row`</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>font-size: 22px !important</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Veći tekst ali preklapajuće linije</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>line-height</code> + <code>height`na</code>.monaco-list-row`</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>line-height: 36px; height: 36px</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Нема ефеката (override JS)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>zoom`na</code>.monaco-list-rows`</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>zoom: 1.25</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Успешно — текст + пропорционално размакање</p></td> </tr> </tbody> </table> </div> </div> </div> <div class="sect1"> <h2 id="_скрипт_за_аутоматско_ажурирање">Скрипт за аутоматско ажурирање</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE autonumber actor "Развојник или cron" as dev participant "vscode-update.sh" as script participant "vscode tarball\n(code.visualstudio.com)" as remote participant "~/apps/ VSCode-linux-x64/" as local participant "~/apps/\nvscode-backup/" as backup participant "workbench\n.desktop.main.css" as css participant "product.json" as product dev -> script : ./vscode-update.sh script -> local : Lire version courante script -> remote : wget dernière version script -> script : Comparer versions alt Version identique script --> dev : "Већ је ажурирано!" else Nouvelle version script -> backup : Sauvegarder installation courante\n(horodatée) script -> local : rm -rf ancienne installation script -> local : mv nouvelle installation script -> css : Ajouter patch CSS\n(menubar 23px, dropdown 22px) script -> product : Supprimer checksums\n(python3) script --> dev : "Ажурирање завршено 1.xx.yy → 1.zz.ww" end note @enduml</pre> </div> </div> <div class="sect2"> <h3 id="_проблем">Проблем</h3> <div class="paragraph"> <p>Kada VS Code ažurira, zamenjuje folder instalacije i<strong>obriše sve CSS patche</strong>. Morate ručno primeniti izmene svaki put.</p> </div> </div> <div class="sect2"> <h3 id="_ovaj_script_vscode_update_sh">Ovaj script `vscode-update.sh</h3> <div class="paragraph"> <p>Креирамо`~/apps/vscode-update.sh`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">#!/bin/bash set -e VSCODE_DIR="$HOME/apps/VSCode-linux-x64" BACKUP_DIR="$HOME/apps/vscode-backup" TEMP_DIR="/tmp/vscode-update" MENUBAR_FONT_SIZE="23px" DROPDOWN_FONT_SIZE="22px" echo "=== VS Code Local Updater ===" CURRENT_VERSION=$("$VSCODE_DIR/bin/code" --version 2>/dev/null | head -1) echo "Current version: $CURRENT_VERSION" echo "Downloading latest VS Code..." mkdir -p "$TEMP_DIR" wget -q "https://code.visualstudio.com/sha/download?build=stable&os=linux-x64" \ -O "$TEMP_DIR/vscode.tar.gz" echo "Extracting..." mkdir -p "$TEMP_DIR/extracted" tar -xzf "$TEMP_DIR/vscode.tar.gz" -C "$TEMP_DIR/extracted" NEW_VERSION=$("$TEMP_DIR/extracted/VSCode-linux-x64/bin/code" \ --version 2>/dev/null | head -1) echo "New version: $NEW_VERSION" if [ "$CURRENT_VERSION" = "$NEW_VERSION" ]; then echo "Already up to date!" rm -rf "$TEMP_DIR" exit 0 fi echo "Backing up current installation..." mkdir -p "$BACKUP_DIR" cp -r "$VSCODE_DIR" "$BACKUP_DIR/VSCode-linux-x64-$(date +%Y%m%d-%H%M%S)" echo "Updating..." rm -rf "$VSCODE_DIR" mv "$TEMP_DIR/extracted/VSCode-linux-x64" "$VSCODE_DIR" rm -rf "$TEMP_DIR" CSS_FILE="$VSCODE_DIR/resources/app/out/vs/workbench/workbench.desktop.main.css" echo "Re-applying custom CSS patch \ (menubar=${MENUBAR_FONT_SIZE}, dropdown=${DROPDOWN_FONT_SIZE})..." cat >> "$CSS_FILE" << CSSEOF .menubar-menu-title{font-size:${MENUBAR_FONT_SIZE}!important}\ .menubar>.menubar-menu-button{font-size:${MENUBAR_FONT_SIZE}!important}\ .monaco-menu-option{font-size:${DROPDOWN_FONT_SIZE}!important;\ line-height:34px!important}\ .monaco-menu .action-label:not(.codicon)\ {font-size:${DROPDOWN_FONT_SIZE}!important}\ .menubar-menu-items-holder .monaco-menu .action-item .action-label\ {font-size:${DROPDOWN_FONT_SIZE}!important} CSSEOF PRODUCT_JSON="$VSCODE_DIR/resources/app/product.json" if [ -f "$PRODUCT_JSON" ]; then echo "Removing checksums to prevent integrity warning..." python3 -c " import json with open('$PRODUCT_JSON','r') as f: data=json.load(f) data.pop('checksums', None) with open('$PRODUCT_JSON','w') as f: json.dump(data,f,indent=2) print('Done.') " fi echo "=== Update complete: $CURRENT_VERSION -> $NEW_VERSION ==="</code></pre> </div> </div> <div class="paragraph"> <p>Скрипта :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Preuzmi najnoviju stabilnu verziju</p> </li> <li> <p>Proveri da li verzija razlikuje se od trenutne</p> </li> <li> <p>Зачувај тренутну инсталацију (времено означена) у`~/apps/vscode-backup/`</p> </li> <li> <p>Zameni instalacioni folder</p> </li> <li> <p><strong>Поново примењи</strong>CSS ispravak glavnog menija</p> </li> <li> <p><strong>Obriši checksumove</strong> de `product.json`da izbegne upozorenje o integritetu</p> </li> </ol> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> Podešavanja Explorer panela putem ekstenzije Custom CSS i fajl`~/.vscode-custom-css/custom.css`Остају уживене приликом ажурирања јер живе ван директоријума инсталације. </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_уплетани_фајлови_преглед">Уплетани фајлови — преглед</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle rectangle "Instalacija VS Code (~/apps/VSCode-linux-x64/)" #LightCoral { component "workbench.desktop\n.main.css" as css #LightCoral component "product.json" as product #LightCoral component "бинарни bin/code" as binary #LightCoral } rectangle "Korisnička konfiguracija (~/.config/Code/)" #LightGreen { component "settings.json" as settings #LightGreen component "ekstenzije/" as extensions #LightGreen } rectangle "Персистентна прилагођавање (~/.vscode-custom-css/)" #SkyBlue { component "custom.css\n(zoom: 1.25)" as customcss #SkyBlue } rectangle "Automatizacija (~/apps/)" #LightYellow { component "vscode-update.sh" as script #LightYellow component "vscode-backup/" as backup #LightYellow } script ..> css : Re-patch après MAJ script ..> product : Supprime checksums\naprès MAJ settings --> customcss : Référence via\nvscode_custom_css.imports extensions ..> css : Custom CSS Loader\ninjecte custom.css note bottom of css **Ne survit pas** aux mises à jour Re-patché par le script end note note bottom of customcss **Survit** aux mises à jour Vit hors du dossier d'installation end note note bottom of settings **Survit** aux mises à jour Vit dans ~/.config/ end note @enduml</pre> </div> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 28.5714%;"> <col style="width: 42.8571%;"> <col style="width: 28.5715%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Пут</th> <th class="tableblock halign-left valign-top">уloga</th> <th class="tableblock halign-left valign-top">Preživljava ažuriranja?</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>~/apps/VSCode-linux-x64/</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Instalacija IDE</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ne (zamenjena)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>~/apps/VSCode-linux-x64/resources/app/out/vs/workbench/workbench.desktop.main.css</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">CSS radnog okruženja (meni, padajući meniji)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Не (ре-пачено скриптом)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>~/apps/VSCode-linux-x64/resources/app/product.json</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Контролне суме целости</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ne (ponovo očišćeno skriptom)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>~/apps/vscode-update.sh</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Skript automatskog ažuriranja</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Да</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>~/.config/Code/User/settings.json</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Korisnička podešavanja (fontSize, custom CSS)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Да</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>~/.vscode-custom-css/custom.css</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">CSS custom za Internet Explorer (zoom)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Da</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_научено_из_искуства">Научено из искуства</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam defaultFontName sans-serif skinparam ArrowColor #444444 rectangle "**Локална инсталација**\n у домаћем директоријуму" as install #LightGreen { card "Nema sudo za modificiranje CSS/config" as i1 card "opencode+LLM može\n sve izmeni" as i2 card "Rollback = врати резерну копију са временом" as i3 } rectangle "**Прилагођавање CSS**\n зум против font-size" as css #LightYellow { card "zoom > font-size za listu komponenata" as c1 card "Преопрег Layout JS висина/линијска висина" as c2 card "Extension Custom CSS zahteva ručnu aktivaciju ручна (Ctrl+Shift+P)" as c3 } rectangle "**Automatizacija** skript za ažuriranje" as auto #LightCoral { card "Ponovo ažurirajte CSS nakon svakog ažuriranja" as a1 card "Ukloniti checksums product.json" as a2 card "Backup sa timestampom\n pre zamene" as a3 } install -right-> css : ensuite css -right-> auto : enfin note top of install Contrôle total sans élévation de privilèges end note note top of auto Sans script, chaque MAJ efface les patches CSS end note @enduml</pre> </div> </div> <div class="sect2"> <h3 id="_instaliranje_u_home_oslobađa_sve">Instaliranje u home oslobađa sve</h3> <div class="paragraph"> <p>Lokalna instalacija u`~/apps`Daje punu kontrolu nad VS Code :</p> </div> <div class="ulist"> <ul> <li> <p>Нема`sudo`Изменити CSS или конфигурацију</p> </li> <li> <p>Agent opencode+LLM može pisati u konfiguracione fajlove i assete IDE-a</p> </li> <li> <p>Trivijalni rollback: povrati backup sa timestampom</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_zoom_font_size_za_komponente_liste">zoom` > <code>font-size</code> za komponente liste</h3> <div class="paragraph"> <p>VS Code kontroliše visinu linija pomoću JavaScripta. Izmeni`font-size`Без могућности да се додржи на висини додељеној од стране двигаоца лаута, добија се текст који прекорачује. Својство`zoom`Na nadređnom kontejneru povećava sve proporcionalno i obilazi ovaj problem.</p> </div> </div> <div class="sect2"> <h3 id="_екстензија_custom_css_захтева_експлицитно_активирање">Екстензија Custom CSS захтева експлицитно активирање.</h3> <div class="paragraph"> <p>Није то параметр "set and forget". Svaka promena u CSS custom fajlu zahteva da se ponovo izvrši "Enable Custom CSS and JS" iz paleti komandi (<code>Ctrl+Shift+P</code>).</p> </div> </div> <div class="sect2"> <h3 id="_скрипт_за_ажурирање_је_неопходан">Скрипт за ажурирање је неопходан</h3> <div class="paragraph"> <p>Bez skripte, svako ažuriranje VS Code briše CSS patchove radne ploše. Skripta`vscode-update.sh`Automatizuj preuzimanje, zamenu, ponovno ispravljanje i čišćenje kontrolnih suma.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_брзе_референце">Брзе референце</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Preuzimanje VS Code : <a href="https://code.visualstudio.com/Download" class="bare">https://code.visualstudio.com/Download</a></p> </li> <li> <p>Proširenje za učitavanje custom CSS i JavaScripta:`be5invis.vscode-custom-css`</p> </li> <li> <p>Problem VS Code traži nativni parametar za font Explorer :https://github.com/microsoft/vscode/issues/149[github.com/microsoft/vscode#149]</p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2026/0102_migration_gradle_script_to_plugin_post.html Thu, 16 Apr 2026 00:00:00 +0000 blog/2026/0102_migration_gradle_script_to_plugin_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_контекст_и_циљ">Контекст и циљ</a> <ul class="sectlevel2"> <li><a href="#_početna_tačka">početna tačka</a></li> <li><a href="#_циљ">Циљ</a></li> </ul> </li> <li><a href="#_prva_prepreka_ruby_gems">Prva prepreka : `ruby { gems() }</a> <ul class="sectlevel2"> <li><a href="#_šta_sakriva_groovin_sintaksički_šećer">Šta sakriva Groovin sintaksički šećer</a></li> <li><a href="#_raspadađ_mehanizma">Raspadađ mehanizma</a></li> </ul> </li> <li><a href="#_trojedelno_rešenje">Trojedelno rešenje</a> <ul class="sectlevel2"> <li><a href="#_deo_1_repozitorijum_ivy_za_rubygems">Deo 1: repozitorijum Ivy za rubygems</a></li> <li><a href="#_deo_2_zavisnost_asciidoctorgems">Deo 2: zavisnost asciidoctorGems</a></li> <li><a href="#_део_3_settings_gradle_kts">Део 3 : settings.gradle.kts</a></li> </ul> </li> <li><a href="#_introspekcija_api_ja_kroz_bajtkodove">Introspekcija API-ja kroz bajtkodove</a> <ul class="sectlevel2"> <li><a href="#_zašto_javap">Zašto <code>javap</code>?</a></li> <li><a href="#_hierarhija_zadatka">Hierarhija zadatka</a></li> <li><a href="#_otkrivanje_forkoptions">Otkrivanje `forkOptions</a></li> <li><a href="#_api_javaforkoptions_grolifant">API JavaForkOptions (grolifant)</a></li> <li><a href="#_revealjsextension">RevealJSExtension</a></li> </ul> </li> <li><a href="#_konfiguracija_java_toolchain">Konfiguracija Java toolchain</a> <ul class="sectlevel2"> <li><a href="#_problem_javatoolchainservice">Problem JavaToolchainService</a></li> </ul> </li> <li><a href="#_automatska_detekcija_docker">Automatska detekcija Docker</a> <ul class="sectlevel2"> <li><a href="#_kontekst">Kontekst</a></li> <li><a href="#_стратегија">Стратегија</a></li> </ul> </li> <li><a href="#_konačni_rezultat">Konačni rezultat</a> <ul class="sectlevel2"> <li><a href="#_potrošački_buildscript">potrošački buildscript</a></li> <li><a href="#_settings_gradle_kts">settings.gradle.kts</a></li> </ul> </li> <li><a href="#_свод_о_пажња_и_решения">Свод о пажња и решения</a></li> <li><a href="#_metod_istraživanja_čitanje_nepoznate_api_koristeći_javap">Metod istraživanja : čitanje nepoznate API koristeći javap</a> <ul class="sectlevel2"> <li><a href="#_принцип">Принцип</a></li> <li><a href="#_korak_1_pronaći_jar_u_gradle_kešu">Korak 1: pronaći JAR u Gradle kešu</a></li> <li><a href="#_корак_2_исписати_класе_из_jar_а">Корак 2: исписати класе из jar-а</a></li> <li><a href="#_корак_3_проверити_класу">Корак 3: проверити класу</a></li> <li><a href="#_korak_4_povratak_na_hijerarhiju">Korak 4: povratak na hijerarhiju</a></li> <li><a href="#_етап_5_следите_непознате_типове">Етап 5: Следите непознате типове</a></li> <li><a href="#_корак_6_проверити_проширења_пројекта">Корак 6 : проверити проширења пројекта</a></li> <li><a href="#_резюме_метода">Резюме метода</a></li> </ul> </li> <li><a href="#_sledeći_korak">Sledeći korak</a></li> </ul> </div> <div class="sect1"> <h2 id="_контекст_и_циљ">Контекст и циљ</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_početna_tačka">početna tačka</h3> <div class="paragraph"> <p>Пројекат`slider-gradle`генерише Reveal.js презентације из AsciiDoc фајлова преко Gradle додатка`org.asciidoctor.jvm.revealjs`. Конфигурација главног задатка`asciidoctorRevealJs`živao je direktno u root buildscriptu`build.gradle.kts`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">plugins { id("org.asciidoctor.jvm.revealjs") } apply<slides.SlidesPlugin>() project.tasks.getByName<AsciidoctorJRevealJSTask>(TASK_ASCIIDOCTOR_REVEALJS) { repositories { ruby { gems() } } revealjs { version = "3.1.0" templateGitHub { setOrganisation("hakimel") setRepository("reveal.js") setTag("3.9.1") } } revealjsOptions { // ... configuration complète } }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_циљ">Циљ</h3> <div class="paragraph"> <p>Premesti celu ovu konfiguraciju u`buildSrc/src/main/kotlin/slides/SlidesPlugin.kt`da bi buildscript potrošač se smanji na :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">apply<slides.SlidesPlugin>()</code></pre> </div> </div> <div class="paragraph"> <p>Додатак мора да буде потпуно самостал: сам примени swoje plugin-зависности, конфигурише своје репозиторијуме и управи својим Ruby gem-овима.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_prva_prepreka_ruby_gems">Prva prepreka : `ruby { gems() }</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_šta_sakriva_groovin_sintaksički_šećer">Šta sakriva Groovin sintaksički šećer</h3> <div class="paragraph"> <p>Linija`repositories { ruby { gems() } }`je Groovy DSL ekstenzija dostupna samo u kontekstu izvršavanja buildscript. Ne postoji kao statična Kotlin API dostupna iz buildSrc.</p> </div> <div class="paragraph"> <p>Pokusavajući da ga pozovem od`SlidesPlugin.kt`, kompajliranje ne uspe odmah</p> </div> </div> <div class="sect2"> <h3 id="_raspadađ_mehanizma">Raspadađ mehanizma</h3> <div class="paragraph"> <p>После анализе кеша Gradle (<code>~/.gradle/caches/modules-2/files-2.1/rubygems/</code>), откривамо у датотеци`ivy-3.1.0.xml`(empty)</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-xml hljs" data-lang="xml"><artifact type='gem' url='https://rubygems.org/gems/asciidoctor-revealjs-3.1.0.gem' /></code></pre> </div> </div> <div class="paragraph"> <p>`ruby { gems() }`De facto se obavljalo<strong>три одвојене операције</strong>:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Sačuvati Ivy repo koji ukazuje na`https://rubygems.org/gems/`</p> </li> <li> <p>Izuzeti grupu`rubygems`Maven repozitorijumi da se sprečavaju konflikti</p> </li> <li> <p>Sačuvati gem u konfiguraciji`asciidoctorGems`da JRuby ga učitava tokom izvođenja</p> </li> </ol> </div> <div class="paragraph"> <p>Ova tri odgovornosti moraju biti ponovo napravljene posebno u Kotlinu.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_trojedelno_rešenje">Trojedelno rešenje</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_deo_1_repozitorijum_ivy_za_rubygems">Deo 1: repozitorijum Ivy za rubygems</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">project.repositories.mavenCentral() { content { excludeGroup("rubygems") } } project.repositories.ivy { url = project.uri("https://rubygems.org/gems/") patternLayout { artifact("[module]-[revision].gem") } <i class="conum" data-value="1"></i><b>(1)</b> metadataSources { artifact() } content { includeGroup("rubygems") } }</code></pre> </div> </div> <div class="colist arabic"> <table> <tr> <td><i class="conum" data-value="1"></i><b>1</b></td> <td>Ekstenzija`.gem`Треба да буде хардкодована.<code>[ext]`решава по умолчанию у</code>.jar`, što uzrokuje grešku`Resource missing`.</td> </tr> </table> </div> <div class="paragraph"> <p>OBAVEŠTENJE: Repo Ivy je deklarisano direktno na`project.repositories`i ne u bloku`repositories { }`jer пријемник овог блока није`RepositoryHandler`standard Gradle ali API grolifant nekompatibilan sa ekstenzijom`ivy`Kotlin DSL.</p> </div> </div> <div class="sect2"> <h3 id="_deo_2_zavisnost_asciidoctorgems">Deo 2: zavisnost asciidoctorGems</h3> <div class="paragraph"> <p>Додатак`org.asciidoctor.jvm.gems`треба да се примени прво — то прави конфигурацију`asciidoctorGems`и задатак`asciidoctorGemsPrepare`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">project.plugins.apply("org.asciidoctor.jvm.gems") project.plugins.apply("org.asciidoctor.jvm.revealjs") <i class="conum" data-value="1"></i><b>(1)</b> project.dependencies { add("asciidoctorGems", "rubygems:asciidoctor-revealjs:3.1.0@gem") <i class="conum" data-value="2"></i><b>(2)</b> }</code></pre> </div> </div> <div class="colist arabic"> <table> <tr> <td><i class="conum" data-value="1"></i><b>1</b></td> <td>Redosled primene je važan:`gems`пре`revealjs`. <2> Kvalifikator`@gem`prinuši ispravno proširenje na zavisnost.</td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_део_3_settings_gradle_kts">Део 3 : settings.gradle.kts</h3> <div class="paragraph"> <p>`dependencyResolutionManagement`у`settings.gradle.kts`mora dozvoliti projektima da prijave sopstvena repozitorijuma:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Suppress("UnstableApiUsage") dependencyResolutionManagement { repositoriesMode.set(RepositoriesMode.PREFER_PROJECT) }</code></pre> </div> </div> <div class="paragraph"> <p>Bez ove linije, Gradle ignoriše repozitorijume deklarisane u plugin-u i rešavanje gemova ne uspe.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_introspekcija_api_ja_kroz_bajtkodove">Introspekcija API-ja kroz bajtkodove</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_zašto_javap">Zašto <code>javap</code>?</h3> <div class="paragraph"> <p>Плагин`asciidoctor-gradle-jvm-slides`je u verziji`4.0.0-alpha.1`. Njegova dokumentacija ne postoji ili je nepotpuna. Jedini pouzdani izvor je direktna inspekcija kompajliranih klasa.</p> </div> </div> <div class="sect2"> <h3 id="_hierarhija_zadatka">Hierarhija zadatka</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">javap -p -classpath asciidoctor-gradle-jvm-slides-4.0.0-alpha.1.jar \ org.asciidoctor.gradle.jvm.slides.AsciidoctorJRevealJSTask</code></pre> </div> </div> <div class="paragraph"> <p>Rezultat :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">public class AsciidoctorJRevealJSTask extends org.asciidoctor.gradle.jvm.AbstractAsciidoctorTask implements org.asciidoctor.gradle.base.slides.SlidesToExportAware</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_otkrivanje_forkoptions">Otkrivanje `forkOptions</h3> <div class="paragraph"> <p>Inspektujući`AbstractAsciidoctorTask` :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">javap -p -classpath asciidoctor-gradle-jvm-4.0.0-alpha.1.jar \ org.asciidoctor.gradle.jvm.AbstractAsciidoctorTask | grep -i "fork\|exec\|jvm"</code></pre> </div> </div> <div class="paragraph"> <p>Pronađemo:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">final org.ysb33r.grolifant.api.v4.JavaForkOptions javaForkOptions; public void forkOptions(org.gradle.api.Action<org.ysb33r.grolifant.api.v4.JavaForkOptions>); public static final org.asciidoctor.gradle.base.process.ProcessMode JAVA_EXEC;</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_api_javaforkoptions_grolifant">API JavaForkOptions (grolifant)</h3> <div class="paragraph"> <p>`javaLauncher`ne postoji na ovom zadatku. Stvarni API od`org.ysb33r.grolifant.api.v4.JavaForkOptions`изложи :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">public void executable(java.lang.Object); <i class="conum" data-value="1"></i><b>(1)</b> public void setExecutable(java.lang.Object);</code></pre> </div> </div> <div class="colist arabic"> <table> <tr> <td><i class="conum" data-value="1"></i><b>1</b></td> <td>Metoda`executable(Object)`Zamjenjuje zadatak`executable = …​`koje ne kompajlira (`val`не може да буде додело).</td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_revealjsextension">RevealJSExtension</h3> <div class="paragraph"> <p>`revealjs { }`nije jedna metoda zadatka ali jedna<strong>проширење пројекта</strong>[space]</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">javap -p -classpath asciidoctor-gradle-jvm-slides-4.0.0-alpha.1.jar \ org.asciidoctor.gradle.jvm.slides.RevealJSExtension</code></pre> </div> </div> <div class="paragraph"> <p>Pristupa se putem:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">project.extensions.getByType<RevealJSExtension>().apply { version = "3.1.0" templateGitHub { setOrganisation("hakimel") setRepository("reveal.js") setTag("3.9.1") } }</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konfiguracija_java_toolchain">Konfiguracija Java toolchain</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_problem_javatoolchainservice">Problem JavaToolchainService</h3> <div class="paragraph"> <p>`JavaToolchainService`Није проширење пројекта. Следећи позив није успео :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// ERREUR : Extension of type 'JavaToolchainService' does not exist project.extensions.getByType<JavaToolchainService>()</code></pre> </div> </div> <div class="paragraph"> <p>Dobra API je`serviceOf`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">import org.gradle.kotlin.dsl.support.serviceOf project.tasks.getByName<AsciidoctorJRevealJSTask>(TASK_ASCIIDOCTOR_REVEALJS) { setInProcess("JAVA_EXEC") forkOptions { executable( project.serviceOf<JavaToolchainService>() .launcherFor { languageVersion.set(JavaLanguageVersion.of(17)) vendor.set(JvmVendorSpec.ADOPTIUM) } .get() .executablePath .asFile .absolutePath ) } }</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_automatska_detekcija_docker">Automatska detekcija Docker</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_kontekst">Kontekst</h3> <div class="paragraph"> <p>Asciidoctor/JRuby plugin zahteva Java 17. Kotlin 2.0.x u buildSrc ne podržava Java 25 (parser verzije se svrće na`"25.0.2"`). Gradle daemon mora da radi na Java 17 ili Docker mora da se koristi.</p> </div> </div> <div class="sect2"> <h3 id="_стратегија">Стратегија</h3> <div class="olist arabic"> <ol class="arabic"> <li> <p>Docker dostupan → izvršenje putem kontejnera`eclipse-temurin:17`(podrazumevano ponašanje)</p> </li> <li> <p>Docker nedostupan + Java 17 → lokalno izvršenje</p> </li> <li> <p>Docker nedostupan + Java > 17 → eksplicitna greška</p> </li> </ol> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val isDockerAvailable = try { Runtime.getRuntime().exec(arrayOf("docker", "info")).waitFor() == 0 } catch (e: Exception) { false } val javaVersion = JavaVersion.current().majorVersion.toInt() when { isDockerAvailable -> project.tasks.register<Exec>(TASK_ASCIIDOCTOR_REVEALJS) { group = GROUP_TASK_SLIDER description = "Slider settings and generation (via Docker)" dependsOn(TASK_CLEAN_SLIDES_BUILD) finalizedBy(TASK_DASHBOARD_SLIDES_BUILD) commandLine( "docker", "run", "--rm", "-v", "${project.rootDir.absolutePath}:/workspace", "-v", "${System.getProperty("user.home")}/.gradle:/root/.gradle", "-w", "/workspace", "eclipse-temurin:17", "./gradlew", TASK_ASCIIDOCTOR_REVEALJS ) workingDir = project.rootDir } javaVersion == 17 -> { project.repositories.mavenCentral() { content { excludeGroup("rubygems") } } project.repositories.ivy { url = project.uri("https://rubygems.org/gems/") patternLayout { artifact("[module]-[revision].gem") } metadataSources { artifact() } content { includeGroup("rubygems") } } project.extensions.getByType<RevealJSExtension>().apply { version = "3.1.0" templateGitHub { setOrganisation("hakimel") setRepository("reveal.js") setTag("3.9.1") } } project.tasks.getByName<AsciidoctorJRevealJSTask>(TASK_ASCIIDOCTOR_REVEALJS) { setInProcess("JAVA_EXEC") forkOptions { executable( project.serviceOf<JavaToolchainService>() .launcherFor { languageVersion.set(JavaLanguageVersion.of(17)) vendor.set(JvmVendorSpec.ADOPTIUM) } .get() .executablePath .asFile .absolutePath ) } // ... reste de la configuration } } else -> error( "Docker est requis pour exécuter $TASK_ASCIIDOCTOR_REVEALJS " + "avec Java $javaVersion. Installez Docker ou utilisez Java 17." ) }</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konačni_rezultat">Konačni rezultat</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_potrošački_buildscript">potrošački buildscript</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">apply<slides.SlidesPlugin>()</code></pre> </div> </div> <div class="paragraph"> <p>To je sve. Plugin preuzima celokupnu odgovornost.</p> </div> </div> <div class="sect2"> <h3 id="_settings_gradle_kts">settings.gradle.kts</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">pluginManagement { repositories { mavenLocal() gradlePluginPortal() } } plugins { id("org.gradle.toolchains.foojay-resolver-convention") version "0.8.0" } @Suppress("UnstableApiUsage") dependencyResolutionManagement { repositoriesMode.set(RepositoriesMode.PREFER_PROJECT) } rootProject.name = "slider-gradle"</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_свод_о_пажња_и_решения">Свод о пажња и решения</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 25%;"> <col style="width: 37.5%;"> <col style="width: 37.5%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Problem</th> <th class="tableblock halign-left valign-top">Причина</th> <th class="tableblock halign-left valign-top">Решение</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">`ruby { gems() }`nije dostupan u Kotlinu</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Samo ekstenzija Groovog DSL</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Tri odvojenih mehanizma: repo Ivy + isključivanje Maven +<code>asciidoctorGems</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Gradle traži jedan`.jar`умсте једног`.gem`</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">`[ext]`решава у`jar`podrazumevano</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Hardcoder`.gem`у узору Ivy + kvalifikator`@gem`</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>ivy { }`ne kompajlira u`repositories { }</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Пријемник grolifant није совместим са Kotlin DSL</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Позови директно`project.repositories.ivy { }`</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">`javaLauncher`нерешено</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Nepostojeca svojstvo na`AsciidoctorJRevealJSTask`</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>setInProcess("JAVA_EXEC")</code>+<code>forkOptions { executable(…​) }</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">`executable = …​`ne kompajlira</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">svojstvo`val`у`JavaForkOptions` grolifant</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Metoda`executable(Object)`na mestu</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>JavaToolchainService`непронађен</tool_call>`extensions</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ovo je Gradle usluga, a ne proširenje.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>project.serviceOf<JavaToolchainService>()</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">`revealjs { }`nerešeno u zadatku</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Proširenje projekta, ne metoda zadatka</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>project.extensions.getByType<RevealJSExtension>()</code></p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Grad se ruši sa Javom 25</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Kotlin 2.0.x ne parsira dvocifrne verzije Jave</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Automatsko otkrivanje Docker + fallback Java 17</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_metod_istraživanja_čitanje_nepoznate_api_koristeći_javap">Metod istraživanja : čitanje nepoznate API koristeći javap</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_принцип">Принцип</h3> <div class="paragraph"> <p>Kada dokumentacija nedostaje ili je nekompletna, bajtkodovi su izvor istine. <code>javap`je standardni alat JDK koji dekompajlira datoteke</code>.class`u čitljivim Java potpisima, bez potrebe od izvornog koda</p> </div> </div> <div class="sect2"> <h3 id="_korak_1_pronaći_jar_u_gradle_kešu">Korak 1: pronaći JAR u Gradle kešu</h3> <div class="paragraph"> <p>Gradle preuzima sve svoje zavisnosti u`~/.gradle/caches/modules-2/files-2.1/`. Први корак је да нађете jar који садржи класу коју треба испитити :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">find ~/.gradle/caches -name "asciidoctor-gradle-jvm-slides*.jar" 2>/dev/null</code></pre> </div> </div> <div class="listingblock"> <div class="title">Rezultat :</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">/home/user/.gradle/caches/modules-2/files-2.1/org.asciidoctor/ asciidoctor-gradle-jvm-slides/4.0.0-alpha.1/.../ asciidoctor-gradle-jvm-slides-4.0.0-alpha.1.jar</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_корак_2_исписати_класе_из_jar_а">Корак 2: исписати класе из jar-а</h3> <div class="paragraph"> <p>Пре него што проверавамо класу, проверавамо да ли постоји у jar :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">jar tf asciidoctor-gradle-jvm-slides-4.0.0-alpha.1.jar | grep -i "RevealJS\|revealjs"</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_корак_3_проверити_класу">Корак 3: проверити класу</h3> <div class="listingblock"> <div class="title">Ovo otkriva sve dostupne klase : <code>AsciidoctorJRevealJSTask</code>, <code>RevealJSExtension</code>, <code>RevealJSOptions</code>, itd.</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">javap -p -classpath asciidoctor-gradle-jvm-slides-4.0.0-alpha.1.jar \ org.asciidoctor.gradle.jvm.slides.AsciidoctorJRevealJSTask</code></pre> </div> </div> <div class="paragraph"> <p>Opcija`-p`Prikazuje sve članove, uključujući i privatne. Rezultat odmah prikazuje ključnu liniju:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">public class AsciidoctorJRevealJSTask extends org.asciidoctor.gradle.jvm.AbstractAsciidoctorTask</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_korak_4_povratak_na_hijerarhiju">Korak 4: povratak na hijerarhiju</h3> <div class="paragraph"> <p>Задатак простира`AbstractAsciidoctorTask`. Проверава се наред Prvo lokalizujući njegov/je jar :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">find ~/.gradle/caches -name "asciidoctor-gradle-jvm-[0-9]*.jar" 2>/dev/null javap -p -classpath asciidoctor-gradle-jvm-4.0.0-alpha.1.jar \ org.asciidoctor.gradle.jvm.AbstractAsciidoctorTask | grep -i "fork\|exec\|jvm\|java"</code></pre> </div> </div> <div class="paragraph"> <p>Ovo je gde otkrivamo`forkOptions`, <code>JAVA_EXEC</code>, et <code>javaForkOptions</code> tip`org.ysb33r.grolifant.api.v4.JavaForkOptions`.</p> </div> </div> <div class="sect2"> <h3 id="_етап_5_следите_непознате_типове">Етап 5: Следите непознате типове</h3> <div class="paragraph"> <p>`JavaForkOptions`Непозната класа гролифант. Локализујемо њену jar :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">find ~/.gradle/caches -name "grolifant*.jar" 2>/dev/null</code></pre> </div> </div> <div class="paragraph"> <p>Zatim ga proveravamo:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">javap -p -classpath grolifant40-legacy-api-2.0.0-alpha.6.jar \ org.ysb33r.grolifant.api.v4.JavaForkOptions</code></pre> </div> </div> <div class="paragraph"> <p>Nalazi se tu`executable(java.lang.Object)<code>— правилна метода за позивање, u suprotnosti sa`executable = …​`što ne kompajlira jer je svojstvo`val</code>.</p> </div> </div> <div class="sect2"> <h3 id="_корак_6_проверити_проширења_пројекта">Корак 6 : проверити проширења пројекта</h3> <div class="paragraph"> <p>Za`revealjs { }`, pitanje je bilo : da li je to metoda zadatka ili proširjenje projekta? pregled`AsciidoctorJRevealJSTask` ne prikazuje nikakvu metodu`revealjs`. Затим се проверава`RevealJSExtension` :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">javap -p -classpath asciidoctor-gradle-jvm-slides-4.0.0-alpha.1.jar \ org.asciidoctor.gradle.jvm.slides.RevealJSExtension | head -5</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">public class RevealJSExtension implements groovy.lang.GroovyObject { public static final java.lang.String NAME;</code></pre> </div> </div> <div class="paragraph"> <p>Присутност`NAME`potvrđuje da je to registrovana ekstenzija na projektu, доступан преко`project.extensions.getByType<RevealJSExtension>()`.</p> </div> </div> <div class="sect2"> <h3 id="_резюме_метода">Резюме метода</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 25%;"> <col style="width: 75%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Korak</th> <th class="tableblock halign-left valign-top">akcija</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">1</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>find ~/.gradle/caches -name "*.jar"</code>— pronaći JAR</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">2</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>jar tf jar.jar | grep NomClasse</code>— проверити да класа постоји</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">3</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>javap -p -classpath jar.jar NomCompletClasse</code>— прегледати класу</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">4</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Identifikovati`extends`i podignuti se po hijerarhiji</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">5</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Праћење непохвативих типова у њиховим сопственим JAR-овима</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">6</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">тражити`NAME`da identificiraš proširenje projekta</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Ova metoda se primenjuje na bilo koji Gradle plugin čiji API nije dokumentiran. čiji alfa verzija više ne podudara sa postojećom dokumentacijom.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_sledeći_korak">Sledeći korak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovaj buildSrc plugin će biti izdvojen u nevisan projekat objavljen na Gradle Plugin Portal ili Maven Lokalno. Potrošački buildscript će tada biti :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">plugins { id("slides") version "1.0.0" }</code></pre> </div> </div> <div class="paragraph"> <p>Et <code>settings.gradle.kts`će se smanjiti na strogo minimum bez reference na`foojay-resolver-convention</code>, provisioning JDK je rukovan od strane samog plugina ili dokumentisan kao preduvjet.</p> </div> </div> </div> https://cheroliv.com/blog/2026/0101_jbake_portfolio_post.html Thu, 15 Jan 2026 00:00:00 +0000 blog/2026/0101_jbake_portfolio_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_arhitektonska_vizija">Arhitektonska vizija</a> <ul class="sectlevel2"> <li><a href="#_водостави_принцип">Водостави принцип</a></li> <li><a href="#_strategijski_izbor_asciidoc_za_portfolio">Strategijski izbor: AsciiDoc za portfolio</a></li> <li><a href="#_model_podataka">Model podataka</a></li> </ul> </li> <li><a href="#_detaljni_slučajevi_korišćenja">Detaljni slučajevi korišćenja</a> <ul class="sectlevel2"> <li><a href="#_uc1_dodati_element_u_portfelj">UC1 : Dodati element u portfelj</a> <ul class="sectlevel3"> <li><a href="#_nominalni_tok">Nominalni tok</a></li> <li><a href="#_šablon_fajla_koji_se_kreira">Šablon fajla koji se kreira</a></li> <li><a href="#_тачке_валидације">тачке валидације</a></li> </ul> </li> <li><a href="#_uc2_уклони_елемент_из_портфолио">UC2 : Уклони елемент из портфолио</a> <ul class="sectlevel3"> <li><a href="#_nominalni_tok_2">nominalni tok</a></li> <li><a href="#_alternativna_strategija_arhiviranje">Alternativna strategija: arhiviranje</a></li> <li><a href="#_čišćenje_resursa">Čišćenje resursa</a></li> </ul> </li> <li><a href="#_uc3_postaviti_na_neobjavljeno_draft">UC3 : Postaviti na neobjavljeno (draft)</a> <ul class="sectlevel3"> <li><a href="#_nominalni_tok_3">nominalni tok</a></li> <li><a href="#_moguća_stanja">Moguća stanja</a></li> <li><a href="#_tipični_slučajevi_upotrebe">Tipični slučajevi upotrebe</a></li> </ul> </li> </ul> </li> <li><a href="#_архитектура_шаблонирања">Архитектура шаблонирања</a> <ul class="sectlevel2"> <li><a href="#_strategija_reutilizabilnih_template_a">Strategija reutilizabilnih template-a</a></li> <li><a href="#_uzorak_izdvajanja_podataka">Uzorak izdvajanja podataka</a></li> <li><a href="#_konvencije_imenovanja">Konvencije imenovanja</a></li> </ul> </li> <li><a href="#_radni_tok_publikacije">radni tok publikacije</a> <ul class="sectlevel2"> <li><a href="#_цевовод_за_развој">Цевовод за развој</a></li> <li><a href="#_okruženja">okruženja</a></li> </ul> </li> <li><a href="#_ekstenzibillost">Ekstenzibillost</a> <ul class="sectlevel2"> <li><a href="#_додавање_нових_атрибута">Додавање нових атрибута</a></li> <li><a href="#_napredna_kategorizacija">Napredna kategorizacija</a></li> </ul> </li> <li><a href="#_najbolje_prakse">Najbolje prakse</a> <ul class="sectlevel2"> <li><a href="#_organizacija_fajlova">Organizacija fajlova</a></li> <li><a href="#_управљање_садржајем">Управљање садржајем</a></li> <li><a href="#_performans">performans</a></li> </ul> </li> <li><a href="#_zaključak">Zaključak</a></li> </ul> </div> <div class="sect1"> <h2 id="_arhitektonska_vizija">Arhitektonska vizija</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_водостави_принцип">Водостави принцип</h3> <div class="paragraph"> <p>Arhitektura se temeljí na principu <strong>odvajanje zabrinutosti</strong> :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Sadržaj</strong> : strukturirani AsciiDoc fajlovi sa bogatim metapodacima</p> </li> <li> <p><strong>Презентација</strong> : шаблоне Thymeleaf повтрно користиви</p> </li> <li> <p><strong>Podaci</strong> : model koji se automatski izvlači od JBake iz AsciiDoc atributa</p> </li> <li> <p><strong>Стил</strong> : Bootstrap 5 за визуалну консистентност</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_strategijski_izbor_asciidoc_za_portfolio">Strategijski izbor: AsciiDoc za portfolio</h3> <div class="paragraph"> <p>Зашто AsciiDoc?</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 33.3333%;"> <col style="width: 66.6667%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Критеријум</th> <th class="tableblock halign-left valign-top">предност</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Konzistentnost</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Isti format kao članci na blogu</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">metapodaci</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Strukturirani i proširivi atributi (<code>project-*</code>)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Održljivost</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Jednostavno uređivanje teksta, Git verzioniranje</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">fleksibilnost</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Можа садржати богато садржај (табеле, код, слике)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Шаблонирање</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">JBake automatski izvuče atribute za Thymeleaf</p></td> </tr> </tbody> </table> </div> <div class="sect2"> <h3 id="_model_podataka">Model podataka</h3> <div class="paragraph"> <p>Svaki portfolio projekat je dokument AsciiDoc sa:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Metapodaci zaglavlja</strong>: strukturirane informacije (klijent, trajanje, tehnologije, itd.)</p> </li> <li> <p><strong>Тело документа</strong> : narativni opis, izazovi, rešenja, rezultati</p> </li> <li> <p><strong>Прилагођени атрибути</strong> : префиксирани`project-*`за автоматско извлечење</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam handwritten false class ProjetAsciiDoc { +titre: String +jbake-type: "projekat" +jbake-status: published|draft +jbake-date: Date +jbake-tags: List<String> -- +project-category: String +project-client: String +project-duration: String +project-role: String +project-thumbnail: String +project-gallery: List<String> +project-tech-stack: String +project-highlights: List<String> +project-demo-url: String +project-github-url: String -- +body: HTML (converti) } class JBakeEngine { +parse(asciidoc) +extractMetadata() +convertToHTML() } class ThymeleafTemplate { +portfolio.html +project.html +partials/project-card.html } class PortfolioPage { +published_projects: List +filtres: categories } ProjetAsciiDoc --> JBakeEngine : parse JBakeEngine --> ThymeleafTemplate : fournit données ThymeleafTemplate --> PortfolioPage : génère @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_detaljni_slučajevi_korišćenja">Detaljni slučajevi korišćenja</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_uc1_dodati_element_u_portfelj">UC1 : Dodati element u portfelj</h3> <div class="sect3"> <h4 id="_nominalni_tok">Nominalni tok</h4> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE actor Développeur as dev participant "Urednik Tekst" as editor participant "Фајл\nAsciiDoc" as file participant "JBake\nmotor" as jbake participant "Статички\nСајт" as site dev -> editor : Créer nouveau fichier activate editor editor -> file : portfolio/nouveau-projet.adoc activate file dev -> editor : Rédiger en-tête avec métadonnées\n(titre, type=project, status=published,\nattributs project-*) dev -> editor : Rédiger contenu narratif\n(contexte, défis, solutions) dev -> editor : Ajouter images dans assets/img/portfolio/ editor -> file : Sauvegarder deactivate editor dev -> jbake : Lancer build (jbake -b) activate jbake jbake -> file : Lire et parser jbake -> jbake : Extraire métadonnées jbake -> jbake : Convertir AsciiDoc → HTML jbake -> jbake : Appliquer template project.html jbake -> jbake : Ajouter à la liste portfolio.html jbake -> site : Générer pages statiques deactivate jbake dev -> site : Vérifier résultat activate site site --> dev : Afficher projet deactivate site @enduml</pre> </div> </div> </div> <div class="sect3"> <h4 id="_šablon_fajla_koji_se_kreira">Šablon fajla koji se kreira</h4> <div class="paragraph"> <p>Развојник создаје`content/portfolio/nom-projet.adoc`sa standardizovanom strukturom:</p> </div> <div class="ulist"> <ul> <li> <p>Naslov sa svim potrebnim atributima</p> </li> <li> <p>Normalizovane sekcije (Kontekst, Izazovi, Rešenja, Rezultati)</p> </li> <li> <p>Koherentna nomenklatura slika</p> </li> </ul> </div> </div> <div class="sect3"> <h4 id="_тачке_валидације">тачке валидације</h4> <div class="ulist"> <ul> <li> <p>Obavezni atributi su prisutni(<code>jbake-type</code>, <code>jbake-status</code>, <code>project-thumbnail</code>)</p> </li> <li> <p>Referencirane slike postoje u`assets/img/portfolio/`</p> </li> <li> <p>Build JBake uspešno se izvršava bez greške</p> </li> <li> <p>Пројекат се појављује на страници портфолио.</p> </li> <li> <p>Individualna stranica projekta se prikazuje ispravno.</p> </li> </ul> </div> </div> </div> <div class="sect2"> <h3 id="_uc2_уклони_елемент_из_портфолио">UC2 : Уклони елемент из портфолио</h3> <div class="sect3"> <h4 id="_nominalni_tok_2">nominalni tok</h4> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE actor Développeur as dev participant "Sistem Fajlovi" as fs participant "JBake\nEngine" as jbake participant "статични\nсајт" as site database "keš JBake" as cache dev -> fs : Supprimer portfolio/projet-ancien.adoc activate fs fs --> dev : Fichier supprimé deactivate fs dev -> fs : (Optionnel) Supprimer images associées\nassets/img/portfolio/projet-ancien-* activate fs fs --> dev : Images supprimées deactivate fs dev -> cache : Nettoyer cache JBake activate cache cache --> dev : Cache vidé deactivate cache dev -> jbake : Rebuild complet (jbake -b) activate jbake jbake -> jbake : Scanner content/portfolio/ jbake -> jbake : Projet absent → non généré jbake -> jbake : Régénérer portfolio.html\n(sans le projet supprimé) jbake -> site : Déployer nouveau build deactivate jbake dev -> site : Vérifier activate site site --> dev : Projet absent de la liste deactivate site @enduml</pre> </div> </div> </div> <div class="sect3"> <h4 id="_alternativna_strategija_arhiviranje">Alternativna strategija: arhiviranje</h4> <div class="paragraph"> <p>Umesto trajnog brisanja, mogućnost kreiranja fascikle`content/portfolio/archive/`:</p> </div> <div class="ulist"> <ul> <li> <p>Премести фајл уместо да га обришеш</p> </li> <li> <p>Omogućava lako vraćanje</p> </li> <li> <p>Zadrži istoriju Git jasnije</p> </li> </ul> </div> </div> <div class="sect3"> <h4 id="_čišćenje_resursa">Čišćenje resursa</h4> <div class="ulist"> <ul> <li> <p>Проверити сиротске слике у`assets/img/portfolio/`</p> </li> <li> <p>Уклони слике не референциране од стране других пројеката</p> </li> <li> <p>Očistiti JBake keš da se izbegnu fantomske reference</p> </li> </ul> </div> </div> </div> <div class="sect2"> <h3 id="_uc3_postaviti_na_neobjavljeno_draft">UC3 : Postaviti na neobjavljeno (draft)</h3> <div class="sect3"> <h4 id="_nominalni_tok_3">nominalni tok</h4> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE actor Développeur as dev participant "Фајл AsciiDoc" as file participant "JBake\nMotor" as jbake participant "Статични сајт" as site dev -> file : Ouvrir portfolio/projet.adoc activate file dev -> file : Modifier attribut\n:jbake-status: published\n↓\n:jbake-status: draft file --> dev : Sauvegardé deactivate file dev -> jbake : Rebuild (jbake -b) activate jbake jbake -> file : Parser le fichier jbake -> jbake : Détecter status=draft jbake -> jbake : Exclure de published_projects jbake -> jbake : Ne pas créer page publique note right Le projet existe toujours mais n'est pas publié end note jbake -> site : Générer site (sans ce projet) deactivate jbake dev -> site : Vérifier portfolio activate site site --> dev : Projet absent de la liste publique deactivate site @enduml</pre> </div> </div> </div> <div class="sect3"> <h4 id="_moguća_stanja">Moguća stanja</h4> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE [*] --> Draft : Création initiale Draft --> Published : Validation et publication Published --> Draft : Retrait temporaire Draft --> Archived : Projet abandonné Published --> Archived : Projet obsolète Archived --> [*] : Suppression définitive Published --> Published : Mises à jour note right of Draft :jbake-status: draft Non visible publiquement Utile pour projets en cours end note note right of Published :jbake-status: published Visible sur le portfolio Indexé par JBake end note note right of Archived Déplacé dans archive/ ou jbake-status: archived Non publié mais conservé end note @enduml</pre> </div> </div> </div> <div class="sect3"> <h4 id="_tipični_slučajevi_upotrebe">Tipični slučajevi upotrebe</h4> <div class="ulist"> <ul> <li> <p><strong>Projekt u izradi</strong> : napraviti u draft, objaviti kad bude spreman</p> </li> <li> <p><strong>Projet confidentiel temporairement</strong> : пређи у чернови за време сагласња са клијентом</p> </li> <li> <p><strong>Važno ažuriranje</strong> : preći u draft, izmeniti, objaviti ponovo</p> </li> <li> <p><strong>A/B testing</strong>: duplikirati u draftu, testirati, objaviti najbolju verziju</p> </li> </ul> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_архитектура_шаблонирања">Архитектура шаблонирања</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_strategija_reutilizabilnih_template_a">Strategija reutilizabilnih template-a</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "Шаблони Thymeleaf" { component [index.html] as index component [portfolio.html] as portfolio component [project.html] as project package "delimični" { component [header.html] as header component [footer.html] as footer component [project-card.html] as card component [tech-badge.html] as badge component [gallery.html] as gallery } } package "Подаци JBake" { database "objavljeni_projekti" as data database "sadržaj (projekat)" as content } index --> header index --> footer portfolio --> header portfolio --> footer portfolio --> card data --> portfolio : itération project --> header project --> footer project --> badge project --> gallery content --> project : projet individuel note right of card Fragment réutilisable pour afficher une carte de projet avec : - thumbnail - titre - tags - highlights end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_uzorak_izdvajanja_podataka">Uzorak izdvajanja podataka</h3> <div class="paragraph"> <p>JBake automatski transforma AsciiDoc attribusi u pristupačna svojstva u Thymeleaf:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "Dokument AsciiDoc" { (":project-client: Acme Corp") as attr1 (":project-duration: 6 meseci") as attr2 (":project-tags: java, react") as attr3 } rectangle "Model JBake" { (content['project-client']) as prop1 (content['project-duration']) as prop2 (content.tags) as prop3 } rectangle "Šablon Thymeleaf" { (th:text="${project['project-client']}") as tmpl1 (th:text="${project['project-duration']}") as tmpl2 (th:each="етикета : ${project.tags}") as tmpl3 } attr1 --> prop1 : parsing attr2 --> prop2 : parsing attr3 --> prop3 : parsing prop1 --> tmpl1 : binding prop2 --> tmpl2 : binding prop3 --> tmpl3 : binding @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_konvencije_imenovanja">Konvencije imenovanja</h3> <div class="ulist"> <ul> <li> <p><strong>Atributi projekta</strong> : префикс`project-*` (ex: <code>project-client</code>, <code>project-tech-stack</code>)</p> </li> <li> <p><strong>Datoteke</strong> : kebab-case (primer:`ecommerce-platform.adoc`)</p> </li> <li> <p><strong>Slike</strong> : prefiks ime-projekat (primer:`ecommerce-platform-thumb.jpg`)</p> </li> <li> <p><strong>Templates</strong> : функционално име (ex:`project-card.html`, <code>tech-badge.html</code>)</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_radni_tok_publikacije">radni tok publikacije</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_цевовод_за_развој">Цевовод за развој</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam handwritten false class ProjetAsciiDoc { +titre: String +jbake-type: "projekat" +jbake-status: published|draft +jbake-date: Date +jbake-tags: List<String> __ +project-category: String +project-client: String +project-duration: String +project-role: String +project-thumbnail: String +project-gallery: List<String> +project-tech-stack: String +project-highlights: List<String> +project-demo-url: String +project-github-url: String __ +body: HTML (converti) } class JBakeEngine { +parse(asciidoc) +extractMetadata() +convertToHTML() } class ThymeleafTemplate { +portfolio.html +project.html +partials/project-card.html } class PortfolioPage { +published_projects: List +filtres: categories } ProjetAsciiDoc --> JBakeEngine : parse JBakeEngine --> ThymeleafTemplate : fournit données ThymeleafTemplate --> PortfolioPage : génère @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_okruženja">okruženja</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 20%;"> <col style="width: 40%;"> <col style="width: 40%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Окружење</th> <th class="tableblock halign-left valign-top">upotreba</th> <th class="tableblock halign-left valign-top">Prihvaćen statut</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">lokalno</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Razvoj i pregled</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">koncept, objavljeno</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">стадирање</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Validacija preproizvodnje</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">objavljeno samo</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Proizvodnja</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Javni sajt</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">objavljeno samo</p></td> </tr> </tbody> </table> </div> </div> </div> <div class="sect1"> <h2 id="_ekstenzibillost">Ekstenzibillost</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_додавање_нових_атрибута">Додавање нових атрибута</h3> <div class="paragraph"> <p>Da biste obogatili model podataka, jednostavno dodati nove prefiksirane atribute.<code>project-*</code>(empty)</p> </div> <div class="ulist"> <ul> <li> <p><code>project-awards</code>: Nagrade i priznanja</p> </li> <li> <p><code>project-testimonial</code>: Захватак клијента</p> </li> <li> <p><code>project-team-size</code>: Величина тима</p> </li> <li> <p>`project-budget-range`budžetski opseg</p> </li> </ul> </div> <div class="paragraph"> <p>Ovi atributi postaju automatski dostupni u šablonima bez modifikacije JBake motore.</p> </div> </div> <div class="sect2"> <h3 id="_napredna_kategorizacija">Napredna kategorizacija</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE object Projet { project-category = "веб" project-subcategory = "e-komercija" project-industry = "maloprodaja" project-complexity = "visok" } object Taxonomie { categories : [web, mobile, data, devops] subcategories : Map<category, List> industries : [retail, finance, healthcare, ...] complexities : [low, medium, high] } Projet --> Taxonomie : classifié selon note right of Taxonomie Permet filtrage multi-critères dans le template portfolio.html via JavaScript ou côté serveur end note @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_najbolje_prakse">Najbolje prakse</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_organizacija_fajlova">Organizacija fajlova</h3> <div class="ulist"> <ul> <li> <p><strong>Jedna datoteka = jedan projekat</strong>: izbegnuti mešanje više projekata</p> </li> <li> <p><strong>Сlike у посвећеном фолдеру</strong><code>assets/img/portfolio/nom-projet/</code></p> </li> <li> <p><strong>Konzistentna nomenklatura</strong> : olakošava pretragu i održavanje</p> </li> <li> <p><strong>Versioning Git</strong> : potpuno praćenje promena</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_управљање_садржајем">Управљање садржајем</h3> <div class="ulist"> <ul> <li> <p><strong>Podrazumevani status nacrta</strong> : objaviti samo kada je spremno</p> </li> <li> <p><strong>Преглед пре издавања</strong> : провјера квалитета и конфиденцијалности</p> </li> <li> <p><strong>Пуне метаподатке</strong> : попuniti све релевантна полиja</p> </li> <li> <p><strong>Bogati narativni sadržaj</strong> : Ne ograničavajte se na metapodatke</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_performans">performans</h3> <div class="ulist"> <ul> <li> <p><strong>Optimiziraj slike</strong> : kompresija pre commit</p> </li> <li> <p><strong>Пагинација ако је потребна</strong> : ако >20 пројеката</p> </li> <li> <p><strong>Učitavanje na zahtev</strong> : slike galerija učitane na zahtev</p> </li> <li> <p><strong>Keš pregledača</strong> : odgovarajuća zaglavlja za assete</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ova arhitektura omogućava:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Jednostavnost korišćenja</strong> : dodati projekat = kreirati tekstualni fajl</p> </li> <li> <p><strong>Fleksibilnost</strong> : ekstenzibilan preko novih atributa</p> </li> <li> <p><strong>Održivost</strong> : odvajanje sadržaja i prezentacije</p> </li> <li> <p><strong>Trazibilnost</strong> : kompletno Git verzioniranje</p> </li> <li> <p><strong>Automatizacija</strong> : kontinuirana gradnja i implementacija moguća</p> </li> </ul> </div> <div class="paragraph"> <p>Izbor AsciiDoca osigurava doslednost sa ostalom delom sajta, a uz to pruža bogatstvo metapodataka potrebnih za profesionalni portfolio.</p> </div> </div> </div> https://cheroliv.com/blog/2026/0100_jbake_supabase_springboot_hybride_post.html Wed, 14 Jan 2026 00:00:00 +0000 blog/2026/0100_jbake_supabase_springboot_hybride_post.html <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">Vreme za čitanje : 12 minutes</div> <p>Umesto da birate između jednostavnosti Supabase i moći Spring Boot, zašto ne kombinirate oba ? Pronadite hibridnu arhitekturu koja iskorištava najbolje od svake tehnologije.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">тик</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_lažni_dilema_moderne_arhitekture">Lažni dilema moderne arhitekture</h2> <div class="sectionbody"> <div class="paragraph"> <p>Когако се гради модерна апликација са статичним фронтендом, често се налазиш пред бинарни избор :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Уложити све у Backend-as-a-Service решење</strong>(Supabase, Firebase) - jednostavno, ali ograničeno</p> </li> <li> <p><strong>Izgraditi kompletan backend</strong>(Spring Boot, Node.js) - moćan ali kompleksan</p> </li> </ul> </div> <div class="paragraph"> <p>Ово избор је лажан дилемa. Хибрид архитектура предлаже трећи пут: <strong>користити сваку технологију тамо где је најбоља</strong></p> </div> </div> </div> <div class="sect1"> <h2 id="_arhitektonska_vizija">Arhitektonska vizija</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_tradicionalna_arhitektura_monolitna">Tradicionalna arhitektura : monolitna</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "Tradicionalna arhitektura" { actor Utilisateur as user component "Frontend" as frontend #LightBlue component "Monolični backend" as backend #LightCoral { [Authentification] [CRUD] [Logique Métier] [Jobs] [APIs Tierces] } database "База података" as db #LightGray user --> frontend frontend --> backend : Toutes les requêtes backend --> db } note right of backend Tout passe par le backend même les opérations simples ⚠️ Point de congestion unique ⚠️ Complexité dès le départ ⚠️ Couplage fort end note @enduml</pre> </div> </div> <div class="paragraph"> <p>U ovom pristupu, čak i najjednostavnije operacije (citanje članka, kreiranje komentara) moraju da prođu kroz vaš backend. Plaćate trošak složenosti već od prvog dana.</p> </div> </div> <div class="sect2"> <h3 id="_baas_arhitektura_svaki_delegat">BaaS arhitektura : svaki delegat</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "Čista BaaS arhitektura" { actor Utilisateur as user component "Фронтенд" as frontend #LightBlue cloud "Supabase / Firebase" as baas #LightGreen { [Auth] [Database] [Storage] [Edge Functions] } user --> frontend frontend --> baas : Toutes les opérations } note right of baas Développement rapide Pas de serveur à gérer ⚠️ Limité pour logique complexe ⚠️ Vendor lock-in ⚠️ Edge Functions contraintes end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Na suprotnom, delegovanje svega BaaS-u je svodljivo na početku, ali brzo pokazuje svoje ograničenja kada poslovna logika postane kompleksnija.</p> </div> </div> <div class="sect2"> <h3 id="_hibridna_arhitektura_odvajanje_odgovornosti">Hibridna Arhitektura : Odvajanje Odgovornosti</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle actor Utilisateur as user #LightBlue package "Слој фронтенд" { component "statičan sajt JBake" as frontend #SkyBlue } package "Jednostavan Sloj (Supabase)" #LightGreen { component "Autentifikacija" as auth component "Osnovni CRUD" as crud component "Складиште фајлова" as storage component "Реално време" as realtime } package "Poslovni sloj (Spring Boot)" #Coral { component "Сложна логика" as logic component "оркестровање" as orchestration component "Planirani poslovi" as jobs component "Интеграције" as integrations } database "PostgreSQL podeljeno" as db #LightGray user --> frontend frontend --> auth : OAuth2, JWT frontend --> crud : Articles, Profils frontend --> storage : Images, Fichiers frontend --> realtime : Notifications frontend --> logic : Calculs, Rapports frontend --> orchestration : Workflows logic --> integrations : Stripe, APIs orchestration --> db jobs --> db crud --> db auth --> db note bottom of db **Une seule source de vérité** Partagée entre Supabase et Spring Boot end note note right of auth **Gratuit jusqu'à 50k users** Configuration en quelques clics OAuth2 multi-providers end note note right of logic **Activé seulement si nécessaire** Kotlin + Coroutines Transactions complexes end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Hibridna arhitektura jasno podeljuje odgovornosti po kompleksnosti i prirodi operacija.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_principi_dizajna">Principi dizajna</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_princip_1_počinite_jednostavno_razvojajte_se_pametno">Princip 1 : Počinite jednostavno, razvojajte se pametno.</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "**Faza 1: MVP**" #LightGreen { component "JBake + Supabase" as mvp note right ✓ Développement en jours ✓ Coût : 0€ ✓ Validation concept end note } rectangle "Faza 2 : Rast" #LightYellow { component "JBake + Supabase + Spring Boot (опционно)" as growth note right ✓ Logique métier émerge ✓ Premiers jobs planifiés ✓ Intégrations tierces end note } rectangle "Faza 3 : Skaliranje" #LightCoral { component "Саврешена архитектура" as scale note right ✓ Orchestration complexe ✓ Performances optimisées ✓ Cache distribué end note } mvp -down-> growth : Quand la complexité\nle justifie growth -down-> scale : Optimisation\ncontinue @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Ne izgradite Spring Boot ako vam nije potreban.</strong>Počnite sa Supabase-om, dodajte Spring Boot kada je složenost opравдана.</p> </div> </div> <div class="sect2"> <h3 id="_princip_2_razdvajanje_po_vrsti_operacije">Princip 2: Razdvajanje po vrsti operacije</h3> <div class="listingblock"> <div class="content"> <pre>@startmindmap skinparam backgroundColor #FEFEFE * Opérations\nApplicatives left side ** Opérations Simples\n(Supabase) ***_ CRUD Standard ****_ Lecture ****_ Création ****_ Mise à jour ****_ Suppression ***_ Authentification ****_ Login/Logout ****_ OAuth2 ****_ Gestion session ***_ Stockage ****_ Upload fichiers ****_ CDN automatique ***_ Temps Réel ****_ WebSocket ****_ Notifications right side ** Opérations Complexes\n(Spring Boot) ***_ Logique Métier ****_ Calculs complexes ****_ Règles métier ****_ Validations avancées ***_ Orchestration ****_ Multi-services ****_ Transactions distribuées ****_ Saga patterns ***_ Tâches Planifiées ****_ Rapports périodiques ****_ Synchronisations ****_ Nettoyages ***_ Intégrations ****_ Paiements (Stripe) ****_ APIs tierces ****_ Services ML/AI @endmindmap</pre> </div> </div> </div> <div class="sect2"> <h3 id="_princip_3_jedinstveni_izvor_istine">Princip 3: Jedinstveni izvor istine</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE database "PostgreSQL" as db #LightGray { package "Shema: auth (Supabase)" #LightGreen { [users] [sessions] [identities] } package "Shema: javno (podeljeno)" #SkyBlue { [articles] [comments] [profiles] } package "Shema: poslovni (Spring Boot)" #Coral { [orders] [payments] [reports] } } component "Supabase" as supabase #LightGreen component "Spring Boot" as spring #Coral supabase -down-> users : Gère supabase -down-> sessions : Gère supabase -down-> articles : Accède supabase -down-> comments : Accède supabase -down-> profiles : Accède spring -down-> articles : Accède spring -down-> profiles : Accède spring -down-> orders : Gère spring -down-> payments : Gère spring -down-> reports : Gère note right of db **Avantages :** • Pas de synchronisation complexe • JOINs possibles entre tables • Cohérence garantie • Migrations unifiées end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Koristeći istu instancu PostgreSQL, Supabase i Spring Boot rade na istim podacima bez kompleksne synchronizacije.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_orkestracija_tokova">Orkestracija Tokova</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_tok_1_centralizovana_autentifikacija">Tok 1: Centralizovana autentifikacija</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE autonumber actor "korisnik" as user participant "JBake" as jbake participant "Supabase Auth" as auth participant "Spring Boot" as spring database "PostgreSQL" as db == Authentification == user -> jbake : Clique "Пријави се" jbake -> auth : Redirect OAuth2 (Google/GitHub) auth -> user : Consent screen user -> auth : Autorise auth -> auth : Génère JWT auth -> jbake : Retourne JWT + Refresh Token jbake -> jbake : Stocke tokens (sessionStorage) == Accès aux Ressources == group Opération Simple (CRUD) user -> jbake : Crée un article jbake -> db : POST avec JWT note right: Supabase Row Level Security\nvérifie le JWT automatiquement db -> jbake : Article créé end group Opération Complexe (Métier) user -> jbake : Génère un rapport jbake -> spring : POST /api/reports\navec JWT spring -> spring : Valide JWT Supabase spring -> spring : Extrait claims (user_id, roles) spring -> db : Requêtes complexes spring -> jbake : Rapport généré end note over auth, spring **Le JWT est universel** Valide par Supabase ET Spring Boot Pas de double authentification end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Ključna tačka</strong>: Jedan proces autentifikacije, jedan JWT, koji se može koristiti svuda.</p> </div> </div> <div class="sect2"> <h3 id="_tok_2_orkestracija_jednego_složenog_poslovnog_procesa">Tok 2: Orkestracija jednego složenog poslovnog procesa</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE autonumber actor "Klijent" as user participant "JBake" as jbake participant "Spring Boot" as spring participant "Supabase baza podataka" as supadb participant "Stripe API" as stripe participant "Служба инвентаризације" as inventory participant "E‑mail servis" as email database "PostgreSQL" as db user -> jbake : Passe commande jbake -> spring : POST /api/orders/create == Orchestration Spring Boot == spring -> db : BEGIN TRANSACTION par Vérifications Parallèles spring -> inventory : Vérifier stock inventory -> spring : Stock OK else spring -> db : Vérifier profil client db -> spring : Client vérifié end spring -> stripe : Créer Payment Intent stripe -> spring : Intent créé (ID: pi_xxx) spring -> db : Créer Order (status: PENDING) db -> spring : Order créé spring -> stripe : Confirmer paiement stripe -> spring : Paiement confirmé spring -> db : Update Order (status: PAID) spring -> inventory : Décrémenter stock spring -> db : COMMIT TRANSACTION par Notifications Asynchrones spring -> email : Email confirmation else spring -> supadb : Insert notification note right: Notification temps réel\nvia Supabase Realtime end spring -> jbake : Order confirmé jbake -> user : Affiche confirmation note over spring **Responsabilités Spring Boot :** • Transaction ACID • Orchestration multi-services • Rollback automatique si erreur • Gestion des cas limites end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Šta donosi Spring Boot</strong>: Pouzdana orkestracija složenih procesa koja uključuje više sistema sa transakcionom garancijom.</p> </div> </div> <div class="sect2"> <h3 id="_tok_3_zakazani_poslovi_i_sinhronizacije">Tok 3: Zakazani poslovi i sinhronizacije</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE participant "Rasporednik (Spring Boot)" as scheduler participant "Usluga izveštaja" as report participant "PostgreSQL" as db participant "Eksterni API" as api participant "Usluga e-pošte" as email participant "Supabase Storage" as storage == Job Quotidien : 2h00 == activate scheduler scheduler -> report : Déclenche génération rapport activate report report -> db : Récupère données\ndes dernières 24h db -> report : Dataset report -> report : Calculs & Agrégations report -> report : Génération PDF report -> storage : Upload PDF storage -> report : URL publique report -> email : Envoie aux admins\navec lien PDF deactivate report == Job Hebdomadaire : Dimanche 3h00 == scheduler -> report : Synchronisation externe activate report report -> api : Fetch données externes api -> report : Nouvelles données report -> db : Mise à jour tables report -> db : Nettoyage données obsolètes deactivate report == Job Mensuel : 1er du mois == scheduler -> report : Facturation activate report report -> db : Liste clients actifs report -> report : Calcul montants report -> api : Génération factures (Stripe) report -> email : Envoi factures deactivate report deactivate scheduler note right of scheduler **Impossible avec Supabase seul** Edge Functions non adaptées pour jobs longs et récurrents end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Šta Spring Boot donosi</strong>: Pouzdani zakazani poslovi sa upravljanjem stanjem, automatski ponovi i garantovano izvršenje.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_матрица_одлуке">Матрица одлуке</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_kada_koristiti_supabase">Kada koristiti Supabase?</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE start :Nouvelle fonctionnalité à implémenter; if (CRUD simple ?) then (oui) :✅ **Supabase**; stop else (non) if (Authentification ?) then (oui) :✅ **Supabase Auth**; stop else (non) if (Upload fichiers ?) then (oui) :✅ **Supabase Storage**; stop else (non) if (Temps réel ?) then (oui) :✅ **Supabase Realtime**; stop else (non) if (Row Level Security\nsuffisante ?) then (oui) :✅ **Supabase + Policies**; stop else (non) :⚠️ **Considérer Spring Boot**; #Coral:Passer à l'arbre\nde décision Spring Boot; stop endif endif endif endif endif @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_kada_koristiti_spring_boot">Kada koristiti Spring Boot ?</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE start :Nouvelle fonctionnalité complexe; if (Orchestration\nmulti-services ?) then (oui) :✅ **Spring Boot**; stop else (non) if (Transaction ACID\ncritique ?) then (oui) :✅ **Spring Boot**; stop else (non) if (Job planifié ?) then (oui) :✅ **Spring Boot Scheduler**; stop else (non) if (Intégration API\ntierce complexe ?) then (oui) :✅ **Spring Boot**; stop else (non) if (Calculs lourds\n> 10 secondes ?) then (oui) :✅ **Spring Boot**; stop else (non) if (Cache distribué\nnécessaire ?) then (oui) :✅ **Spring Boot + Redis**; stop else (non) :⚠️ **Probablement Supabase**; #LightGreen:Revenir à l'arbre\nde décision Supabase; stop endif endif endif endif endif endif @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_примери_архитектуре_по_тип_пројекта">Примери архитектуре по тип пројекта</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_blog_portfelj">Blog / Portfelj</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "Osobni blog - 95% Supabase" { component "JBake" as jbake #SkyBlue package "Supabase (Besplatan)" #LightGreen { [Auth: OAuth2 Google] [Articles (CRUD)] [Commentaires] [Images (Storage)] [Notifications Realtime] } package "Spring Boot (Izborno)" #LightCoral { [Newsletter Mensuelle] note bottom: Job planifié uniquement } database "PostgreSQL" as db jbake --> [Auth: OAuth2 Google] jbake --> [Articles (CRUD)] jbake --> [Commentaires] jbake --> [Images (Storage)] jbake --> [Notifications Realtime] [Articles (CRUD)] --> db [Commentaires] --> db [Newsletter Mensuelle] --> db } note bottom of "Spring Boot (Izborno)" **Spring Boot pas obligatoire** Newsletter peut être gérée par un service tiers (Mailchimp) end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Пресуда</strong>: 100% Supabase je više nego dovoljno.</p> </div> </div> <div class="sect2"> <h3 id="_saas_aplikacija">SaaS aplikacija</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "SaaS aplikacija - Hibridna arhitektura" { component "JBake / React" as frontend #SkyBlue package "Supabase" #LightGreen { [Auth Multi-tenant] [Profils Utilisateurs] [Données Simples] [Storage Documents] } package "Spring Boot" #Coral { [Facturation (Stripe)] [Analytics Avancées] [Rapports Mensuels] [Quotas & Limites] [Webhooks Stripe] } cloud "Spoljne usluge" { [Stripe API] [SendGrid Email] } database "PostgreSQL Dijeljeno" as db frontend --> [Auth Multi-tenant] frontend --> [Profils Utilisateurs] frontend --> [Données Simples] frontend --> [Facturation (Stripe)] frontend --> [Analytics Avancées] [Auth Multi-tenant] --> db [Profils Utilisateurs] --> db [Données Simples] --> db [Facturation (Stripe)] --> db [Facturation (Stripe)] --> [Stripe API] [Analytics Avancées] --> db [Rapports Mensuels] --> db [Rapports Mensuels] --> [SendGrid Email] [Webhooks Stripe] ..> [Stripe API] : Écoute } note right of "Spring Boot" **Nécessaire pour :** • Gestion abonnements • Facturation récurrente • Quotas dynamiques • Analytics complexes • Webhooks fiables end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Пресуда</strong>Potrebna je hibridna arhitektura. Supabase za najvažnije, Spring Boot za kritični deo (plaćanja, fakturisanja).</p> </div> </div> <div class="sect2"> <h3 id="_e_komerc">e-komerc</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "E-komercija - 70% Spring Boot" { component "Storefront (JBake/React)" as frontend #SkyBlue package "Supabase" #LightGreen { [Auth Clients] [Catalogue Produits\n(lecture seule)] [Images Produits] } package "Spring Boot (основна деловатност)" #Coral { [Gestion Commandes] [Paiements Stripe] [Gestion Stock] [Calcul Frais Port] [Génération Factures] [Synchronisation ERP] [Emails Transactionnels] } cloud "Интеграције" { [Stripe] [Transporteur API] [ERP Externe] } database "PostgreSQL" as db frontend --> [Auth Clients] frontend --> [Catalogue Produits\n(lecture seule)] frontend --> [Gestion Commandes] [Auth Clients] --> db [Catalogue Produits\n(lecture seule)] --> db [Gestion Commandes] --> db [Paiements Stripe] --> [Stripe] [Gestion Stock] --> db [Calcul Frais Port] --> [Transporteur API] [Génération Factures] --> db [Synchronisation ERP] --> [ERP Externe] [Synchronisation ERP] --> db } note right of "Spring Boot (основна деловатност)" **Spring Boot indispensable :** • Transactions critiques • Orchestration complexe • Intégrations multiples • Conformité légale • Jobs de synchronisation end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Verdict</strong>: Spring Boot je neophodan. Supabase samo za autentifikaciju i katalog.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_strategija_progresivne_migracije">Strategija progresivne migracije</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE |Semaine 1-2| start :Créer projet Supabase; :Configurer Auth (Google, GitHub); :Définir schéma PostgreSQL initial; :Implémenter CRUD de base sur JBake; :Déployer MVP sur GitHub Pages; note right **Livrable :** Application fonctionnelle **Coût :** 0€ **Temps :** 1-2 semaines end note |Semaine 3-4| :Observer utilisation réelle; :Identifier limitations; |Décision| if (Logique complexe\némerge ?) then (non) |Supabase| :Continuer avec Supabase seul; :Ajouter Edge Functions si besoin; stop else (oui) |Spring Boot| :Créer projet Spring Boot; :Configurer validation JWT Supabase; :Migrer logique complexe vers Spring Boot; note right **Migration sélective** Seulement ce qui est complexe end note endif |Semaines suivantes| :Déployer Spring Boot (Cloud Run, EC2); :Connecter à PostgreSQL Supabase; :Implémenter premiers jobs planifiés; :Intégrer APIs tierces; stop note right **Architecture finale hybride** Supabase + Spring Boot en parfaite harmonie end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_troškovi_i_operativna_razmatranja">Troškovi i operativna razmatranja</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_структура_трошкова">Структура трошкова</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE package "Procijenjeni mesečni troškovi" { rectangle "Faza MVP (0-1000 users)" #LightGreen { [JBake (GitHub Pages): 0€] [Supabase: 0€] [Spring Boot: N/A] note bottom: **Total: 0€/mois** } rectangle "Faza rasta (1k-10k korisnika)" #LightYellow { [JBake (GitHub Pages): 0€] [Supabase: 0€] [Spring Boot (Cloud Run): 20-50€] [PostgreSQL (si séparé): 0-30€] note bottom: **Total: 20-80€/mois** } rectangle "Skala faze (10k-100k korisnika)" #LightCoral { [JBake (Netlify Pro): 19€] [Supabase Pro: 25€] [Spring Boot (instances multiples): 100-300€] [Redis Cache: 20-50€] [Monitoring: 20€] note bottom: **Total: 184-414€/mois** } } note right of "Skala faze (10k-100k korisnika)" À ce stade, les revenus justifient largement les coûts end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_одговорности_оперативно">Одговорности Оперативно</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE package "Ko upravlja šta?" { rectangle "Управљање од стране Supabase (0 напора)" #LightGreen { [Authentification] [Base de données] [Backups automatiques] [Scaling automatique] [Monitoring DB] [Sécurité DB] } rectangle "Upravljeno od GitHub (0 trudova)" #SkyBlue { [Hébergement site statique] [HTTPS/SSL] [CDN global] [Déploiement automatique] } rectangle "Za upravljanje (Spring Boot)" #LightCoral { [Déploiement application] [Monitoring APM] [Logs centralisés] [Scaling horizontal] [Mises à jour sécurité] } } note bottom of "Za upravljanje (Spring Boot)" **Minimisable avec :** • Cloud Run (serverless) • Kubernetes (si nécessaire) • Services managés (RDS, etc.) end note @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak_savršeno_ravnoteža">Zaključak: Savršeno ravnoteža</h2> <div class="sectionbody"> <div class="paragraph"> <p>Hibridna arhitektura Supabase i Spring Boot nije kompromis, ona je<strong>синергија</strong>.</p> </div> <div class="sect2"> <h3 id="_principi_koje_treba_zapamtiti">Principi koje treba zapamtiti</h3> <div class="listingblock"> <div class="content"> <pre>@startmindmap skinparam backgroundColor #FEFEFE * Architecture\nHybride ** Commencer Simple ***_ MVP avec Supabase ***_ 0€ de coût initial ***_ Validation rapide ** Évoluer Intelligemment ***_ Ajouter Spring Boot\nsi nécessaire ***_ Migration progressive ***_ Pas de refonte totale ** Exploiter les Forces ***_ Supabase: Simplicité ***_ Spring Boot: Puissance ***_ PostgreSQL: Source unique ** Minimiser la Complexité ***_ Pas de synchronisation ***_ Pas de duplication ***_ Architecture claire ** Optimiser les Coûts ***_ Gratuit au départ ***_ Scaling progressif ***_ ROI évident @endmindmap</pre> </div> </div> </div> <div class="sect2"> <h3 id="_kada_izabrati_ovu_arhitekturu">Kada izabrati ovu arhitekturu?</h3> <div class="paragraph"> <p><strong>✅ Ova arhitektura je idealna ako :</strong></p> </div> <div class="ulist"> <ul> <li> <p>Желите да покренете брзо (MVP у данима, не у месецима)</p> </li> <li> <p>Ви очекујете растусложности послова</p> </li> <li> <p>Želite da smanjite početne troškove</p> </li> <li> <p>Volite PostgreSQL i želite jedini izvor istine</p> </li> <li> <p>Vi volite Kotlin i korutine za poslovni kod</p> </li> <li> <p>Vi želite da izbegnete sav vendor lock-in</p> </li> </ul> </div> <div class="paragraph"> <p><strong>❌ Ova arhitektura NIJE primeredna ako:</strong></p> </div> <div class="ulist"> <ul> <li> <p>Ваш пројекат је једноставан и остаће тако (лични блог → 100% Supabase довољно)</p> </li> <li> <p>Већ имате установлен бек-енд стек који контролишете</p> </li> <li> <p>Ви предпочитате традиционални монолит</p> </li> <li> <p>Treba vam .NET, Python ili drugi programski jezik za backend</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_konačna_opšta_vizija">Konačna Opšta Vizija</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE package "пуна хибридна архитектура" { actor "Korisnici" as users rectangle "Frontend (statički)" #SkyBlue { [JBake / GitHub Pages] note right: Gratuit, CDN global } rectangle "Jednostavan backend (Supabase)" #LightGreen { [Auth OAuth2] [CRUD APIs] [Storage] [Realtime] note right Gratuit jusqu'à 50k users Zéro configuration serveur end note } rectangle "Poslovni backend (Spring Boot)" #Coral { [Orchestration] [Jobs Planifiés] [Intégrations] [Transactions] note right Activé uniquement si nécessaire end note } database "PostgreSQL Jedinstveni izvor istine" as db #LightGray users --> [JBake / GitHub Pages] [JBake / GitHub Pages] --> [Auth OAuth2] [JBake / GitHub Pages] --> [CRUD APIs] [JBake / GitHub Pages] --> [Storage] [JBake / GitHub Pages] --> [Realtime] [JBake / GitHub Pages] --> [Orchestration] [Auth OAuth2] --> db [CRUD APIs] --> db [Orchestration] --> db [Jobs Planifiés] --> db [Intégrations] --> db } note bottom of db **Une seule base, deux consommateurs** • Supabase pour le simple • Spring Boot pour le complexe • Aucune synchronisation requise end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_najbolje_od_dva_sveta">Najbolje od dva sveta</h3> <div class="paragraph"> <p>Ova arhitektura vam daje :</p> </div> <div class="paragraph"> <p><strong>Brzina Supabase</strong></p> </div> <div class="ulist"> <ul> <li> <p>Pokretanje u satima, ne u nedeljama</p> </li> <li> <p>OAuth2 autentifikacija u nekoliko klikova</p> </li> <li> <p>Automatski generisani REST API-ji</p> </li> <li> <p>Нулова конфигурација сервера</p> </li> </ul> </div> <div class="paragraph"> <p><strong>💪 Моћ Spring Boot-а</strong></p> </div> <div class="ulist"> <ul> <li> <p>Kotlin i koutine za elegantan asinhroni kod</p> </li> <li> <p>Orkestracija složenih poslovnih procesa</p> </li> <li> <p>Pouzdani zakazani poslovi</p> </li> <li> <p>Garantovane ACID transakcije</p> </li> <li> <p>Potpun Spring ekosistem</p> </li> </ul> </div> <div class="paragraph"> <p><strong>💰 Progresivna ekonomija</strong></p> </div> <div class="ulist"> <ul> <li> <p>0€ za početak i validaciju</p> </li> <li> <p>Troškovi koji prate rast</p> </li> <li> <p>Никако претерено инжењерство</p> </li> </ul> </div> <div class="paragraph"> <p><strong>🎯 Arhitektonska fleksibilnost</strong></p> </div> <div class="ulist"> <ul> <li> <p>Progresivna migracija bez redesigna</p> </li> <li> <p>Dodavanje Spring Boot samo ako je potrebno</p> </li> <li> <p>Nema potpunog vendor lock‑ina</p> </li> <li> <p>Evolutivna arhitektura</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_за_даље">За даље</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_технички_ресурси">Технички ресурси</h3> <div class="paragraph"> <p><strong>Документација Supabase :</strong></p> </div> <div class="ulist"> <ul> <li> <p><a href="https://supabase.com/docs/guides/auth">Упутство за аутентификацију</a></p> </li> <li> <p><a href="https://supabase.com/docs/guides/database/postgres/row-level-security">Bezbednost na nivou reda</a></p> </li> <li> <p><a href="https://supabase.com/docs/guides/api">Automatski generirani API-jevi</a></p> </li> </ul> </div> <div class="paragraph"> <p><strong>Документација Spring Boot :</strong></p> </div> <div class="ulist"> <ul> <li> <p><a href="https://spring.io/guides/tutorials/spring-boot-kotlin/">Spring Boot sa Kotlin</a></p> </li> <li> <p><a href="https://spring.io/blog/2019/04/12/going-reactive-with-spring-coroutines-and-kotlin-flow">Koruotine i Spring</a></p> </li> <li> <p><a href="https://docs.spring.io/spring-security/reference/servlet/oauth2/resource-server/jwt.html">JWT resursni server</a></p> </li> </ul> </div> <div class="paragraph"> <p><strong>Dodatni članaci :</strong></p> </div> <div class="ulist"> <ul> <li> <p>Zaštita API-ja uz JWT</p> </li> <li> <p>Optimizacija performansi PostgreSQL</p> </li> <li> <p>Obrazci progresivne migracije</p> </li> <li> <p>Управљање грешкама у распређеној архитектури</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_реални_случајеви_коришћења">Реални случајеви коришћења</h3> <div class="paragraph"> <p>Ova hibridna arhitektura se uspešno koristi u :</p> </div> <div class="ulist"> <ul> <li> <p><strong>SaaS B2B</strong>: Аутентификација Supabase, фактурисање Spring Boot</p> </li> <li> <p><strong>Tržišta</strong>: Каталог Supabase, трансакције Spring Boot</p> </li> <li> <p><strong>Platforme sadržaja</strong>: Članci Supabase, analitika Spring Boot</p> </li> <li> <p><strong>Unutrašnji alati</strong>: CRUD Supabase, radni tokovi Spring Boot</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_чек_лист_за_почетак">Чек-лист за почетак</h3> <div class="paragraph"> <p><strong>Faza 1 - Osnovi (Nedelja 1)</strong></p> </div> <div class="ulist checklist"> <ul class="checklist"> <li> <p><i class="fa fa-square-o"></i> Kreiraj nalog Supabase - [ ] Konfigurisati projekat PostgreSQL - [ ] Активисати Auth (Google, GitHub) - [ ] Definisati inicijalnu šemu - [ ] Konfigurisati Row Level Security - [ ] Тестирај API-je из JBake</p> </li> </ul> </div> <div class="paragraph"> <p><strong>Faza 2 - MVP (sedmica 2-3)</strong></p> </div> <div class="ulist checklist"> <ul class="checklist"> <li> <p><i class="fa fa-square-o"></i> Implementirati glavne stranice - [ ] Интегровати OAuth2 аутентификацију - [ ] Kreirati obrasce CRUD - [ ] Konfigurisati Storage za fajlove - [ ] Deploy na GitHub Pages - [ ] Testirati u realnim uslovima</p> </li> </ul> </div> <div class="paragraph"> <p><strong>Faza 3 - Evolucija (Po potrebi)</strong></p> </div> <div class="ulist checklist"> <ul class="checklist"> <li> <p><i class="fa fa-square-o"></i> Identifikovati potrebe za kompleksnom logikom - [ ] Kreirati Spring Boot projekat ako je potrebno - [ ] Konfigurisanje validacije JWT Supabase - [ ] Povezati se sa PostgreSQL Supabase - [ ] Migrirati kompleksne funkcionalnosti - [ ] Implementirati zakazane poslove - [ ] deployirati Spring Boot (Cloud Run, etc.)</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_anti_paterni_koje_treba_izbegnuti">Anti-paterni koje treba izbegnuti</h3> <div class="paragraph"> <p><strong>❌ Ne činiti:</strong></p> </div> <div class="ulist"> <ul> <li> <p>Duplirati podatke između Supabase i Spring Boot</p> </li> <li> <p>Kreirati dve odvojene PostgreSQL baze</p> </li> <li> <p>Кодирај сам аутентификацију</p> </li> <li> <p>Korišćenje Spring Boot-a za jednostavan CRUD</p> </li> <li> <p>Prekomerno arhićevati od samog početka</p> </li> <li> <p>Игнориши Row Level Security Supabase</p> </li> </ul> </div> <div class="paragraph"> <p><strong>✅ Bolje uraditi :</strong></p> </div> <div class="ulist"> <ul> <li> <p>Podeliti jedinou bazu podataka PostgreSQL</p> </li> <li> <p>Neka Supabase rukuje autentifikacijom</p> </li> <li> <p>Користи Spring Boot само заради комплексност</p> </li> <li> <p>Početi jednostavno, razvijati se postepeno</p> </li> <li> <p>Korišćenje prednosti svake tehnologije</p> </li> <li> <p>Zaštiti sa RLS na nivou baze podataka</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_perspektive_evolucije">Perspektive evolucije</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_додавање_нових_способности">Додавање нових способности</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "Savremena arhitektura" #SkyBlue { [JBake] [Supabase] [Spring Boot] } rectangle "Moguće evolucije" #LightYellow { package "Performans" { [Redis Cache] [CDN pour Assets] [PostgreSQL Replicas] } package "мониторинг" { [Grafana] [Prometheus] [Sentry] } package "CI/CD" { [GitHub Actions] [Tests Automatisés] [Déploiement Continu] } package "funkcionalnosti" { [Search (ElasticSearch)] [Queue (RabbitMQ)] [Event Sourcing] } } [Spring Boot] .down.> [Redis Cache] : Peut ajouter [Spring Boot] .down.> [Queue (RabbitMQ)] : Peut ajouter [Spring Boot] .down.> [Search (ElasticSearch)] : Peut ajouter [Supabase] .down.> [PostgreSQL Replicas] : Peut ajouter note bottom **Architecture extensible** Chaque ajout est indépendant Pas de refonte globale nécessaire end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_horizontalno_skaliranje">Horizontalno skaliranje</h3> <div class="paragraph"> <p>Kada vaša aplikacija rast, hibridna arhitektura se prirodno skalira :</p> </div> <div class="paragraph"> <p><strong>Supabase:</strong></p> </div> <div class="ulist"> <ul> <li> <p>scale automatski do miliona operacija</p> </li> <li> <p>Read replicas za čitanje performanse</p> </li> <li> <p>Vraćanje u tačnom trenutku za bezbednost</p> </li> </ul> </div> <div class="paragraph"> <p><strong>Spring Boot:</strong></p> </div> <div class="ulist"> <ul> <li> <p>Više instanci iza load balancer-a</p> </li> <li> <p>Bezstanovički dizajn olakšava horizontalno skaliranje</p> </li> <li> <p>Kubernetes za orkestraciju ako je potrebno</p> </li> </ul> </div> <div class="paragraph"> <p><strong>PostgreSQL :</strong></p> </div> <div class="ulist"> <ul> <li> <p>Particioniranje za velike tabele</p> </li> <li> <p>Konekcijski pool (PgBouncer)</p> </li> <li> <p>Sharding je zaista potrebno (rijetko)</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_svedočanstva_arhitektonska">Svedočanstva arhitektonska</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_startup_saas_50k_korisnika">Startup SaaS (50k korisnika)</h3> <div class="paragraph"> <p><em>__</em> Pokrenuli smo 100% Supabase. Na 5k korisnika, dodali smo Spring Boot samo za Stripe fakturaciju i mesečne izveze. Godinu dana kasnije, 80% naših operacija uvek prolazi kroz Supabase. Spring Boot rukuje samo kritičnim delom. Ovo razdvajanje nam je omogućilo da se skaliramo bez preprojektovanja. (empty)</p> </div> </div> <div class="sect2"> <h3 id="_platforma_e_učenja_10k_korisnika">Platforma e-učenja (10k korisnika)</h3> <div class="paragraph"> <p><em><em>_ OAuth2 autentifikacija Supabase nama je uštedela tri nedelje razvoja. Automatski generisani API-je upravljaju svim naшим katalogom kurseva. Spring Boot se koristi samo za PDF sertifikate i mejlove o napretku. Jednostavna, održiva, skalabilna arhitektura. </em>_</em></p> </div> </div> <div class="sect2"> <h3 id="_b2b_tržište_3k_korisnika">B2B tržište (3k korisnika)</h3> <div class="paragraph"> <p><em>__</em> Spring Boot upravlja transakcijama između kupovaca i prodavaca (kritično). Supabase upravlja sve ostalo: profili, realno-vremenska poruka, dokumenti. Fakt da dele isto PostgreSQL bazu sprečava nam bilo kakvu kompleksnu sinkronizaciju. Najbolji arhitektonski izbor koji smo učinili. (Note: No content to translate; output is empty.)</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_sinteza_jedna_moderna_architectureska_paradigma">Sinteza : Jedna moderna architectureska paradigma</h2> <div class="sectionbody"> <div class="paragraph"> <p>Hibridna arhitektura Supabase + Spring Boot predstavlja novi paradigam:<strong>arhitektonska specijalizacija</strong>.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "Стара парадигма" #LightCoral { card "Све у Backendu" { [Auth] [CRUD] [Logique Métier] [Jobs] [Storage] [Realtime] } note bottom Complexité maximale dès le jour 1 end note } rectangle "novi paradigam" #LightGreen { card "Supabase (Удобност)" { [Auth] [CRUD Simple] [Storage] [Realtime] } card "Spring Boot (Diferenciacija)" { [Logique Métier] [Jobs] [Intégrations] } note bottom Complexité progressive ajoutée seulement si nécessaire end note } [Ancien Paradigme] -right-> [Nouveau Paradigme] : Évolution @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Osnovni princip:</strong>Ne gradite ono što već postoji kao usluga. Fokusirajte se na ono što razlikuje vašu aplikaciju.</p> </div> <div class="sect2"> <h3 id="_pravilo_8020">Pravilo 80/20</h3> <div class="paragraph"> <p>U većini aplikacija:</p> </div> <div class="ulist"> <ul> <li> <p><strong>80% операција</strong>su standardni CRUD → Supabase</p> </li> <li> <p><strong>20% operacija</strong>захтевају пословну логику → Spring Boot</p> </li> </ul> </div> <div class="paragraph"> <p>Ovo prirodno pravilo opravdava hibridnu arhitekturu.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE package "Distribucija operacija" { rectangle "80% - Standardne operacije" #LightGreen { [Lecture de données] [Création d'entités] [Mise à jour simple] [Suppression] [Upload fichiers] [Authentification] note bottom: **Géré par Supabase** } rectangle "20% - Poslovna logika" #Coral { [Calculs complexes] [Workflows multi-étapes] [Transactions critiques] [Intégrations tierces] [Jobs planifiés] note bottom: **Géré par Spring Boot** } } note right **Focus optimal :** Votre temps de développement concentré sur les 20% qui différencient votre produit end note @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak_završni">Zaključak završni</h2> <div class="sectionbody"> <div class="paragraph"> <p>Hibridna arhitektura nije tehnički kompromis, to je<strong>стратешка одлука</strong>.</p> </div> <div class="paragraph"> <p><strong>Omogućava vam da:</strong></p> </div> <div class="ulist"> <ul> <li> <p>✅ Покрени брзо са функционалним MVP</p> </li> <li> <p>✅ Проверити ваше тржиште без тешког улагања</p> </li> <li> <p>✅ Постепно развијај се када комплексност захтева</p> </li> <li> <p>✅ Kontrolirati vaše troškove u svakom koraku</p> </li> <li> <p>✅ Iskoristiti najbolje iz svake tehnologije</p> </li> <li> <p>Izbeći prematurno prekompleksiranje</p> </li> <li> <p>✅ Sačuvati fleksibilnost za budućnost</p> </li> </ul> </div> <div class="paragraph"> <p><strong>Она predstavlja:</strong></p> </div> <div class="ulist"> <ul> <li> <p>Sačuvaj sve kod sekvence unutar obrnuti navodnici (<code>…​</code>) tačno kao što je — nikad ne menjať sadržaj, razmak ili poziciju.</p> </li> </ul> </div> <div class="paragraph"> <p>Ovaj tekst može biti fragment veće rečenice — prevedi fragment bez zahtevanja dodatnog konteksta. Izlazni tekst samo prevedeni tekst — bez objašnjenja, komentarika, uvođenja, alternativa, opcija. 🎯<strong>Pragmatizam</strong>: Svaka tehnologija u kojoj izuzetno uspeva</p> </div> <div class="ulist"> <ul> <li> <p>🚀<strong>вeloцитет</strong>: Minimalno vreme ulaska na tržište</p> </li> <li> <p>💰<strong>економија</strong>: Troškovi usklađeni sa vrednošću</p> </li> <li> <p>🔮<strong>еволутивност</strong>: Архитектура која расте заједом са вама</p> </li> <li> <p>🛡️<strong>Robustnost</strong>Испитане и пouждане услуге</p> </li> </ul> </div> <div class="sect2"> <h3 id="_vaš_sledeći_korak">Vaš sledeći korak</h3> <div class="paragraph"> <p>Ako vam ova arhitektura govori, ovde je gde da započnete :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Kreirajte nalog Supabase</strong>(besplatno)</p> </li> <li> <p><strong>Ваша минимална шема података</strong></p> </li> <li> <p><strong>Подесите OAuth2 аудентификацију</strong></p> </li> <li> <p><strong>Kreirajte vašu prvu JBake stranicu koja konzumira API</strong></p> </li> <li> <p><strong>Разместите на GitHub Pages</strong></p> </li> </ol> </div> <div class="paragraph"> <p>Imat ćete funkcionalni MVP u<strong>nekoliko dana</strong>.</p> </div> <div class="paragraph"> <p>Spring Boot će doći naravno kada ga vi trebate. Ne prethodno.</p> </div> <hr> <div class="paragraph"> <p><strong>Hibridna arhitektura je umetnost da se izgradi tačno ono što je potrebno, kada je potrebno.</strong></p> </div> <div class="paragraph"> <p>Dobrog razvoja! 🚀</p> </div> <hr> <div class="paragraph"> <p><em>Поделите ваш članak ако мислите да може да помогне другим разработчицима дадонесу прави архитектонске одлуке.</em></p> </div> </div> </div> </div> https://cheroliv.com/blog/pilot-batch/0100_jbake_supabase_springboot_hybride_post.html Wed, 14 Jan 2026 00:00:00 +0000 blog/pilot-batch/0100_jbake_supabase_springboot_hybride_post.html <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title">vreme za čitanje : 12 minutes</div> <p>Umesto da birate između prostote Supabase i moći Spring Boot, zašto ne kombinišete oba? Otkri hibridnu arhitekturu koja koristi najbolje iz svake tehnologije.</p> </div> <div class="dlist"> <dl> <dt class="hdlist1">тик</dt> <dd> <p>[]</p> </dd> </dl> </div> </div> </div> <div class="sect1"> <h2 id="_lažna_dilema_moderne_arhitekture">Lažna Dilema Moderne Arhitekture</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pri izradi moderne aplikacije sa statičkim frontendom, često se suočavamo sa binarnim izborom:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Svesti se na rešenje Backend-as-a-Service</strong>(Supabase, Firebase) - jednostavno, ali ograničeno</p> </li> <li> <p><strong>Izgraditi jedan kompletan backend</strong>(Spring Boot, Node.js) - moćan ali kompleksan</p> </li> </ul> </div> <div class="paragraph"> <p>Ovaj izbor je lažni dilema. Hibridna arhitektura nudi treći put: <strong>koristiti svaku tehnologiju tamo gde izvrsno funkcionise</strong></p> </div> </div> </div> <div class="sect1"> <h2 id="_arhitektonska_vizija">Arhitektonska vizija</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_tradicionalna_arhitektura_monolitna">Tradicionalna arhitektura: Monolitna</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "традиционална архитектура" { actor Utilisateur as user component "Frontend" as frontend #LightBlue component "Monolitni backend" as backend #LightCoral { [Authentification] [CRUD] [Logique Métier] [Jobs] [APIs Tierces] } database "База података" as db #LightGray user --> frontend frontend --> backend : Toutes les requêtes backend --> db } note right of backend Tout passe par le backend même les opérations simples ⚠️ Point de congestion unique ⚠️ Complexité dès le départ ⚠️ Couplage fort end note @enduml</pre> </div> </div> <div class="paragraph"> <p>U ovom pristupu, čak i najjednostavnije operacije (čitanje članka, kreiranje komentara) moraju proći kroz vaš back‑end. Plaćate trošak kompleksnosti od prvog dana.</p> </div> </div> <div class="sect2"> <h3 id="_baas_arhitektura_svaki_delegat">BaaS arhitektura: Svaki delegat</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "Arhitektura BaaS čista" { actor Utilisateur as user component "Frontend" as frontend #LightBlue cloud "Supabase / Firebase" as baas #LightGreen { [Auth] [Database] [Storage] [Edge Functions] } user --> frontend frontend --> baas : Toutes les opérations } note right of baas Développement rapide Pas de serveur à gérer ⚠️ Limité pour logique complexe ⚠️ Vendor lock-in ⚠️ Edge Functions contraintes end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Naopako, sve delegiranje BaaS-u je na početku svodivo, ali brzo pokazuje svoje ograničenja kada se poslovna logika komplikuje.</p> </div> </div> <div class="sect2"> <h3 id="_hibridna_arhitektura_razdvojenje_odgovornosti">Hibridna arhitektura: razdvojenje odgovornosti</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle actor Utilisateur as user #LightBlue package "Prednji sloj" { component "Statički sajt JBake" as frontend #SkyBlue } package "Jednostavan sloj (Supabase)" #LightGreen { component "authentifikacija" as auth component "Основни CRUD" as crud component "Складиштење Фајлова" as storage component "Реално време" as realtime } package "Poslovni sloj (Spring Boot)" #Coral { component "Kompleksna Logika" as logic component "OrkeStracija" as orchestration component "zapplanirani jobovi" as jobs component "integracije" as integrations } database "PostgreSQL deljen" as db #LightGray user --> frontend frontend --> auth : OAuth2, JWT frontend --> crud : Articles, Profils frontend --> storage : Images, Fichiers frontend --> realtime : Notifications frontend --> logic : Calculs, Rapports frontend --> orchestration : Workflows logic --> integrations : Stripe, APIs orchestration --> db jobs --> db crud --> db auth --> db note bottom of db **Une seule source de vérité** Partagée entre Supabase et Spring Boot end note note right of auth **Gratuit jusqu'à 50k users** Configuration en quelques clics OAuth2 multi-providers end note note right of logic **Activé seulement si nécessaire** Kotlin + Coroutines Transactions complexes end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Hibridna arhitektura jasno razdvojuje odgovornosti po složenosti i prirodi operacija.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_principi_dizajna">Principi dizajna</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_princip_1_početi_jednostavno_razvijati_se_inteligentno">Princip 1: Početi jednostavno, razvijati se inteligentno</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "**Фаза 1 : MVP**" #LightGreen { component "JBake + Supabase" as mvp note right ✓ Développement en jours ✓ Coût : 0€ ✓ Validation concept end note } rectangle "**Faza 2 : Rast**" #LightYellow { component "JBake + Supabase + Spring Boot (opciono)" as growth note right ✓ Logique métier émerge ✓ Premiers jobs planifiés ✓ Intégrations tierces end note } rectangle "Faza 3 : Scale" #LightCoral { component "Kompletna arhitektura" as scale note right ✓ Orchestration complexe ✓ Performances optimisées ✓ Cache distribué end note } mvp -down-> growth : Quand la complexité\nle justifie growth -down-> scale : Optimisation\ncontinue @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Ne gradite Spring Boot ako vam nije potreban.</strong>Počnite sa Supabase, dodajte Spring Boot kada je to podloženo složnošću.</p> </div> </div> <div class="sect2"> <h3 id="_принцип_2_раздељење_према_природи_операције">Принцип 2 : Раздељење према природи операције</h3> <div class="listingblock"> <div class="content"> <pre>@startmindmap skinparam backgroundColor #FEFEFE * Opérations\nApplicatives left side ** Opérations Simples\n(Supabase) ***_ CRUD Standard ****_ Lecture ****_ Création ****_ Mise à jour ****_ Suppression ***_ Authentification ****_ Login/Logout ****_ OAuth2 ****_ Gestion session ***_ Stockage ****_ Upload fichiers ****_ CDN automatique ***_ Temps Réel ****_ WebSocket ****_ Notifications right side ** Opérations Complexes\n(Spring Boot) ***_ Logique Métier ****_ Calculs complexes ****_ Règles métier ****_ Validations avancées ***_ Orchestration ****_ Multi-services ****_ Transactions distribuées ****_ Saga patterns ***_ Tâches Planifiées ****_ Rapports périodiques ****_ Synchronisations ****_ Nettoyages ***_ Intégrations ****_ Paiements (Stripe) ****_ APIs tierces ****_ Services ML/AI @endmindmap</pre> </div> </div> </div> <div class="sect2"> <h3 id="_princip_3_jedini_izvor_istine">Princip 3: Jedini izvor istine</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE database "PostgreSQL" as db #LightGray { package "Shema: auth (Supabase)" #LightGreen { [users] [sessions] [identities] } package "Šema: javno (podeljeno)" #SkyBlue { [articles] [comments] [profiles] } package "Shema: biznis (Spring Boot)" #Coral { [orders] [payments] [reports] } } component "Supabase" as supabase #LightGreen component "Spring Boot" as spring #Coral supabase -down-> users : Gère supabase -down-> sessions : Gère supabase -down-> articles : Accède supabase -down-> comments : Accède supabase -down-> profiles : Accède spring -down-> articles : Accède spring -down-> profiles : Accède spring -down-> orders : Gère spring -down-> payments : Gère spring -down-> reports : Gère note right of db **Avantages :** • Pas de synchronisation complexe • JOINs possibles entre tables • Cohérence garantie • Migrations unifiées end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Koristeći istu PostgreSQL instancu, Supabase i Spring Boot rade na istim podacima bez kompleksne sinhronizacije.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_orkestracija_tokova">Orkestracija tokova</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_tok_1_centralizovana_autentifikacija">Tok 1: Centralizovana autentifikacija</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE autonumber actor "Корисник" as user participant "JBake" as jbake participant "Supabase Auth" as auth participant "Spring Boot" as spring database "PostgreSQL" as db == Authentification == user -> jbake : Clique "Prijavi se" jbake -> auth : Redirect OAuth2 (Google/GitHub) auth -> user : Consent screen user -> auth : Autorise auth -> auth : Génère JWT auth -> jbake : Retourne JWT + Refresh Token jbake -> jbake : Stocke tokens (sessionStorage) == Accès aux Ressources == group Opération Simple (CRUD) user -> jbake : Crée un article jbake -> db : POST avec JWT note right: Supabase Row Level Security\nvérifie le JWT automatiquement db -> jbake : Article créé end group Opération Complexe (Métier) user -> jbake : Génère un rapport jbake -> spring : POST /api/reports\navec JWT spring -> spring : Valide JWT Supabase spring -> spring : Extrait claims (user_id, roles) spring -> db : Requêtes complexes spring -> jbake : Rapport généré end note over auth, spring **Le JWT est universel** Valide par Supabase ET Spring Boot Pas de double authentification end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Ključna tačka</strong>Jedan proces autentifikacije, jedan JWT, koji se može koristiti svugde.</p> </div> </div> <div class="sect2"> <h3 id="_flux_2_orchestracija_kompleksnog_poslovnog_procesa">Flux 2 : Orchestracija kompleksnog poslovnog procesa</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE autonumber actor "Klijent" as user participant "JBake" as jbake participant "Spring Boot" as spring participant "Supabase DB" as supadb participant "Stripe API" as stripe participant "Usluga inventarisanja" as inventory participant "Servis e-pošte" as email database "PostgreSQL" as db user -> jbake : Passe commande jbake -> spring : POST /api/orders/create == Orchestration Spring Boot == spring -> db : BEGIN TRANSACTION par Vérifications Parallèles spring -> inventory : Vérifier stock inventory -> spring : Stock OK else spring -> db : Vérifier profil client db -> spring : Client vérifié end spring -> stripe : Créer Payment Intent stripe -> spring : Intent créé (ID: pi_xxx) spring -> db : Créer Order (status: PENDING) db -> spring : Order créé spring -> stripe : Confirmer paiement stripe -> spring : Paiement confirmé spring -> db : Update Order (status: PAID) spring -> inventory : Décrémenter stock spring -> db : COMMIT TRANSACTION par Notifications Asynchrones spring -> email : Email confirmation else spring -> supadb : Insert notification note right: Notification temps réel\nvia Supabase Realtime end spring -> jbake : Order confirmé jbake -> user : Affiche confirmation note over spring **Responsabilités Spring Boot :** • Transaction ACID • Orchestration multi-services • Rollback automatique si erreur • Gestion des cas limites end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Šta Spring Boot donosi</strong>Pouzdana orkestracija složenih procesa koji uključuju više sistema sa transakcionom garancijom.</p> </div> </div> <div class="sect2"> <h3 id="_tok_3_zakazani_poslovi_i_sinkronizacije">Tok 3: Zakazani poslovi i sinkronizacije</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE participant "Scheduler\n(Spring Boot)" as scheduler participant "Izveštajski Servis" as report participant "PostgreSQL" as db participant "vanjska API" as api participant "Сервис е-поште" as email participant "Supabase Storage" as storage == Job Quotidien : 2h00 == activate scheduler scheduler -> report : Déclenche génération rapport activate report report -> db : Récupère données\ndes dernières 24h db -> report : Dataset report -> report : Calculs & Agrégations report -> report : Génération PDF report -> storage : Upload PDF storage -> report : URL publique report -> email : Envoie aux admins\navec lien PDF deactivate report == Job Hebdomadaire : Dimanche 3h00 == scheduler -> report : Synchronisation externe activate report report -> api : Fetch données externes api -> report : Nouvelles données report -> db : Mise à jour tables report -> db : Nettoyage données obsolètes deactivate report == Job Mensuel : 1er du mois == scheduler -> report : Facturation activate report report -> db : Liste clients actifs report -> report : Calcul montants report -> api : Génération factures (Stripe) report -> email : Envoi factures deactivate report deactivate scheduler note right of scheduler **Impossible avec Supabase seul** Edge Functions non adaptées pour jobs longs et récurrents end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Šta pruža Spring Boot</strong>: Pouzdani zakazani poslovi sa upravljanjem stanjem, automatskim ponovnim pokretanjem i garantovanim izvršavanjem.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_matrica_odlucke">Matrica odlucke</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_kada_koristiti_supabase">Kada koristiti Supabase?</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE start :Nouvelle fonctionnalité à implémenter; if (CRUD simple ?) then (oui) :✅ **Supabase**; stop else (non) if (Authentification ?) then (oui) :✅ **Supabase Auth**; stop else (non) if (Upload fichiers ?) then (oui) :✅ **Supabase Storage**; stop else (non) if (Temps réel ?) then (oui) :✅ **Supabase Realtime**; stop else (non) if (Row Level Security\nsuffisante ?) then (oui) :✅ **Supabase + Policies**; stop else (non) :⚠️ **Considérer Spring Boot**; #Coral:Passer à l'arbre\nde décision Spring Boot; stop endif endif endif endif endif @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_kada_koristiti_spring_boot">Kada koristiti Spring Boot?</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE start :Nouvelle fonctionnalité complexe; if (Orchestration\nmulti-services ?) then (oui) :✅ **Spring Boot**; stop else (non) if (Transaction ACID\ncritique ?) then (oui) :✅ **Spring Boot**; stop else (non) if (Job planifié ?) then (oui) :✅ **Spring Boot Scheduler**; stop else (non) if (Intégration API\ntierce complexe ?) then (oui) :✅ **Spring Boot**; stop else (non) if (Calculs lourds\n> 10 secondes ?) then (oui) :✅ **Spring Boot**; stop else (non) if (Cache distribué\nnécessaire ?) then (oui) :✅ **Spring Boot + Redis**; stop else (non) :⚠️ **Probablement Supabase**; #LightGreen:Revenir à l'arbre\nde décision Supabase; stop endif endif endif endif endif endif @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_примери_архитектуре_према_типу_пројекта">Примери архитектуре према типу пројекта</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_blog_portfelj">Blog / Portfelj</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "Osobni blog - 95% Supabase" { component "JBake" as jbake #SkyBlue package "Supabase (Besplatno)" #LightGreen { [Auth: OAuth2 Google] [Articles (CRUD)] [Commentaires] [Images (Storage)] [Notifications Realtime] } package "Spring Boot (опционално)" #LightCoral { [Newsletter Mensuelle] note bottom: Job planifié uniquement } database "PostgreSQL" as db jbake --> [Auth: OAuth2 Google] jbake --> [Articles (CRUD)] jbake --> [Commentaires] jbake --> [Images (Storage)] jbake --> [Notifications Realtime] [Articles (CRUD)] --> db [Commentaires] --> db [Newsletter Mensuelle] --> db } note bottom of "Spring Boot (опционално)" **Spring Boot pas obligatoire** Newsletter peut être gérée par un service tiers (Mailchimp) end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>пресуда</strong>: 100% Supabase je sasvim dovoljno.</p> </div> </div> <div class="sect2"> <h3 id="_saas_aplikacija">SaaS aplikacija</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "SaaS aplikacija - hibridna arhitektura" { component "JBake / React" as frontend #SkyBlue package "Supabase" #LightGreen { [Auth Multi-tenant] [Profils Utilisateurs] [Données Simples] [Storage Documents] } package "Spring Boot" #Coral { [Facturation (Stripe)] [Analytics Avancées] [Rapports Mensuels] [Quotas & Limites] [Webhooks Stripe] } cloud "Eksterne usluge" { [Stripe API] [SendGrid Email] } database "PostgreSQL deljen" as db frontend --> [Auth Multi-tenant] frontend --> [Profils Utilisateurs] frontend --> [Données Simples] frontend --> [Facturation (Stripe)] frontend --> [Analytics Avancées] [Auth Multi-tenant] --> db [Profils Utilisateurs] --> db [Données Simples] --> db [Facturation (Stripe)] --> db [Facturation (Stripe)] --> [Stripe API] [Analytics Avancées] --> db [Rapports Mensuels] --> db [Rapports Mensuels] --> [SendGrid Email] [Webhooks Stripe] ..> [Stripe API] : Écoute } note right of "Spring Boot" **Nécessaire pour :** • Gestion abonnements • Facturation récurrente • Quotas dynamiques • Analytics complexes • Webhooks fiables end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Presuda</strong>: Hibridna arhitektura je potrebna. Supabase za osnovno, Spring Boot za kritični deo (plaćanja, fakturiranje).</p> </div> </div> <div class="sect2"> <h3 id="_e_trgovina">e-trgovina</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "E-trgovina - 70% Spring Boot" { component "Витрина (JBake/React)" as frontend #SkyBlue package "Supabase" #LightGreen { [Auth Clients] [Catalogue Produits\n(lecture seule)] [Images Produits] } package "Spring Boot (Основни пословни део)" #Coral { [Gestion Commandes] [Paiements Stripe] [Gestion Stock] [Calcul Frais Port] [Génération Factures] [Synchronisation ERP] [Emails Transactionnels] } cloud "Integracije" { [Stripe] [Transporteur API] [ERP Externe] } database "PostgreSQL" as db frontend --> [Auth Clients] frontend --> [Catalogue Produits\n(lecture seule)] frontend --> [Gestion Commandes] [Auth Clients] --> db [Catalogue Produits\n(lecture seule)] --> db [Gestion Commandes] --> db [Paiements Stripe] --> [Stripe] [Gestion Stock] --> db [Calcul Frais Port] --> [Transporteur API] [Génération Factures] --> db [Synchronisation ERP] --> [ERP Externe] [Synchronisation ERP] --> db } note right of "Spring Boot (Основни пословни део)" **Spring Boot indispensable :** • Transactions critiques • Orchestration complexe • Intégrations multiples • Conformité légale • Jobs de synchronisation end note @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>пресуда</strong>Spring Boot neophodan. Supabase samo za auth i katalog.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_strategija_progresivne_migracije">Strategija progresivne migracije</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE |Semaine 1-2| start :Créer projet Supabase; :Configurer Auth (Google, GitHub); :Définir schéma PostgreSQL initial; :Implémenter CRUD de base sur JBake; :Déployer MVP sur GitHub Pages; note right **Livrable :** Application fonctionnelle **Coût :** 0€ **Temps :** 1-2 semaines end note |Semaine 3-4| :Observer utilisation réelle; :Identifier limitations; |Décision| if (Logique complexe\némerge ?) then (non) |Supabase| :Continuer avec Supabase seul; :Ajouter Edge Functions si besoin; stop else (oui) |Spring Boot| :Créer projet Spring Boot; :Configurer validation JWT Supabase; :Migrer logique complexe vers Spring Boot; note right **Migration sélective** Seulement ce qui est complexe end note endif |Semaines suivantes| :Déployer Spring Boot (Cloud Run, EC2); :Connecter à PostgreSQL Supabase; :Implémenter premiers jobs planifiés; :Intégrer APIs tierces; stop note right **Architecture finale hybride** Supabase + Spring Boot en parfaite harmonie end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_troškovi_i_operativna_razmatranja">Troškovi i operativna razmatranja</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_структура_трошкова">Структура трошкова</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE package "Procenjeni mesečni troškovi" { rectangle "Faza MVP\n(0-1000 korisnika)" #LightGreen { [JBake (GitHub Pages): 0€] [Supabase: 0€] [Spring Boot: N/A] note bottom: **Total: 0€/mois** } rectangle "Faza Rasta\n(1k-10k korisnici)" #LightYellow { [JBake (GitHub Pages): 0€] [Supabase: 0€] [Spring Boot (Cloud Run): 20-50€] [PostgreSQL (si séparé): 0-30€] note bottom: **Total: 20-80€/mois** } rectangle "Skala faze (10k-100k korisnika)" #LightCoral { [JBake (Netlify Pro): 19€] [Supabase Pro: 25€] [Spring Boot (instances multiples): 100-300€] [Redis Cache: 20-50€] [Monitoring: 20€] note bottom: **Total: 184-414€/mois** } } note right of "Skala faze (10k-100k korisnika)" À ce stade, les revenus justifient largement les coûts end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_operativne_odgovornosti">Operativne odgovornosti</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE package "Ko šta upravlja ?" { rectangle "Upravlja Supabase (0 napora)" #LightGreen { [Authentification] [Base de données] [Backups automatiques] [Scaling automatique] [Monitoring DB] [Sécurité DB] } rectangle "Upravlja GitHub (0 napora)" #SkyBlue { [Hébergement site statique] [HTTPS/SSL] [CDN global] [Déploiement automatique] } rectangle "Да се управља (Spring Boot)" #LightCoral { [Déploiement application] [Monitoring APM] [Logs centralisés] [Scaling horizontal] [Mises à jour sécurité] } } note bottom of "Да се управља (Spring Boot)" **Minimisable avec :** • Cloud Run (serverless) • Kubernetes (si nécessaire) • Services managés (RDS, etc.) end note @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak_savršeno_ravnoteža">Zaključak : Savršeno ravnoteža</h2> <div class="sectionbody"> <div class="paragraph"> <p>Hibridna arhitektura Supabase + Spring Boot nije kompromis, to je<strong>синергија</strong>.</p> </div> <div class="sect2"> <h3 id="_principi_koje_treba_zapamtiti">Principi koje treba zapamtiti</h3> <div class="listingblock"> <div class="content"> <pre>@startmindmap skinparam backgroundColor #FEFEFE * Architecture\nHybride ** Commencer Simple ***_ MVP avec Supabase ***_ 0€ de coût initial ***_ Validation rapide ** Évoluer Intelligemment ***_ Ajouter Spring Boot\nsi nécessaire ***_ Migration progressive ***_ Pas de refonte totale ** Exploiter les Forces ***_ Supabase: Simplicité ***_ Spring Boot: Puissance ***_ PostgreSQL: Source unique ** Minimiser la Complexité ***_ Pas de synchronisation ***_ Pas de duplication ***_ Architecture claire ** Optimiser les Coûts ***_ Gratuit au départ ***_ Scaling progressif ***_ ROI évident @endmindmap</pre> </div> </div> </div> <div class="sect2"> <h3 id="_kada_odabrati_ovu_arhitekturu">Kada odabrati ovu arhitekturu?</h3> <div class="paragraph"> <p><strong>✅ Ova arhitektura je idealna ako :</strong></p> </div> <div class="ulist"> <ul> <li> <p>Želite da pokrenete brzo (MVP u danima, ne u mesecima)</p> </li> <li> <p>Očekujete rast složenosti posla</p> </li> <li> <p>Želite da smanjite početne troškove</p> </li> <li> <p>Виолите PostgreSQL и желите један извор истине.</p> </li> <li> <p>Волите Kotlin и корутине за пословни код.</p> </li> <li> <p>Želite da spriječite potpuni vendor lock-in</p> </li> </ul> </div> <div class="paragraph"> <p><strong>❌ Ова архитектура НИЈЕ прилагођена ако:</strong></p> </div> <div class="ulist"> <ul> <li> <p>Vaš projekat je jednostavan i ostane Tako (lični blog → 100% Supabase dovoljno)</p> </li> <li> <p>Već imate uspostavljen backend stek koji kontrolisate</p> </li> <li> <p>Vi preferiš tradicionalni monolit</p> </li> <li> <p>Treba vam .NET, Python ili drugi backend jezik</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_finalna_globalna_vizija">Finalna globalna vizija</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE package "Potpun hibridna arhitektura" { actor "Korisnici" as users rectangle "Frontend (statički)" #SkyBlue { [JBake / GitHub Pages] note right: Gratuit, CDN global } rectangle "Jednostavni backend (Supabase)" #LightGreen { [Auth OAuth2] [CRUD APIs] [Storage] [Realtime] note right Gratuit jusqu'à 50k users Zéro configuration serveur end note } rectangle "Poslovni backend (Spring Boot)" #Coral { [Orchestration] [Jobs Planifiés] [Intégrations] [Transactions] note right Activé uniquement si nécessaire end note } database "PostgreSQL Jedinstveni izvor istine" as db #LightGray users --> [JBake / GitHub Pages] [JBake / GitHub Pages] --> [Auth OAuth2] [JBake / GitHub Pages] --> [CRUD APIs] [JBake / GitHub Pages] --> [Storage] [JBake / GitHub Pages] --> [Realtime] [JBake / GitHub Pages] --> [Orchestration] [Auth OAuth2] --> db [CRUD APIs] --> db [Orchestration] --> db [Jobs Planifiés] --> db [Intégrations] --> db } note bottom of db **Une seule base, deux consommateurs** • Supabase pour le simple • Spring Boot pour le complexe • Aucune synchronisation requise end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_najbolje_iz_oba_sveta">Najbolje iz oba sveta</h3> <div class="paragraph"> <p>Ova arhitektura vam daje :</p> </div> <div class="paragraph"> <p><strong>🚀 Vločnost Supabase</strong></p> </div> <div class="ulist"> <ul> <li> <p>Покретање у сатима, није у недељама</p> </li> <li> <p>OAuth2 autentifikacija u nekoliko klikova</p> </li> <li> <p>Automatski generisani REST API-ji</p> </li> <li> <p>Nulta konfiguracija servera</p> </li> </ul> </div> <div class="paragraph"> <p><strong>💪 моћ Spring Boot</strong></p> </div> <div class="ulist"> <ul> <li> <p>Kotlin и корутине за елегантан асинхронни код</p> </li> <li> <p>Orchestracija složenih poslovnih procesa</p> </li> <li> <p>Pouzdani zakazani poslovi</p> </li> <li> <p>Garantirane ACID transakcije</p> </li> <li> <p>Kompletan ekosistem Spring</p> </li> </ul> </div> <div class="paragraph"> <p><strong>💰 Progresivna Ekonomija</strong></p> </div> <div class="ulist"> <ul> <li> <p>0€ za pokretanje i validiranje</p> </li> <li> <p>Troškovi koji prate rast</p> </li> <li> <p>Не прематурано претерано инжењерство</p> </li> </ul> </div> <div class="paragraph"> <p><strong>🎯 Архитектонска флексибилност</strong></p> </div> <div class="ulist"> <ul> <li> <p>Progresivna migracija bez preoblikovanja</p> </li> <li> <p>Додавање Spring Boot само ако је потребно</p> </li> <li> <p>Нема укупног зависања од достављача</p> </li> <li> <p>Evolutivna arhitektura</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_даље">Даље</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_tehnički_resursi">Tehnički resursi</h3> <div class="paragraph"> <p><strong>Документација Supabase :</strong></p> </div> <div class="ulist"> <ul> <li> <p><a href="https://supabase.com/docs/guides/auth">Упутство за аудентификацију</a></p> </li> <li> <p><a href="https://supabase.com/docs/guides/database/postgres/row-level-security">Bezbednost na nivou redova</a></p> </li> <li> <p><a href="https://supabase.com/docs/guides/api">Automatski generisani API-ji</a></p> </li> </ul> </div> <div class="paragraph"> <p><strong>Документација Spring Boot :</strong></p> </div> <div class="ulist"> <ul> <li> <p><a href="https://spring.io/guides/tutorials/spring-boot-kotlin/">Spring Boot sa Kotlin</a></p> </li> <li> <p><a href="https://spring.io/blog/2019/04/12/going-reactive-with-spring-coroutines-and-kotlin-flow">Korutine i Spring</a></p> </li> <li> <p><a href="https://docs.spring.io/spring-security/reference/servlet/oauth2/resource-server/jwt.html">JWT server resursa</a></p> </li> </ul> </div> <div class="paragraph"> <p><strong>Додатни чланци :</strong></p> </div> <div class="ulist"> <ul> <li> <p>Zaštita API-ja sa JWT</p> </li> <li> <p>Optimizacija performansi PostgreSQL</p> </li> <li> <p>Uzorci progresivne migracije</p> </li> <li> <p>Upravljanje greškama u distribuiranoј архитектури</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_реални_случајеви_коришћења">Реални случајеви коришћења</h3> <div class="paragraph"> <p>Ova hibridna arhitektura se uspešno koristi u:</p> </div> <div class="ulist"> <ul> <li> <p><strong>SaaS B2B</strong>Supabase аутентификација, Spring Boot фактурисање</p> </li> <li> <p><strong>Tržišta</strong>: Katalog Supabase, transakcije Spring Boot</p> </li> <li> <p><strong>Platforme sadržaja</strong>: Статеји Supabase, analytics Spring Boot</p> </li> <li> <p><strong>Unutrašnji alati</strong>: CRUD Supabase, workflows Spring Boot</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_чек_лист_за_покретање">Чек-лист за покретање</h3> <div class="paragraph"> <p><strong>Faza 1 - Osnove (Nedelja 1)</strong></p> </div> <div class="ulist checklist"> <ul class="checklist"> <li> <p><i class="fa fa-square-o"></i> Kreirati Supabase nalog - [ ] Konfigurisati projekt PostgreSQL - [ ] Omogući Auth (Google, GitHub) - [ ] Definisati početnu šemu - [ ] Konfigurisati Row Level Security - [ ] Testirati API-ove iz JBake</p> </li> </ul> </div> <div class="paragraph"> <p><strong>Faza 2 - MVP (sedmica 2-3)</strong></p> </div> <div class="ulist checklist"> <ul class="checklist"> <li> <p><i class="fa fa-square-o"></i> Implementirati glavne stranice - [ ] Интегрирај OAuth2 аутентификацију - [ ] Kreirati obrasce CRUD - [ ] Konfigurisati Storage za datoteke - [ ] Razvrstaj na GitHub stranicama - [ ] Testirati u realnim uslovima</p> </li> </ul> </div> <div class="paragraph"> <p><strong>Faza 3 - evolucija (po potrebi)</strong></p> </div> <div class="ulist checklist"> <ul class="checklist"> <li> <p><i class="fa fa-square-o"></i> Identifikovati potrebe složene logike - [ ] Креирај пројекат Spring Boot ако је потребно - [ ] Postaviti validaciju JWT Supabase - [ ] Повежи се на PostgreSQL Supabase - [ ] Migrirati kompleksne funkcionalnosti - [ ] Implementirati zakazane poslove - [ ] Деплојовати Spring Boot (Cloud Run, итд.)</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_antipaterni_obrasci_koje_treba_da_se_izbegnu">Antipaterni obrasci koje treba da se izbegnu</h3> <div class="paragraph"> <p><strong>❌ Ne praviti :</strong></p> </div> <div class="ulist"> <ul> <li> <p>Duplicirati podatke između Supabase i Spring Boot</p> </li> <li> <p>Kreirati dve odvojene PostgreSQL baze podataka</p> </li> <li> <p>Kodirajte autentifikaciju sami</p> </li> <li> <p>Koristiti Spring Boot za jednostavno CRUD</p> </li> <li> <p>Prehitektovanjе od samog početka</p> </li> <li> <p>Ignorisati Row Level Security Supabase-a</p> </li> </ul> </div> <div class="paragraph"> <p><strong>Радити уместо:</strong></p> </div> <div class="ulist"> <ul> <li> <p>Deliti jedinu PostgreSQL bazu</p> </li> <li> <p>Neka Supabase rukuje autentifikacijom</p> </li> <li> <p>Користити Spring Boot само због сложености</p> </li> <li> <p>Početi jednostavno, napredovati postupno</p> </li> <li> <p>Iskoristiti snage svake tehnologije</p> </li> <li> <p>Zaštiti na nivou baze podataka pomoću RLS</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_perspektive_evolucije">Perspektive evolucije</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_dodavanje_novih_mogućnosti">Dodavanje novih mogućnosti</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "Савремена архитектура" #SkyBlue { [JBake] [Supabase] [Spring Boot] } rectangle "Moguće evolucije" #LightYellow { package "Извршност" { [Redis Cache] [CDN pour Assets] [PostgreSQL Replicas] } package "Мониторинг" { [Grafana] [Prometheus] [Sentry] } package "CI/CD" { [GitHub Actions] [Tests Automatisés] [Déploiement Continu] } package "Особности" { [Search (ElasticSearch)] [Queue (RabbitMQ)] [Event Sourcing] } } [Spring Boot] .down.> [Redis Cache] : Peut ajouter [Spring Boot] .down.> [Queue (RabbitMQ)] : Peut ajouter [Spring Boot] .down.> [Search (ElasticSearch)] : Peut ajouter [Supabase] .down.> [PostgreSQL Replicas] : Peut ajouter note bottom **Architecture extensible** Chaque ajout est indépendant Pas de refonte globale nécessaire end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_horizontalno_skaliranje">Horizontalno skaliranje</h3> <div class="paragraph"> <p>Kada vaša aplikacija raste, hibridna arhitektura se naturalno skalira :</p> </div> <div class="paragraph"> <p><strong>Supabase :</strong></p> </div> <div class="ulist"> <ul> <li> <p>Автоматски скалирајте до милиона операција</p> </li> <li> <p>Read replicas za performanse čitanja</p> </li> <li> <p>Point-in-time recovery за безбедност</p> </li> </ul> </div> <div class="paragraph"> <p><strong>Spring Boot :</strong></p> </div> <div class="ulist"> <ul> <li> <p>Više instanci iza balančera opterećenja</p> </li> <li> <p>Bezstanarno projektovanje olakošava horizontalno skaliranje</p> </li> <li> <p>Kubernetes za orkestraciju ako je potrebno</p> </li> </ul> </div> <div class="paragraph"> <p><strong>PostgreSQL :</strong></p> </div> <div class="ulist"> <ul> <li> <p>Partitioning za velike tabele</p> </li> <li> <p>Grupisanje veza (PgBouncer)</p> </li> <li> <p>Sharding ako zapravo neophodan (retko)</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_arhitektonska_svjedočanstva">Arhitektonska svjedočanstva</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_startup_saas_50k_korisnika">Startup SaaS (50k korisnika)</h3> <div class="paragraph"> <p>(Empty output) Pokrenuli smo 100% Supabase. Pri 5k korisnika, dodali smo Spring Boot samo za Stripe fakturaciju i mesečne izveštaje. Jedna godina kasnije, 80% naših operacija i dalje prolazi kroz Supabase. Spring Boot upravlja samo kritičnim delom. Ovo razdvajanje nam je omogućilo da skaliramo bez redesigna. </think></p> </div> </div> <div class="sect2"> <h3 id="_е_лернинг_платформа_10k_корисника">Е-лернинг платформа (10k корисника)</h3> <div class="paragraph"> <p><em><em>_ OAuth2 autentifikacija Supabase nam je uštedela tri nedelje razvoja. Automatski generisani API-ji upravljaju celim naшим katalogom kursova. Spring Boot služi samo za PDF sertifikate i e-mailove o napretku. Jednostavna, održiva i skalabilna arhitektura. </em>_</em></p> </div> </div> <div class="sect2"> <h3 id="_tržište_b2b_3k_korisnika">Tržište B2B (3k korisnika)</h3> <div class="paragraph"> <p><em>__</em> Spring Boot upravlja transakcijama između kupuvaca i prodavaca (kritično). Supabase upravlja svim ostalim: profili, poruke u realnom vremenu, dokumenti. Fakt da deliju istu PostgreSQL bazu nam sprečava kompleksnu sinhronizaciju. Najbolji arhitektonski izbor koji smo učinili. </think> </think> </think> </think></p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_синтеза_модерни_архитектонски_парадигма">Синтеза : модерни архитектонски парадигма</h2> <div class="sectionbody"> <div class="paragraph"> <p>Hibridna arhitektura Supabase + Spring Boot predstavlja novi paradigam :<strong>arhitektonska specijalizacija</strong>.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE rectangle "Stari paradigma" #LightCoral { card "Sve u Backendu" { [Auth] [CRUD] [Logique Métier] [Jobs] [Storage] [Realtime] } note bottom Complexité maximale dès le jour 1 end note } rectangle "Нов пародигма" #LightGreen { card "Supabase (Pogodnost)" { [Auth] [CRUD Simple] [Storage] [Realtime] } card "Spring Boot\n(Razlikovanje)" { [Logique Métier] [Jobs] [Intégrations] } note bottom Complexité progressive ajoutée seulement si nécessaire end note } [Ancien Paradigme] -right-> [Nouveau Paradigme] : Évolution @enduml</pre> </div> </div> <div class="paragraph"> <p><strong>Osnovni princip:</strong>Ne gradite ono što već postoji u obliku usluge. Fokusirajte se na ono što razlikuje vašu aplikaciju.</p> </div> <div class="sect2"> <h3 id="_правило_8020">Правило 80/20</h3> <div class="paragraph"> <p>U većini aplikacija:</p> </div> <div class="ulist"> <ul> <li> <p><strong>80% операција</strong>su standardni CRUD → Supabase</p> </li> <li> <p><strong>20% operacija</strong>потребна је пословна логика → Spring Boot</p> </li> </ul> </div> <div class="paragraph"> <p>Ovo prirodno pravilo objašnjava hibridnu arhitekturu.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam backgroundColor #FEFEFE package "распоређивање операција" { rectangle "80% - Standardne operacije" #LightGreen { [Lecture de données] [Création d'entités] [Mise à jour simple] [Suppression] [Upload fichiers] [Authentification] note bottom: **Géré par Supabase** } rectangle "20% - Poslovna logika" #Coral { [Calculs complexes] [Workflows multi-étapes] [Transactions critiques] [Intégrations tierces] [Jobs planifiés] note bottom: **Géré par Spring Boot** } } note right **Focus optimal :** Votre temps de développement concentré sur les 20% qui différencient votre produit end note @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konačan_zaključak">Konačan zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Hibridna arhitektura nije tehnički kompromis, to je<strong>strategijska odluka</strong>.</p> </div> <div class="paragraph"> <p><strong>Omogućava vam da:</strong></p> </div> <div class="ulist"> <ul> <li> <p>✅ Pokreniti brzo sa funkcionalnim MVP-om</p> </li> <li> <p>✅ Potvrdite svoje tržište bez teških ulaganja</p> </li> <li> <p>✅ Постепено развијај се када сложеност захтева</p> </li> <li> <p>✅ Kontroliši svoje troškove u svakom koraku</p> </li> <li> <p>✅ Korisiti najbolje od svake tehnologije</p> </li> <li> <p>✅ Izbegavati prematurno prekomerno inženjerstvo</p> </li> <li> <p>✅ Зачувати fleksibilnost za budućnost</p> </li> </ul> </div> <div class="paragraph"> <p><strong>Она представља:</strong></p> </div> <div class="ulist"> <ul> <li> <p>🎯<strong>pragmatizam</strong>Svaka tehnologija u kojoj izrinjuje</p> </li> <li> <p>🚀<strong>Brzina</strong>: minimalno vreme do tržišta</p> </li> <li> <p>💰<strong>Економија</strong>: Troškovi usklajeni sa vrednošću</p> </li> <li> <p>🔮<strong>Скалерност</strong>Arhitektura koja raste sa vama</p> </li> <li> <p>🛡️<strong>jačost</strong>: проверене и pouzdане услуге</p> </li> </ul> </div> <div class="sect2"> <h3 id="_ваш_следећи_корак">Ваш следећи корак</h3> <div class="paragraph"> <p>Ako vam ova arhitektura govori, ovde je gde da počnete :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Kreirajte nalog Supabase</strong>(besplatno)</p> </li> <li> <p><strong>Определите свој минимална шема података</strong></p> </li> <li> <p><strong>Настројите OAuth2 аутентификацију</strong></p> </li> <li> <p><strong>Napravite svoju prvu JBake stranicu koja koristi API</strong></p> </li> <li> <p><strong>Примењите на GitHub Pages</strong></p> </li> </ol> </div> <div class="paragraph"> <p>Imat ćete funkcionalni MVP u<strong>неколико дана</strong>.</p> </div> <div class="paragraph"> <p>Spring Boot će se pojaviti prirodno kad ga budete potrebovali. Ne pre toga.</p> </div> <hr> <div class="paragraph"> <p><strong>Hibridna arhitektura je umetnost da se konstruiše tačno što je potrebno, kad je potrebno.</strong></p> </div> <div class="paragraph"> <p><em>Srećan razvoj! 🚀</em></p> </div> <hr> <div class="paragraph"> <p><em>Podijelite ovaj članak ako mislite da može pomoći drugim programerima da donose pravilne arhitekturnе odluke.</em></p> </div> </div> </div> </div> https://cheroliv.com/blog/2025/0098_preloading_css_variable_post.html Sat, 15 Nov 2025 00:00:00 +0000 blog/2025/0098_preloading_css_variable_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_sažetak">Sažetak</a></li> <li><a href="#_problem_ovo_prokletog_mirganja_teme">Problem: Ovo prokletog mirganja teme</a> <ul class="sectlevel2"> <li><a href="#_кошмар_за_корисничко_искуство">Кошмар за корисничко искуство</a></li> <li><a href="#_fouc_stari_problem_na_webu">FOUC: Stari problem na webu</a></li> <li><a href="#_uticaj_na_percepciju_kvalitete">Uticaj na percepciju kvalitete</a></li> <li><a href="#_tehnička_analiza_problema">Tehnička analiza problema</a></li> </ul> </li> <li><a href="#_zašto_klasički_skript_nije_dovoljan">Zašto klasički skript nije dovoljan?</a> <ul class="sectlevel2"> <li><a href="#_intuitivni_pristup_ali_neefikasan">Intuitivni pristup ali neefikasan</a></li> <li><a href="#_разумевање_догађаја_domcontentloaded">Разумевање догађаја DOMContentLoaded</a></li> <li><a href="#_проблема_блокирања_рендеринга">Проблема блокирања рендеринга</a></li> <li><a href="#_визуализација_проблема">Визуализација проблема</a></li> <li><a href="#_neefikasni_pokušaji_rešenja">Neefikasni pokušaji rešenja</a></li> <li><a href="#_pravi_rešenje_delovati_ranije">Pravi Rešenje : Delovati ranije</a></li> </ul> </li> <li><a href="#_решење_предремено_заређивање_early_loading">Решење : Предремено заређивање (Early Loading)</a> <ul class="sectlevel2"> <li><a href="#_osnovni_princip">Osnovni princip</a></li> <li><a href="#_zašto_je_head_idealno_mesto">Zašto je <code><head></code> idealno mesto</a></li> <li><a href="#_архитектура_решения_у_три_слоя">Архитектура решения у три слоя</a></li> </ul> </li> <li><a href="#_korak_1_čuvanje_izbora_korisnika">Korak 1: Čuvanje izbora korisnika</a> <ul class="sectlevel2"> <li><a href="#_localstorage_vaša_stalna_memorija">localStorage : Vaša stalna memorija</a></li> <li><a href="#_implementacija_čuvanja_teme">Implementacija čuvanja teme</a></li> <li><a href="#_upravljanje_slučajevima_greške">Upravljanje slučajevima greške</a></li> <li><a href="#_napredne_strategije_perzistencije">Napredne strategije perzistencije</a></li> </ul> </li> <li><a href="#_korak_2_skript_prethodnog_učitavanja_unutar_head">Korak 2 : Skript prethodnog učitavanja unutar `<head></a> <ul class="sectlevel2"> <li><a href="#_srce_rešenja">Srce rešenja</a></li> <li><a href="#_anatomija_skripte_svaka_linija_važi">Anatomija skripte: Svaka linija važi</a></li> <li><a href="#_detekcija_preferencija_sistema_bonus">Detekcija preferencija sistema (Bonus)</a></li> <li><a href="#_performance_zašto_je_ovo_skript_brzo">Performance : Zašto je ovo skript brzo</a></li> <li><a href="#_optimalno_postavljanje_u_head">Optimalno postavljanje u `<head></a></li> </ul> </li> <li><a href="#_korak_3_snaga_css_selektora_atributa">Korak 3: Snaga CSS selektora atributa</a> <ul class="sectlevel2"> <li><a href="#_sistem_teme_bootstrap_5">Sistem teme Bootstrap 5</a></li> <li><a href="#_css_struktura_za_sistem_teme">CSS struktura za sistem teme</a></li> </ul> </li> </ul> </div> <div class="sect1"> <h2 id="_sažetak">Sažetak</h2> <div class="sectionbody"> <div class="paragraph"> <p>U ovom detaljnom tehničkom članku istražujemo kako implementirati izabir teme (light/dark) bez neprijatnog efekta mrkanja koji se javlja prilikom učitavanja stranice. Detaljno analiziramo ciklus renderovanja pretraživača, dubokе uzroke FOUC-a (Flash of Unstyled Content) i predlažemo robustno rešanje temeljno na sinkronom prethodnom učitanju u`<head>`. Ova tehnika osigurava glatko i profesionalno iskustvo korisnika.</p> </div> </div> </div> <div class="sect1"> <h2 id="_problem_ovo_prokletog_mirganja_teme">Problem: Ovo prokletog mirganja teme</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_кошмар_за_корисничко_искуство">Кошмар за корисничко искуство</h3> <div class="paragraph"> <p>Pretpostavite scenu: provedli ste sate da dizajnirate prekrasnu tamnu temu za vašu web aplikaciju. Boje su savršeno ubalansirane, kontrast je optimalan, a vaši korisnici vole ovu opciju. Ali postoji sramotan problem: pri svakom ponovnom učitavanju stranice, tokom frakcije sekunde, prikazuje se podrazumevana svetla tema pre nego što tema tamna preuzme kontrolu.</p> </div> <div class="paragraph"> <p>Ova vizuelna „blikavica“, iako kratka (ponekad manje od 100ms), odmah je primetljiva ljudskom oku i stvara neprijatno iskustvo. Za korisnike koji su izabrali tamu tema iz razloga vizuelnog komforta ili pristupačnosti, ovaj blik može biti i bolestan, naročito u slabo osvetljenom okruženju.</p> </div> </div> <div class="sect2"> <h3 id="_fouc_stari_problem_na_webu">FOUC: Stari problem na webu</h3> <div class="paragraph"> <p>Ovaj fenomen je varijanta onog što se naziva "Flash of Unstyled Content" (FOUC), klasicni problem u razvoju web-a koji se vodi u ranim danima CSS-a. FOUC se pojavljuje kada pregledač privremeno prikaže HTML sadržaj bez primijenjenih CSS stilova, stvarajući bljesak nesstilizovanog sadržaja.</p> </div> <div class="paragraph"> <p>U našem specifičnom slučaju ne govorimo o potpuno ne stilizovan sadržaju, već o<strong>Isbljek pogrešne teme</strong>(FOWT) - sadržaj je oblikovan, ali sa lošom temom. To je posebno frustrirajuće jer pokazuje da naša aplikacija "zaboravi" korisnikov preference pri svakom učitavanju stranice.</p> </div> </div> <div class="sect2"> <h3 id="_uticaj_na_percepciju_kvalitete">Uticaj na percepciju kvalitete</h3> <div class="paragraph"> <p>Ovaj problem, iako je tehnički, ima važna posledica na percepciju kvaliteta vaše aplikacije :</p> </div> <div class="paragraph"> <p><strong>Nedostatak poliranja</strong>: Migotanje dava utisak da je aplikacija nedovršena ili loše optimizovana. Korisnici često povezivaju ove male vizuelne greške sa nedostatkom opšte profesionalnosti.</p> </div> <div class="paragraph"> <p><strong>Prekid koherencije</strong>: Апликација каж да "заборавља" корисничке поставке, стварајући осет десинхронизације међу интерфесом и очекиванияма</p> </div> <div class="paragraph"> <p><strong>Vizuelna umora</strong>: Za korisnike osjetljive na svetlo ili koji patnje od migrene, ovaj svetlosni blisk može biti više nego samo estetski nezgodnost.</p> </div> <div class="paragraph"> <p><strong>Перцепција перформани</strong>Ironično, čak i ako vaš sajt brzo se učitava, ovaj mrgudanje može dati utisak da je aplikacija spora ili neodgovarajuća.</p> </div> </div> <div class="sect2"> <h3 id="_tehnička_analiza_problema">Tehnička analiza problema</h3> <div class="paragraph"> <p>Da bi razumeli kako rešiti ovaj problem, prvo treba da razumemo zašto se pojavljuje. Treptanje se pojavljuje zbog vremenskog odmaka između tri kritična događaja u životnom ciklusu jedne web stranice:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Početno parsiranje HTML-a</strong>: Прегледач чита и анализира структуру ваше странице</p> </li> <li> <p><strong>Примена CSS стилова</strong>Preglednik primenjuje CSS pravila i izračunava vizuelni prikaz</p> </li> <li> <p><strong>Izvršenje JavaScripta</strong>Vaš kod koji menja temu se izvršava</p> </li> </ol> </div> <div class="paragraph"> <p>Problema nastaje kada se dogadaj broj 3 (izvršavanje JavaScripta) desava nakon što je preglednik već počeo ili završio dogadaj broj 2 (primenjivanje stilova). U tom trenutku, preglednik je već donuo odluku koja tema će biti prikazana, a vaš kod dolazi previše kasno da utice na to pre prvog prikaza.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zašto_klasički_skript_nije_dovoljan">Zašto klasički skript nije dovoljan?</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_intuitivni_pristup_ali_neefikasan">Intuitivni pristup ali neefikasan</h3> <div class="paragraph"> <p>Najprirodniji pristup za programera bi bio da se skript postavi na kraju našeg.`<body>`Ovaj pristup sledi tradicionalne najbolje prakse veba koje preporučuju da se skripte učitavaju na kraju stranice da ne blokiraju renderovanje.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">// À la fin de <body> - L'APPROCHE INSUFFISANTE document.addEventListener('DOMContentLoaded', () => { const theme = localStorage.getItem('preferred-theme'); if (theme === 'dark') { document.documentElement.setAttribute('data-bs-theme', 'dark'); } });</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj pristup čini se logičnim na prvi pogled. Čekamo da DOM bude spreman, zatim primenjujemo temu. Jednostavno, ne? Nažalost, jednostavnost skriva temeljni grešak povezan sa timingu ciklusa renderovanja pretraživača.</p> </div> </div> <div class="sect2"> <h3 id="_разумевање_догађаја_domcontentloaded">Разумевање догађаја DOMContentLoaded</h3> <div class="paragraph"> <p>Догађај`DOMContentLoaded`покреће се када је првобитни HTML документ потпуно учитаван и анализиран од стране прегледача,<strong>bez čekanja</strong>kraj učitavanja stilova, slika i podokvira. To je važna tačka koju treba razumeti.</p> </div> <div class="paragraph"> <p>Evo tipične sekvence događaja:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Прегледник počinje da preuzima HTML</p> </li> <li> <p>On analizira HTML dok se prima</p> </li> <li> <p>On otkriva oznake`<link>`za CSS i počinje da ih preuzima</p> </li> <li> <p>Он открије ознаке`<script>`i izvršava ih (na osnovu njihovog tipa i atributa)</p> </li> <li> <p>Gradi DOM (Document Object Model)</p> </li> <li> <p><strong>Događaj <code>DOMContentLoaded</code> se pokreće</strong></p> </li> <li> <p>On nastavlja da primenjuje stilove i radi layout</p> </li> <li> <p>Prvi paint (prikaz) se dešava</p> </li> <li> <p>Događaj`load`pokreće se kada su svi resursi učitani</p> </li> </ol> </div> <div class="paragraph"> <p>Problem ? Medu korakom 6 (DOMContentLoaded) i korakom 8 (prvi paint), pregledač je već donio odluke o tome kako da prikaže stranu. Ako vaš skript za promenu teme izvrši se na koraku 6, već je kasno da se izbegne prvi prikaz sa zadanim stilovima.</p> </div> </div> <div class="sect2"> <h3 id="_проблема_блокирања_рендеринга">Проблема блокирања рендеринга</h3> <div class="paragraph"> <p>U stvari, vremenski raspored je još kompleksniji. Moderni pretraživači koriste sofisticirane tehnike optimizacije da poboljšaju percepcionu performanse. Pokušavaju da učine prvo bojanje sadržaja (First Contentful Paint) što je moguće brže da korisnik vidi nešto na ekranu.</p> </div> <div class="paragraph"> <p>CSS-ovi su po defaultu "render-blocking", što znači da pretraživač čeka da skinuo i parsira stilove pre nego što uradi prvo crtanje. Logično: ne želimo da prikažemo ne stilizovan sadržaj.</p> </div> <div class="paragraph"> <p>Ali ovde je kap: kada pretraživač primeni ove CSS stilove za prvi put, on to radi na osnovu trenutnog stanja DOM-a. Ako atribut`data-bs-theme`Još nije definisan na etiketi`<html>`, pretraživač će primeniti podrazumevane stilove (obično svetla tema).</p> </div> <div class="paragraph"> <p>Zatim, kada vaš skript se izvrši i promeni ovaj atribut, pretraživač mora:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Прерачунати све стилове које је променела ова промена</p> </li> <li> <p>Понови лајоут ако је потребно</p> </li> <li> <p>Prebojati oštećeni elementi</p> </li> </ol> </div> <div class="paragraph"> <p>Ovaj proces ponovnog računanja i ponovnog bojenja jeste onaj što izaziva vidljivo mrskanje.</p> </div> </div> <div class="sect2"> <h3 id="_визуализација_проблема">Визуализација проблема</h3> <div class="paragraph"> <p>Da bolje razumemo ovu problematičnu sekvencu, pogledajmo detalljan dijagram sekvence:</p> </div> <div id="diag-flux-incorrect" class="listingblock"> <div class="content"> <pre>@startuml actor Utilisateur participant Navigateur participant "Parser HTML" as Parser participant "CSSOM" as CSS participant "Script.js (kraj tela)" as Script participant "Mehanizam renderovanja" as Render Utilisateur -> Navigateur: Demande la page activate Navigateur Navigateur -> Parser: Parse le HTML activate Parser Parser -> CSS: Découvre et charge les CSS activate CSS Parser -> Parser: Construit le DOM Parser -> Navigateur: DOM Ready (DOMContentLoaded) deactivate Parser CSS -> CSS: Parse les feuilles de style CSS -> Render: CSSOM Ready deactivate CSS activate Render Render -> Render: Calcule les styles avec data-bs-theme=""note right: Подразумеваема тема (light) Render -> Navigateur: Premier Paint (Светла тема) note right: Корисник види светлу тему deactivate Render Navigateur -> Script: Изврши скрипт activate Script Script -> Script: Чита localStorage Script -> Navigateur: `setAttribute('data-bs-theme', 'dark')` deactivate Script activate Render Render -> Render: Прерачунај стилове са `data-bs-theme="dark" note right: Thème sombre Render -> Navigateur: Repaint (Thème Sombre) note right: Clignotement visible deactivate Render deactivate Navigateur @enduml</pre> </div> </div> <div class="paragraph"> <p>Ovaj dijagram jasno ilustruje problem: prvi paint se dešava pre nego što je naš skript imao priliku da definiše pravu temu. Sledeći repaint stvara vidljiv blinkanje.</p> </div> </div> <div class="sect2"> <h3 id="_neefikasni_pokušaji_rešenja">Neefikasni pokušaji rešenja</h3> <div class="paragraph"> <p>Pokušalo je više pristupa da se reši ovaj problem, ali većina njih ima sopstvene nedostatke:</p> </div> <div class="paragraph"> <p><strong>Приступ 1 : Сакривати садржај док се не учита</strong></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">body { opacity: 0; transition: opacity 0.3s; } body.loaded { opacity: 1; }</code></pre> </div> </div> <div class="paragraph"> <p>Овај приступ сакрива сав садржај док JavaScript не подеси правилу теме. Проблем? Ово искуштвено одлага приказ садржаја, дający утисак да је сајт спорији. Додатно, ако је JavaScript онемогућен, корисник не види ништа уопште!</p> </div> <div class="paragraph"> <p><strong>Prilazak 2: Korišćenje loader/spinner</strong></p> </div> <div class="paragraph"> <p>Similiran je pristup 1, ali sa spinnerom za učitavanje. To sakriva problem, ali ne poboljšava stvarnu performanse i dodaje nepotrebno perceprano kašnjenje.</p> </div> <div class="paragraph"> <p><strong>Приступ 3 : подразумевана тема у тмони</strong></p> </div> <div class="paragraph"> <p>Neki programeri definišu temnu temu kao podrazumevano u CSS-u. Ovo sprečava treperenje za korisnike temne teme, ali pravi obrnuti problem za korisnike svetle teme!</p> </div> <div class="paragraph"> <p>Ни једна од ових приступа није задоволљива јер лече симптом уместо основног узроцa проблема.</p> </div> </div> <div class="sect2"> <h3 id="_pravi_rešenje_delovati_ranije">Pravi Rešenje : Delovati ranije</h3> <div class="paragraph"> <p>Ključ za rešavanje ovog problema je da budemo svesni da moramo da definišemo atribut`data-bs-theme` <strong>пре</strong>da pregledač ne počne da primenjuje CSS stilove. Ovo znači da nas skripta mora da se izvrši ranije u životnom ciklusu stranice, i to je tačno što ćemo istražiti u sledećoj sekciji.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_решење_предремено_заређивање_early_loading">Решење : Предремено заређивање (Early Loading)</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_osnovni_princip">Osnovni princip</h3> <div class="paragraph"> <p>Elegantno rešenje naše problema sa miricanjem se temelji na jednostavnom, ali jakom principe :<strong>Synchronizuj stanje aplikacije sa procesom renderovanja pregledača.</strong>. Umesto da čekamo da se stranica učita da bismo postavili temu, moramo je postaviti<strong>dok</strong>učitavanje, još pre nego što se stilovi CSS primene</p> </div> <div class="paragraph"> <p>Ovaj se pristup naziva "Early Loading" ili "Synchronous Preloading" u žargonu web razvoja. Ideja je izvršiti našu logiku detekcije teme što je moguće ranije u životnom ciklusu stranice, idealno u etiketi`<head>`, пре него што прегледник започне да скачива CSS датотеке.</p> </div> </div> <div class="sect2"> <h3 id="_zašto_je_head_idealno_mesto">Zašto je <code><head></code> idealno mesto</h3> <div class="paragraph"> <p>Le `<head>`HTML dokument se obradjuje sekvencijalno pretraživačem, od gore prema dolje. Svaki element se obrađuje u redu u kojemu se pojavljuje. Ova karakteristika je ključna za naše rešenje.</p> </div> <div class="paragraph"> <p>Kada pretraživač naiđe na oznaku`<script>`у`<head>`bez atributa`async` ou <code>defer</code>, il :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Prekini parsiranje HTML-a</strong></p> </li> <li> <p><strong>Preuzmi skriptu</strong>(ako je eksterno) ili krevet (ako je inline)</p> </li> <li> <p><strong>Изврши скрипту одмах</strong></p> </li> <li> <p><strong>Nastavi parsiranje HTML</strong></p> </li> </ol> </div> <div class="paragraph"> <p>Ovo ponašanje, koje se često smatra problemom performansi (iz kog razloga je uobičajena preporuka da se skriptovi postavljaju na dnu stranice), postaje naš saveznik u ovom specifičnom slučaju. Postavljanjem našeg skripta za detekciju teme na početku`<head>`, garantujemo da se izvrši pre nego što pretraživač naiđe na oznake`<link>`naših stilova.</p> </div> </div> <div class="sect2"> <h3 id="_архитектура_решения_у_три_слоя">Архитектура решения у три слоя</h3> <div class="paragraph"> <p>Naše kompletno rešenje se sastoji od tri međuzavisne sloja, svaki od njih igra specijalnu ulogu:</p> </div> <div class="paragraph"> <p><strong>Слой 1: Постојаност (localStorage)</strong> Ovaj sloj je odgovoran za čuvanje i vraćanje izbora korisnika između sesija.</p> </div> <div class="paragraph"> <p><strong>Слој 2 : Рана синхронизација (убачен скрипт у <code><head></code>)</strong> Ovaj sloj sinhronizira stanje aplikacije sa DOM-om pre inicijalnog renderovanja.</p> </div> <div class="paragraph"> <p><strong>Слој 3 : Реактивни стилови (CSS са селекторима атрибута)</strong> Ovaj sloj definiše vizuelne stilove koji su zasnovani na stanju definisanom od strane sloja 2.</p> </div> <div class="paragraph"> <p>Sada detaljno istražujemo svaki sloj.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_korak_1_čuvanje_izbora_korisnika">Korak 1: Čuvanje izbora korisnika</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_localstorage_vaša_stalna_memorija">localStorage : Vaša stalna memorija</h3> <div class="paragraph"> <p>Le <code>localStorage`je Web Storage API koja omogućuje skladištenje parova ključ-vrednost u pretraživaču na trajani način. U suprotnosti od kolačića, podaci`localStorage</code>(Translation of empty string is empty string, so output nothing)</p> </div> <div class="ulist"> <ul> <li> <p>Nikad se automatski ne šalju na server</p> </li> <li> <p>Imaju veći kapacitet skladištenja (obično 5-10 MB)</p> </li> <li> <p>Nemaju datum isteka (traju do explicitnog brisanja)</p> </li> <li> <p>Ограничују се на протокол и домен (Политика истог пореклошца)</p> </li> </ul> </div> <div class="paragraph"> <p>За наш случај употребе,`localStorage`је савршен jarra :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Нам није потребно да поделимо ову информацију са сервером</p> </li> <li> <p>Želimo da preferencija traje neograničeno.</p> </li> <li> <p>Potrebna veličina skladišta je minimalna (nekoliko bajtova)</p> </li> </ol> </div> </div> <div class="sect2"> <h3 id="_implementacija_čuvanja_teme">Implementacija čuvanja teme</h3> <div class="paragraph"> <p>Ovo je kako čuvamo izbor korisnika kada menja temu:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">// Fonction complète pour changer le thème function setTheme(newTheme) { // Validation de l'entrée if (!['light', 'dark', 'auto'].includes(newTheme)) { console.error('Thème invalide:', newTheme); return; } try { // Sauvegarde dans localStorage localStorage.setItem('preferred-theme', newTheme); // Application immédiate dans le DOM document.documentElement.setAttribute('data-bs-theme', newTheme); // Dispatch d'un événement personnalisé pour notifier d'autres composants window.dispatchEvent(new CustomEvent('theme-changed', { detail: { theme: newTheme } })); console.log('Thème changé:', newTheme); } catch (error) { console.error('Erreur lors de la sauvegarde du thème:', error); // Fallback : on applique quand même le thème visuellement document.documentElement.setAttribute('data-bs-theme', newTheme); } } // Exemple d'utilisation avec un bouton document.getElementById('theme-toggle').addEventListener('click', () => { const currentTheme = document.documentElement.getAttribute('data-bs-theme') || 'light'; const newTheme = currentTheme === 'light' ? 'dark' : 'light'; setTheme(newTheme); });</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_upravljanje_slučajevima_greške">Upravljanje slučajevima greške</h3> <div class="paragraph"> <p>Izuzetno je važno da se upravlja slučajevima kod kojih`localStorage`nije dostupan ili pristupačan. Prikoliko scenarija mogu sprečiti pristup`localStorage`:</p> </div> <div class="paragraph"> <p><strong>Striktno privatno pretraživanje</strong>: Safari u privatnom načinu preglađanja baca izuzetak`QuotaExceededError`u pokušajima pisanja u`localStorage`.</p> </div> <div class="paragraph"> <p><strong>Подешавања приватности</strong>: neki pregledači ili proširenja za privatnost mogu blokirati pristup`localStorage`.</p> </div> <div class="paragraph"> <p><strong>Ograničenja domena</strong> : Le `localStorage`nije dostupan na protokolu`file://`у неким претраживачам.</p> </div> <div class="paragraph"> <p><strong>Popunjen prostor za skladištenje</strong>Iako retko, prostor za skladištenje može biti potpuno popunjen.</p> </div> <div class="paragraph"> <p>Zato naš kod koristi blok`try…​catch`Za rukovanje tim slučajevima uz ljubaznost, nastavljajući da nudi funkciju promene teme čak i kada perzistencija nije dostupna.</p> </div> </div> <div class="sect2"> <h3 id="_napredne_strategije_perzistencije">Napredne strategije perzistencije</h3> <div class="paragraph"> <p>За састављење савијањих апликација, можете да размотрите додатне стратегије :</p> </div> <div class="paragraph"> <p><strong>Синхронизација сервера (опцијонално)</strong></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">async function setTheme(newTheme) { // Sauvegarde locale immédiate localStorage.setItem('preferred-theme', newTheme); document.documentElement.setAttribute('data-bs-theme', newTheme); // Synchronisation serveur en arrière-plan (si l'utilisateur est connecté) if (userIsAuthenticated()) { try { await fetch('/api/user/preferences', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ theme: newTheme }) }); } catch (error) { console.warn('Échec de la synchronisation serveur:', error); // L'échec n'est pas critique car la préférence est déjà sauvegardée localement } } }</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj pristup omogućava sinhronizaciju preferenci između uređaja za prijavljene korisnike, i zadržavajući lokalnu odzivnost u stvarnom vremenu.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_korak_2_skript_prethodnog_učitavanja_unutar_head">Korak 2 : Skript prethodnog učitavanja unutar `<head></h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_srce_rešenja">Srce rešenja</h3> <div class="paragraph"> <p>Ово је где магия заиста ради. Ми ћемо поставити мали скрипт<strong>u liniji</strong>право у наш`<head>`, prije svih naших oznake`<link>`стилеве. Оvaj скрипт је намишњено минималистичан, аутономан и дизајниран да се изврши као што је могуће брже.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Mon Site Incroyable</title> <!-- ========================================== NOTRE SCRIPT MAGIQUE DE PRÉ-CHARGEMENT Ce script DOIT être le premier élément dans le <head> après les meta tags ========================================== --> <script> // IIFE pour ne pas polluer le scope global (function() { 'use strict'; try { // Lecture de la préférence sauvegardée const savedTheme = localStorage.getItem('preferred-theme'); // Si une préférence existe, on l'applique immédiatement if (savedTheme) { document.documentElement.setAttribute('data-bs-theme', savedTheme); } // Optionnel : Détecter la préférence système si aucune sauvegarde else if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { document.documentElement.setAttribute('data-bs-theme', 'dark'); } // Sinon, le thème par défaut du CSS sera utilisé (généralement 'light') } catch (error) { // En cas d'erreur (localStorage bloqué, etc.), on log discrètement // et on laisse le thème par défaut s'appliquer console.warn('Impossible de charger la préférence de thème:', error); } })(); </script> <!-- FIN DU SCRIPT MAGIQUE --> <!-- Les feuilles de style sont chargées APRÈS le script --> <link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="css/styles.css"> <!-- Autres ressources du head --> <link rel="icon" href="favicon.ico"> </head> <body> <!-- Contenu de la page --> </body> </html></code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_anatomija_skripte_svaka_linija_važi">Anatomija skripte: Svaka linija važi</h3> <div class="paragraph"> <p>Razložimo ovaj skript linija po liniji da razumemo svako odluku u dizajnu:</p> </div> <div class="paragraph"> <p><strong>IIFE (Izraz odmah pozivane funkcije)</strong></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">(function() { // ... })();</code></pre> </div> </div> <div class="paragraph"> <p>Ova struktura kreira funkciju koja se odmah izvršava. Zašto? Da izoljamo svoje promenljive u lokalnom opsegu i da izbegnemo zagađavanje globalnog opsegu. Čak i ako koristimo samo`const`(koji ima blok opseg), IIFE je dobra praksa koja čini naše namere jasne i zaštičuje od potencijalnih konflikata imena.</p> </div> <div class="paragraph"> <p><strong>Строги режим</strong></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">'use strict';</code></pre> </div> </div> <div class="paragraph"> <p>Ova direktiva aktivira strict mode u JavaScriptu, koji: - Забрањено коришћење недекларисаних променљивих - Generiše greške za opasne operacije - Poboljšava performanse u nekim JavaScript motorima</p> </div> <div class="paragraph"> <p>За критички скрипт као овај, желимо максималну безбедност.</p> </div> <div class="paragraph"> <p><strong>Blok try…​catch</strong></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">try { // Code principal } catch (error) { console.warn('Impossible de charger la préférence de thème:', error); }</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj blok je apsolutno ključan. On garantuje da ako se nešto pokvari (localStorage je blokiran, neprobabilna sintaksna greška, itd.), naš skript neće blokirati učitavanje cele stranice. Korišćenje`console.warn`umesto`console.error`укаже да је то неопрезив проблем.</p> </div> <div class="paragraph"> <p><strong>Čitanje iz localStorage</strong></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">const savedTheme = localStorage.getItem('preferred-theme');</code></pre> </div> </div> <div class="paragraph"> <p>Ova linija može baciti izuzetak u nekim kontekstima (striktno privatno pretraživanje u Safari-u). Zato je u bloku try…​catch.</p> </div> <div class="paragraph"> <p><strong>Uslovna primena</strong></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">if (savedTheme) { document.documentElement.setAttribute('data-bs-theme', savedTheme); }</code></pre> </div> </div> <div class="paragraph"> <p>Primenjujemo temu samo ako smo pronašli sačuvanu. Inače, dopuštamo CSS-u da koristi svoj podrazumevani temu. Ovaj pristup je čvrši od podrazumevane vrednosti koja je hardkodirana u JavaScriptu.</p> </div> </div> <div class="sect2"> <h3 id="_detekcija_preferencija_sistema_bonus">Detekcija preferencija sistema (Bonus)</h3> <div class="paragraph"> <p>Opцiona no eleganтna nadogradnja sastoji se u detektovanjem preferenca temea operativnog sistema korisnika ako jos nije izradio eksplcitni izbor u vašoj aplikaciji :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">else if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { document.documentElement.setAttribute('data-bs-theme', 'dark'); }</code></pre> </div> </div> <div class="paragraph"> <p>Ова функција користи медијски упит`prefers-color-scheme`На macOS, Windows 10+, iOS i Android moderno, ovaj zahtev vraća sistemsku preferencu korisnika.</p> </div> <div class="paragraph"> <p><strong>Prednosti:</strong> Prilagođeno iskustvo odmah od prve posete - Саглашеност са системским окружењем корисника - Нема потребе за складиштење за први посетак</p> </div> <div class="paragraph"> <p><strong>Размотрања :</strong> - Ne svi preglednici podržavaju ovu funkcionalnost (ali podrška je odlična od 2020.) Проверка`window.matchMedia`osigurava kompatibilnost - Корисник може увек да преодоле овог избора.</p> </div> </div> <div class="sect2"> <h3 id="_performance_zašto_je_ovo_skript_brzo">Performance : Zašto je ovo skript brzo</h3> <div class="paragraph"> <p>Naš skript za pre-učitavanje je dizajniran da bude ekstremno brz:</p> </div> <div class="paragraph"> <p><strong>Minimalna veličina</strong>: Okoliko 300 bajtova ne-minifikovanih, 200 bajtova minifikovanih. To je zanemarljivo u poređenju sa bilo kojom slikom ili JavaScript bibliotekom.</p> </div> <div class="paragraph"> <p><strong>U liniji</strong>Nema dodatnog HTTP zahteva. Skript se nalazi u HTML-u, pa je odmah dostupan.</p> </div> <div class="paragraph"> <p><strong>Jednostavne sinkrone operacije</strong>: Čitanje ključa u localStorage (ultra brza operacija) i izmena atributa DOM (native operacija pregledača).</p> </div> <div class="paragraph"> <p><strong>Nema zavisnosti</strong>: Nema frameworka, nema biblioteke, samo vanila JavaScript. Nema vremena pokretanja, nema parsanja zavisnosti.</p> </div> <div class="paragraph"> <p><strong>Jedno izvršavanje</strong>: Ovaj skript se izvršava samo jednom pri učitanju. Nema slušalaca događaja, nema petlji, nema složenih izračuna.</p> </div> <div class="paragraph"> <p>U praksi, na modernom hardveru, ovaj skript se izvršava u manje od 1 milisekunde, vreme koje je neprimetno i nema uticaja na performanse učitavanja stranice.</p> </div> </div> <div class="sect2"> <h3 id="_optimalno_postavljanje_u_head">Optimalno postavljanje u `<head></h3> <div class="paragraph"> <p>Redosled elemenata u`<head>`est važno. Sledeći je preporučeni redosled:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><head> <!-- 1. Métadonnées critiques --> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- 2. Notre script de pré-chargement (IMMÉDIATEMENT après les meta) --> <script> (function() { /* notre code */ })(); </script> <!-- 3. Titre de la page --> <title>Mon Site</title> <!-- 4. Feuilles de style --> <link rel="stylesheet" href="styles.css"> <!-- 5. Autres ressources (fonts, favicons, etc.) --> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="icon" href="favicon.ico"> <!-- 6. Autres scripts avec defer ou async --> <script src="app.js" defer></script> </head></code></pre> </div> </div> <div class="paragraph"> <p>Ova naredba garantuje da:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Karakterni skup je definisan pre bilo kog obrade teksta</p> </li> <li> <p>Naša skripta se izvršava pre učitavanja CSS</p> </li> <li> <p>CSS se zatim učitavaju i primenju se direktno pravu temu.</p> </li> <li> <p>Ostali ne-kritični resursi se učitavaju poslednji</p> </li> </ol> </div> </div> </div> </div> <div class="sect1"> <h2 id="_korak_3_snaga_css_selektora_atributa">Korak 3: Snaga CSS selektora atributa</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_sistem_teme_bootstrap_5">Sistem teme Bootstrap 5</h3> <div class="paragraph"> <p>Bootstrap 5 je uveo elegantan sistem za upravljanje temama koji se temelji na CSS custom property-ima (CSS promenljivim) i selektorima atributa. Ovaj sistem koristi atribut`data-bs-theme`na elementu`<html>`da se odredi koji skup promenljivih boja treba primeniti</p> </div> <div class="paragraph"> <p>Lepota ovog sistema je u njena prostota: umesto da učitamo različite stilove ili preklapamo klase na hiljade elemenata, jednostavno menjamo jedan atribut na jedinom elementu, a CSS ostalo radi zahvaljujući kaskadi.</p> </div> </div> <div class="sect2"> <h3 id="_css_struktura_za_sistem_teme">CSS struktura za sistem teme</h3> <div class="paragraph"> <p>Evo kompletne CSS strukture za implementaciju jakog sistema tema:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">/** * SYSTÈME DE THÈME COMPLET * Utilise les Custom Properties CSS pour une maintenance facile */ /* ============================================ THÈME PAR DÉFAUT (LIGHT) Défini sur :root pour être le fallback ============================================ */ :root { /* Couleurs de base */ --color-primary: #0d6efd; --color-secondary: #6c757d; --color-success: #198754; --color-danger: #dc3545; --color-warning: #ffc107; --color-info: #0dcaf0; /* Couleurs de fond */ --bg-primary: #ffffff; --bg-secondary: #f8f9fa; --bg-tertiary: #e9ecef; /* Couleurs de texte */ --text-primary: #212529; --text-secondary: #6c757d; --text-tertiary: #adb5bd; /* Couleurs de bordure */ --border-color: #dee2e6; --border-color-subtle: #e9ecef; /* Couleurs d'ombre */ --shadow-sm: rgba(0, 0, 0, 0.075); --shadow-md: rgba(0, 0, 0, 0.15); --shadow-lg: rgba(0, 0, 0, 0.25</code></pre> </div> </div> </div> </div> </div> https://cheroliv.com/blog/2025/0097_gradle_plugin_dev_func_test_logger_post.html Fri, 7 Nov 2025 00:00:00 +0000 blog/2025/0097_gradle_plugin_dev_func_test_logger_post.html <div id="toc" class="toc"> <div id="toctitle">Table of Contents</div> <ul class="sectlevel1"> <li><a href="#_увод">Увод</a></li> <li><a href="#_problem_zavisnost_od_gradlerunner">Problem: Zavisnost od GradleRunner</a> <ul class="sectlevel2"> <li><a href="#_kontekst_razvoja_plugina">Kontekst razvoja plugina</a></li> <li><a href="#_dilema_logiranja">Dilema logiranja</a></li> <li><a href="#_лажне_добре_идеје">Лажне добре идеје</a></li> </ul> </li> <li><a href="#_rešenje_nezavisni_logger">Rešenje: Nezavisni logger</a> <ul class="sectlevel2"> <li><a href="#_preporučena_arhitektura">Preporučena arhitektura</a></li> <li><a href="#_tok_izvršenja">Tok izvršenja</a></li> </ul> </li> <li><a href="#_пуна_имплементација">Пуна имплементација</a> <ul class="sectlevel2"> <li><a href="#_gradle_zavisnosti">Gradle zavisnosti</a></li> <li><a href="#_konfiguracija_logback">Konfiguracija Logback</a></li> <li><a href="#_kompletna_test_klasa">kompletna test klasa</a></li> </ul> </li> <li><a href="#_шема_вишестепног_логовања">Шема вишестепног логовања</a></li> <li><a href="#_dobre_prakse">Dobre prakse</a> <ul class="sectlevel2"> <li><a href="#_препоручена_структура_логова">Препоручена структура логова</a></li> <li><a href="#_vizuelni_simboli_za_čitljivost">Vizuelni simboli za čitljivost</a></li> <li><a href="#_extrakcija_informacija_iz_izlaza">Extrakcija informacija iz izlaza</a></li> </ul> </li> <li><a href="#_пoreђење_препост">Пoreђење пре/пост</a> <ul class="sectlevel2"> <li><a href="#_pre_problematičan_pristup">Pre : Problematičan pristup</a></li> <li><a href="#_posle_robustni_pristup">Posle: robustni pristup</a></li> </ul> </li> <li><a href="#_дијаграм_рекапитулативан">дијаграм рекапитулативан</a></li> <li><a href="#_ловце_које_треба_избегати">Ловце које треба избегати</a> <ul class="sectlevel2"> <li><a href="#_greška_broj_1_zaboraviti_forwardoutput">Greška broj 1: Zaboraviti `.forwardOutput()</a></li> <li><a href="#_засада_број_2_logger_није_иницијализован">❌ Засада број 2 : Logger није иницијализован</a></li> <li><a href="#_ловушка_број_3_превише_логирања">❌ Ловушка број 3 : Превише логирања</a></li> </ul> </li> <li><a href="#_rezultati_i_metrike">Rezultati i metrike</a></li> <li><a href="#_закључак">Закључак</a></li> <li><a href="#_resursi">Resursi</a></li> <li><a href="#_idete_dalje">Idete dalje</a></li> </ul> </div> <div class="sect1"> <h2 id="_увод">Увод</h2> <div class="sectionbody"> <div class="paragraph"> <p>Tijekom razvoja Gradle plugina, funkcionalni testovi su bitni da se provjeri ponašanje plugina u realnom Gradle okruženju. Međutim, brzo se javlja ključno pitanje:<strong>Как да поставим ефикасен систем за логовање без стварања проблемних зависности са <code>GradleRunner</code>?</strong></p> </div> <div class="paragraph"> <p>У овој чланку, ћемо istražiti:</p> </div> <div class="ulist"> <ul> <li> <p>Проблематика логовања у функционалним тестовима Gradle</p> </li> <li> <p>Архитектура стабилног решења са SLF4J и Logback</p> </li> <li> <p>Пуна имплементација са конкретним примерима</p> </li> <li> <p>Dobre prakse i greške koje treba izbegnuti</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_problem_zavisnost_od_gradlerunner">Problem: Zavisnost od GradleRunner</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_kontekst_razvoja_plugina">Kontekst razvoja plugina</h3> <div class="paragraph"> <p>Kada se razvija Gradle plugin, obično se koristi`GradleRunner`од <em>Gradle TestKit</em> za izvršavanje test buildova :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `test my plugin`() { val result = GradleRunner.create() .withProjectDir(projectDir) .withArguments("myTask") .build() // Comment logger efficacement ici ? }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_dilema_logiranja">Dilema logiranja</h3> <div class="paragraph"> <p>Glavni problem je sledeći:<strong>Логовање не сме да зависи од објекта чија иницијализација нам није сигурна.</strong>.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !define RECTANGLE class skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "Problematika arhitekture" { RECTANGLE Test { + runTest() } RECTANGLE GradleRunner { + build() + getLogger() ❌ } RECTANGLE Logger { + info() + debug() } Test --> GradleRunner : dépend de Logger ..> GradleRunner : dépend de ❌ } note right of Logger Problème: Le logger dépend du GradleRunner qui peut ne pas être initialisé end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_лажне_добре_идеје">Лажне добре идеје</h3> <div class="admonitionblock warning"> <table> <tr> <td class="icon"> <i class="fa icon-warning" title="Warning"></i> </td> <td class="content"> <div class="paragraph"> <p><strong>Ne radite to :</strong></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// ❌ MAUVAIS: Tentative d'obtenir un logger du runner val runner = GradleRunner.create() val logger = runner.logger // N'existe pas ! // ❌ MAUVAIS: Logger partagé initialisé tardivement lateinit var logger: Logger @BeforeEach fun setup() { logger = LoggerFactory.getLogger(...) }</code></pre> </div> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_rešenje_nezavisni_logger">Rešenje: Nezavisni logger</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_preporučena_arhitektura">Preporučena arhitektura</h3> <div class="paragraph"> <p>Решење је да се користи логер.<strong>potpuno nezavisno</strong> du <code>GradleRunner</code>, inicijalizovan na nivou klase testa.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !define RECTANGLE class skinparam backgroundColor #FEFEFE skinparam componentStyle rectangle package "Ispravna arhitektura" { RECTANGLE TestClass { + {static} logger: Logger ✓ + runTest() } RECTANGLE SLF4J { + LoggerFactory } RECTANGLE GradleRunner { + build() + forwardOutput() } RECTANGLE "Izlaz konzole" as Output { + captured text } TestClass --> SLF4J : utilise ✓ TestClass --> GradleRunner : utilise GradleRunner --> Output : génère TestClass --> Output : analyse } note top of TestClass Le logger est initialisé indépendamment du GradleRunner end note note bottom of GradleRunner .forwardOutput() permet de capturer la sortie pour analyse end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_tok_izvršenja">Tok izvršenja</h3> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain skinparam backgroundColor #FEFEFE participant "JUnit" as junit participant "TestClass" as test participant "Logger (SLF4J)" as logger participant "GradleRunner" as runner participant "Gradle Build" as gradle activate junit junit -> test : load class activate test test -> logger : initialize (companion) activate logger logger --> test : logger ready ✓ deactivate logger junit -> test : @BeforeAll test -> logger : info("Initialisation...") junit -> test : @BeforeEach test -> logger : debug("Подеси тест...") junit -> test : @Test test -> logger : info("TEST: Starting...") test -> runner : create() activate runner test -> runner : .forwardOutput() test -> runner : .withArguments(...) test -> runner : .build() runner -> gradle : execute build activate gradle gradle --> runner : output text deactivate gradle runner --> test : BuildResult + output deactivate runner test -> logger : debug("Analiziranje izlaza...") test -> test : analyze output test -> logger : info("✓ Test prošao") test --> junit : success deactivate test deactivate junit @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_пуна_имплементација">Пуна имплементација</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_gradle_zavisnosti">Gradle zavisnosti</h3> <div class="paragraph"> <p>Додајте необходиве зависимост у вашем`build.gradle.kts`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">dependencies { // Pour les tests fonctionnels testImplementation(gradleTestKit()) testImplementation("org.junit.jupiter:junit-jupiter:5.10.2") // Pour le logging testImplementation("org.slf4j:slf4j-api:2.0.17") testRuntimeOnly("ch.qos.logback:logback-classic:1.4.14") // Pour les assertions testImplementation("org.assertj:assertj-core:3.27.6") } tasks.test { useJUnitPlatform() }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_konfiguracija_logback">Konfiguracija Logback</h3> <div class="paragraph"> <p>Napravite fajl`src/test/resources/logback-test.xml`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-xml hljs" data-lang="xml"><?xml version="1.0" encoding="UTF-8"?> <configuration> <!-- Appender console avec format lisible --> <appender name="STDOUT" class="ch.qos.logback.core.ConsoleAppender"> <encoder> <pattern>%d{HH:mm:ss.SSS} [%thread] %-5level %logger{36} - %msg%n</pattern> </encoder> </appender> <!-- Appender fichier pour conservation --> <appender name="FILE" class="ch.qos.logback.core.FileAppender"> <file>build/test-results/functional-tests.log</file> <encoder> <pattern>%d{yyyy-MM-dd HH:mm:ss.SSS} [%thread] %-5level %logger{50} - %msg%n</pattern> </encoder> </appender> <!-- Logger pour vos tests --> <logger name="com.cheroliv.bakery" level="DEBUG"/> <!-- Réduire le bruit de Gradle --> <logger name="org.gradle" level="WARN"/> <!-- Configuration racine --> <root level="INFO"> <appender-ref ref="STDOUT"/> <appender-ref ref="FILE"/> </root> </configuration></code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_kompletna_test_klasa">kompletna test klasa</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">package com.cheroliv.bakery import org.gradle.testkit.runner.GradleRunner import org.gradle.testkit.runner.TaskOutcome import org.junit.jupiter.api.* import org.junit.jupiter.api.TestInstance.Lifecycle.PER_CLASS import org.junit.jupiter.api.io.TempDir import org.slf4j.Logger import org.slf4j.LoggerFactory import java.io.File import kotlin.test.assertEquals import kotlin.test.assertTrue @TestInstance(PER_CLASS) class BakeryPluginFunctionalTest { @field:TempDir lateinit var projectDir: File private val buildFile by lazy { projectDir.resolve("build.gradle.kts") } private val settingsFile by lazy { projectDir.resolve("settings.gradle.kts") } companion object { // ✓ Logger indépendant, initialisé au chargement de la classe private val logger: Logger = LoggerFactory.getLogger( BakeryPluginFunctionalTest::class.java ) @JvmStatic @BeforeAll fun globalSetup() { logger.info("═".repeat(60)) logger.info("DÉMARRAGE DE LA SUITE DE TESTS FONCTIONNELS") logger.info("═".repeat(60)) } @JvmStatic @AfterAll fun globalTeardown() { logger.info("═".repeat(60)) logger.info("FIN DE LA SUITE DE TESTS") logger.info("═".repeat(60)) } } @BeforeEach fun setup() { logger.info("─".repeat(60)) logger.info("Préparation de l'environnement de test") logger.debug("Répertoire de test: ${projectDir.absolutePath}") settingsFile.writeText(""" rootProject.name = "test-bakery-project" """.trimIndent()) logger.debug("✓ settings.gradle.kts créé") } @AfterEach fun teardown(testInfo: TestInfo) { logger.info("✓ Test terminé: ${testInfo.displayName}") logger.info("─".repeat(60)) } @Test fun `plugin can be applied successfully`() { logger.info("TEST: Application du plugin Bakery") buildFile.writeText(""" plugins { id("com.cheroliv.bakery") } """.trimIndent()) logger.debug("Fichier build.gradle.kts créé") logger.debug("Lancement du build Gradle...") val startTime = System.currentTimeMillis() val result = GradleRunner.create() .forwardOutput() // ← Important : capture la sortie .withPluginClasspath() .withArguments("tasks", "--group=bakery", "--stacktrace") .withProjectDir(projectDir) .build() val duration = System.currentTimeMillis() - startTime logger.info("Build terminé en ${duration}ms") // Analyse de la sortie logger.debug("Analyse de la sortie Gradle...") val outputLines = result.output.lines() logger.debug("Nombre de lignes capturées: ${outputLines.size}") // Validation val expectedTasks = listOf("bake", "printConfigPath", "printJBakeClasspath") logger.info("Vérification des tâches attendues:") expectedTasks.forEach { task -> val found = result.output.contains(task) logger.debug(" ${if (found) "✓" else "✗"} $task") assertTrue(found, "Task '$task' should be available") } logger.info("✓ Plugin appliqué avec succès - ${expectedTasks.size} tâches trouvées") } @Test fun `bake task executes and prints version`() { logger.info("TEST: Exécution de la tâche 'bake'") buildFile.writeText(""" plugins { id("com.cheroliv.bakery") } """.trimIndent()) logger.debug("Exécution de 'gradle bake'...") val result = GradleRunner.create() .forwardOutput() .withPluginClasspath() .withArguments("bake", "--info") // --info pour plus de détails .withProjectDir(projectDir) .build() // Extraction d'informations depuis la sortie logger.debug("Recherche du message 'Baking site'...") val hasBakingMessage = result.output.contains("Baking site with Bakery Plugin!") logger.debug("Recherche de la version JBake...") val hasVersionMessage = result.output.contains("Using JBake version:") // Extraction de la version (si présente) val versionRegex = Regex("Using JBake version: (.+)") val versionMatch = versionRegex.find(result.output) if (versionMatch != null) { val version = versionMatch.groupValues[1] logger.info("Version JBake détectée: $version") } // Validation assertTrue(hasBakingMessage, "Message 'Baking site' attendu") assertTrue(hasVersionMessage, "Message de version attendu") assertEquals(TaskOutcome.SUCCESS, result.task(":bake")?.outcome) logger.info("✓ Tâche 'bake' exécutée avec succès") } @Test fun `analyze output with structured logging`() { logger.info("TEST: Analyse structurée de la sortie") buildFile.writeText(""" plugins { id("com.cheroliv.bakery") } task("diagnostics") { doLast { println("[DIAG] Project: ${'$'}{project.name}") println("[DIAG] Build dir: ${'$'}{project.buildDir}") println("[DIAG] Plugin applied: true") val config = configurations.findByName("jbakeRuntime") println("[DIAG] JBake config exists: ${'$'}{config != null}") if (config != null) { println("[DIAG] Dependencies count: ${'$'}{config.dependencies.size}") } } } """.trimIndent()) logger.debug("Exécution de la tâche diagnostics...") val result = GradleRunner.create() .forwardOutput() .withPluginClasspath() .withArguments("diagnostics", "--quiet") .withProjectDir(projectDir) .build() // Analyse structurée logger.info("Extraction des informations de diagnostic:") val diagLines = result.output.lines() .filter { it.startsWith("[DIAG]") } logger.debug("Nombre de lignes de diagnostic: ${diagLines.size}") diagLines.forEach { line -> logger.info(" $line") // Analyse spécifique par type de ligne when { line.contains("Project:") -> { val projectName = line.substringAfter("Project:").trim() logger.debug(" → Nom du projet extrait: '$projectName'") } line.contains("Dependencies count:") -> { val count = line.substringAfter("count:").trim() logger.debug(" → Nombre de dépendances: $count") } } } assertTrue(diagLines.isNotEmpty(), "Des lignes de diagnostic devraient être présentes") logger.info("✓ Analyse structurée terminée - ${diagLines.size} lignes analysées") } @Test fun `test with error handling`() { logger.info("TEST: Gestion d'erreurs avec logging") buildFile.writeText(""" plugins { id("com.cheroliv.bakery") } """.trimIndent()) try { logger.debug("Tentative d'exécution...") val result = GradleRunner.create() .forwardOutput() .withPluginClasspath() .withArguments("printJBakeClasspath") .withProjectDir(projectDir) .build() val outcome = result.task(":printJBakeClasspath")?.outcome logger.info("Outcome: $outcome") if (outcome == TaskOutcome.SUCCESS) { logger.info("✓ Exécution réussie") } else { logger.warn("⚠ Outcome inattendu: $outcome") } assertEquals(TaskOutcome.SUCCESS, outcome) } catch (e: Exception) { logger.error("✗ Échec du test", e) logger.error("Type d'exception: ${e.javaClass.simpleName}") logger.error("Message: ${e.message}") // Log de la stack trace si nécessaire if (logger.isDebugEnabled) { logger.debug("Stack trace complète:", e) } throw e } } }</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_шема_вишестепног_логовања">Шема вишестепног логовања</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain skinparam backgroundColor #FEFEFE package "Нива логирања" { rectangle "трага" #E8E8E8 { note Détails d'exécution très fins • Valeurs de variables • Appels de méthodes internes end note } rectangle "DEBUG" #D0E8FF { note Informations de débogage • Étapes intermédiaires • Contenu des fichiers créés • Analyse de la sortie Gradle end note } rectangle "INFO" #C8FFC8 { note Informations principales • Début/fin de test • Résultats de validation • Durée d'exécution end note } rectangle "Предупреди" #FFFFC8 { note Avertissements • Comportements inattendus • Outcomes inhabituels end note } rectangle "Грешка" #FFC8C8 { note Erreurs • Échecs de test • Exceptions • Stack traces end note } } @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_dobre_prakse">Dobre prakse</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_препоручена_структура_логова">Препоручена структура логова</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `mon test`() { // 1. LOG: Début du test logger.info("TEST: Description du test") // 2. LOG: Préparation logger.debug("Préparation des fichiers...") buildFile.writeText("...") logger.debug("✓ Fichiers préparés") // 3. LOG: Exécution logger.debug("Lancement du build...") val startTime = System.currentTimeMillis() val result = GradleRunner.create() .forwardOutput() .withArguments("task") .build() val duration = System.currentTimeMillis() - startTime logger.info("Build terminé en ${duration}ms") // 4. LOG: Analyse logger.debug("Analyse des résultats...") // ... validations ... // 5. LOG: Conclusion logger.info("✓ Test réussi") }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_vizuelni_simboli_za_čitljivost">Vizuelni simboli za čitljivost</h3> <div class="paragraph"> <p>Koristite Unicode simbole za poboljšanje čitljivosti logova :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">logger.info("✓ Succès") logger.info("✗ Échec") logger.info("⚠ Attention") logger.info("→ Étape suivante") logger.info("═".repeat(60)) // Séparateur principal logger.info("─".repeat(60)) // Séparateur secondaire</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_extrakcija_informacija_iz_izlaza">Extrakcija informacija iz izlaza</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// Recherche simple val hasMessage = result.output.contains("Expected message") // Extraction avec regex val versionRegex = Regex("Version: (.+)") val version = versionRegex.find(result.output)?.groupValues?.get(1) // Filtrage de lignes val errorLines = result.output.lines() .filter { it.contains("ERROR") } errorLines.forEach { logger.error("Gradle error: $it") }</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_пoreђење_препост">Пoreђење пре/пост</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_pre_problematičan_pristup">Pre : Problematičan pristup</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">class MyTest { lateinit var logger: Logger // ❌ Initialisé tardivement @BeforeEach fun setup() { logger = LoggerFactory.getLogger(...) // ❌ Dépendance } @Test fun test() { val runner = GradleRunner.create() logger.info("Testing...") // ⚠ Peut échouer } }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_posle_robustni_pristup">Posle: robustni pristup</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">class MyTest { companion object { private val logger = LoggerFactory.getLogger(...) // ✓ Indépendant } @Test fun test() { logger.info("TEST: Starting...") // ✓ Toujours disponible val result = GradleRunner.create() .forwardOutput() // ✓ Capture la sortie .build() logger.debug("Output: ${result.output}") // ✓ Analyse } }</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_дијаграм_рекапитулативан">дијаграм рекапитулативан</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain skinparam backgroundColor #FEFEFE title Pun tok logovanja u funkcionalnim testovima actor "razvojnik" as dev participant "JUnit" as junit participant "TestClass" as test participant "Бележник (SLF4J)" as logger participant "Logback" as logback participant "GradleRunner" as runner participant "Konzola/Fajl" as output dev -> junit : lance les tests activate junit junit -> test : charge la classe activate test test -> logger : initialize (companion) activate logger logger -> logback : configure activate logback logback --> logger : ready deactivate logback logger --> test : ✓ deactivate logger == Phase de Setup == junit -> test : @BeforeAll test -> logger : info("Иницијализација") logger -> output : [INFO] Initialisation junit -> test : @BeforeEach test -> logger : debug("Тест подешавања") logger -> output : [DEBUG] Setup test == Phase de Test == junit -> test : @Test test -> logger : info("TEST: Pokretanje") logger -> output : [INFO] TEST: Starting test -> runner : create() activate runner test -> runner : .forwardOutput() test -> runner : .build() runner -> runner : execute Gradle runner --> test : BuildResult + output text deactivate runner test -> logger : debug("Analiziranje izlaza") logger -> output : [DEBUG] Analyzing output test -> test : assertions test -> logger : info("✓ Test réussi") logger -> output : [INFO] ✓ Test passed == Phase de Cleanup == junit -> test : @AfterEach test -> logger : debug("Čišćenje") logger -> output : [DEBUG] Cleanup junit -> test : @AfterAll test -> logger : info("Kraj testova") logger -> output : [INFO] Fin des tests test --> junit : ✓ all tests passed deactivate test deactivate junit dev <-- junit : rapport de tests @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_ловце_које_треба_избегати">Ловце које треба избегати</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_greška_broj_1_zaboraviti_forwardoutput">Greška broj 1: Zaboraviti `.forwardOutput()</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// MAUVAIS: La sortie Gradle n'est pas capturée val result = GradleRunner.create() .withArguments("task") .build() // result.output sera vide !</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// BON: La sortie est capturée val result = GradleRunner.create() .forwardOutput() // ✓ .withArguments("task") .build()</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_засада_број_2_logger_није_иницијализован">❌ Засада број 2 : Logger није иницијализован</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// MAUVAIS class Test { lateinit var logger: Logger // Peut ne pas être initialisé }</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// BON class Test { companion object { private val logger = LoggerFactory.getLogger(...) // Toujours initialisé } }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_ловушка_број_3_превише_логирања">❌ Ловушка број 3 : Превише логирања</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// MAUVAIS: Trop de logs DEBUG en production logger.debug("Variable a = $a") logger.debug("Variable b = $b") logger.debug("Variable c = $c") // ... 100 lignes de logs</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// BON: Logging ciblé logger.info("Traitement de ${items.size} éléments") logger.debug("Détails: ${items.take(5)}...") // Échantillon seulement</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_rezultati_i_metrike">Rezultati i metrike</h2> <div class="sectionbody"> <div class="paragraph"> <p>Sa ovim pristupom, dobijate:</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 28.5714%;"> <col style="width: 42.8571%;"> <col style="width: 28.5715%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">metrički</th> <th class="tableblock halign-left valign-top">Pre</th> <th class="tableblock halign-left valign-top">Posle</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Linije koda</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">~50 linija</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">~80 линија (+60%)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Време за дебаг</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">~30 min</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">~5 min (-83%)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Pronađene greške</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Osnovno</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">detaljan</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Održavanje</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">тешко</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">jednostavan</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Независност</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">❌ spojena</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">✓ независна</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_закључак">Закључак</h2> <div class="sectionbody"> <div class="paragraph"> <p>Uvođenje snažnog sistema logiranja u funkcionalnim testovima Gradle pluginova zasniva se na jednostavnom principu :<strong>независност</strong>.</p> </div> <div class="paragraph"> <p>Кључне тачке за запамтити :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Samostalni logger</strong>: Inicijalizovan u`companion object`</p> </li> <li> <p><strong>SLF4J + Logback</strong>testiran i podešiv stek</p> </li> <li> <p><strong>.forwardOutput()</strong>: Zabilježavanje izlaza Gradle</p> </li> <li> <p><strong>Strukturovano logiranje</strong>: INFO za korake, DEBUG za detalje</p> </li> <li> <p><strong>Analiza izlaza</strong>: Izvlačenje informacija iz`result.output`</p> </li> </ol> </div> <div class="paragraph"> <p>Ovaj pristup garantuje testovi<strong>održljivi</strong>, <strong>debuggables</strong> et <strong>jaki</strong>, poštujući principe solidnog dizajna.</p> </div> </div> </div> <div class="sect1"> <h2 id="_resursi">Resursi</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="https://docs.gradle.org/current/userguide/test_kit.html">Gradle TestKit Dokumentacija</a></p> </li> <li> <p><a href="https://www.slf4j.org/manual.html">SLF4J priručnik</a></p> </li> <li> <p><a href="https://logback.qos.ch/manual/configuration.html">Konfiguracija Logback</a></p> </li> <li> <p><a href="https://github.com/gradle/gradle/tree/master/subprojects/test-kit">Izvorni kod Gradle TestKit</a></p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_idete_dalje">Idete dalje</h2> <div class="sectionbody"> <div class="paragraph"> <p>У следећем чланку ћемо истражити:</p> </div> <div class="ulist"> <ul> <li> <p>Континуусна интеграција са структурираним логовањем</p> </li> <li> <p>HTML izveštaji o testovima sa ugrađenim logovima</p> </li> <li> <p>Напредно дебаговање са JVM attach</p> </li> <li> <p>Performanse i optimizacije logovanja</p> </li> </ul> </div> <div class="paragraph"> <p>Ovaj članak je deo serije "Razvoj Gradle pluginova" na mom tehničkom blogu.</p> </div> </div> </div> https://cheroliv.com/blog/2025/0096_afficher-couleurs-asciidoc_post.html Sat, 1 Nov 2025 00:00:00 +0000 blog/2025/0096_afficher-couleurs-asciidoc_post.html <div id="toc" class="toc"> <div id="toctitle">Table of Contents</div> <ul class="sectlevel1"> <li><a href="#_увод">Увод</a></li> <li><a href="#_проблематика">проблематика</a> <ul class="sectlevel2"> <li><a href="#_контекст_употребе">Контекст употребе</a></li> <li><a href="#_mogući_pristupi">Mogući pristupi</a> <ul class="sectlevel3"> <li><a href="#_опција_1_юникод_карактери">Опција 1 : Юникод карактери</a></li> <li><a href="#_опција_2_спољне_слике">Опција 2 : спољне слике</a></li> <li><a href="#_opcija_3_prilagođene_css_uloge">Opcija 3 : prilagođene CSS uloge</a></li> <li><a href="#_опција_4_убацивање_html_одбрано_решење">Опција 4 : убацивање HTML (одбрано решење)</a></li> </ul> </li> </ul> </li> <li><a href="#_решење_html_инжекција_са">Решење: HTML инжекција са </a> <ul class="sectlevel2"> <li><a href="#_princip_radnje">princip radnje</a></li> <li><a href="#_implementacija">Implementacija</a> <ul class="sectlevel3"> <li><a href="#_објашњење_својстава_css">Објашњење својстава CSS</a></li> </ul> </li> <li><a href="#_комплетни_пример">Комплетни пример</a></li> </ul> </li> <li><a href="#_optimizacije_i_najbolje_prakse">Optimizacije i najbolje prakse</a> <ul class="sectlevel2"> <li><a href="#_upravljaj_svetle_boje">upravljaj svetle boje</a></li> <li><a href="#_prilagodi_veličinu_kvadrata">Prilagodi veličinu kvadrata</a></li> <li><a href="#_kreirati_varijante">Kreirati varijante</a> <ul class="sectlevel3"> <li><a href="#_obojen_krug">obojen krug</a></li> <li><a href="#_kvadrat_sa_obojenom_rubom">Kvadrat sa obojenom rubom</a></li> </ul> </li> </ul> </li> <li><a href="#_архитектура_решења">Архитектура решења</a></li> <li><a href="#_prednosti_i_ograničenja">Prednosti i ograničenja</a> <ul class="sectlevel2"> <li><a href="#_предности">Предности</a></li> <li><a href="#_ograničenja">Ograničenja</a></li> <li><a href="#_unapređenje_pristupačnosti">Unapređenje pristupačnosti</a></li> </ul> </li> <li><a href="#_konkreatan_primer_dokumentacija_tema">Konkreatan primer: Dokumentacija tema</a></li> <li><a href="#_zaključak">Zaključak</a></li> <li><a href="#_resursi">Resursi</a></li> </ul> </div> <div class="sect1"> <h2 id="_увод">Увод</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pri izradi tehničke dokumentacije, posebno za vodiče po stilu ili specifikacije korisničkog interfejsa, često je potrebno prikazati palete boja. AsciiDoc, iako je vrlo moćan za dokumentaciju, ne nudi native sintaksu za prikaz uzoraka boja. Ovaj članak istražuje problematiku i predlaže elegantno rešenje zasnovano na HTML injekciji.</p> </div> </div> </div> <div class="sect1"> <h2 id="_проблематика">проблематика</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_контекст_употребе">Контекст употребе</h3> <div class="paragraph"> <p>Pretpostavimo da dokumentirate CSS promenljive teme web aplikacije. Treba vam :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Излистати хексадецималне кодове боја</p> </li> <li> <p>Prikazati vizuelni pregled svake boje</p> </li> <li> <p>Задржавати читаљивост изворног документа</p> </li> <li> <p>Osigurati kompatibilnost sa generatorima statičkih sajtova kao što je JBake</p> </li> </ol> </div> <div class="listingblock"> <div class="content"> <pre>@startuml left to right direction skinparam packageStyle rectangle actor "Tehnički pisac" as writer actor "Čitač" as reader rectangle "Документација AsciiDoc" { usecase "Документисати бојну палету" as UC1 usecase "Приказати хексадецимални код" as UC2 usecase "Визуализовати боју" as UC3 usecase "Генерисати статични сајт" as UC4 usecase "Погледајте документацију" as UC5 } writer --> UC1 UC1 ..> UC2 : include UC1 ..> UC3 : include UC1 --> UC4 UC4 --> UC5 UC5 <-- reader @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_mogući_pristupi">Mogući pristupi</h3> <div class="paragraph"> <p>Размишља се о неколико решења за приказивање боја у документу AsciiDoc:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam componentStyle rectangle package "Могућа решения" { component "Unicode znakovi" as unicode component "Spoljne slike" as images component "Персонализоване улоге CSS" as css component "Injekcija HTML" as html } package "Kriteriji vrednovanja" { component "Простота" as simple component "Преносливост" as portable component "персонализација" as custom component "Održavanje" as maintain } unicode -down-> simple : ✓ unicode -down-> portable : ✓ unicode -down-> custom : ✗ images -down-> simple : ✗ images -down-> portable : ✗ images -down-> custom : ✓ css -down-> simple : ~ css -down-> portable : ✗ css -down-> custom : ✓ html -down-> simple : ✓ html -down-> portable : ✓ html -down-> custom : ✓✓ html -down-> maintain : ✓ note right of html Solution recommandée end note @enduml</pre> </div> </div> <div class="sect3"> <h4 id="_опција_1_юникод_карактери">Опција 1 : Юникод карактери</h4> <div class="paragraph"> <p>Koristenje Unicode karaktera kao`■`(■) je jednostavna ali ograničena :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">* ■ --accent-color: #7952b3 (violet Bootstrap)</code></pre> </div> </div> <div class="paragraph"> <p><strong>Ograničenja</strong> : Nema kontrole nad bojom, zavisi od sistema fonta.</p> </div> </div> <div class="sect3"> <h4 id="_опција_2_спољне_слике">Опција 2 : спољне слике</h4> <div class="paragraph"> <p>Kreirajte PNG ili SVG slike za svaku boju:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">* image:colors/violet.svg[width=16] --accent-color: #7952b3</code></pre> </div> </div> <div class="paragraph"> <p><strong>Limitations</strong> : Teško održavanje, množenje fajlova, nema automatske sinhronizacije.</p> </div> </div> <div class="sect3"> <h4 id="_opcija_3_prilagođene_css_uloge">Opcija 3 : prilagođene CSS uloge</h4> <div class="paragraph"> <p>Definisati CSS klase i primenjivati ih putem AsciiDoc uloga:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">* [.color-violet]##■## --accent-color: #7952b3</code></pre> </div> </div> <div class="paragraph"> <p><strong>Ograničenja</strong> : Zahtijeva vanjski stil, prethodno definisanje svih mogućih boja.</p> </div> </div> <div class="sect3"> <h4 id="_опција_4_убацивање_html_одбрано_решење">Опција 4 : убацивање HTML (одбрано решење)</h4> <div class="paragraph"> <p>Користити макрос``за убацивање HTML-а са стилови у линији :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">* pass:[<span style="display:inline-block;width:1em;height:1em; background:#7952b3;vertical-align:middle;margin-right:0.5em"></span>] --accent-color: #7952b3 (violet Bootstrap)</code></pre> </div> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_решење_html_инжекција_са">Решење: HTML инжекција са </h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_princip_radnje">princip radnje</h3> <div class="paragraph"> <p>Makro``AsciiDoc omogućava uvođenje sirovog sadržaja koji neće biti interpretiran AsciiDoc procesorom. To nam omogućava direktno ubacivanje HTML sa inline CSS stilovima.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml participant "Документ\nAsciiDoc" as doc participant "Процесор AsciiDoc" as processor participant "pass:[] macro" as pass participant "HTML konačno" as html doc -> processor : Analyse document processor -> pass : Détecte pass:[] pass -> processor : Retourne HTML brut processor -> html : Insère sans transformation html -> html : Navigateur applique styles @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_implementacija">Implementacija</h3> <div class="paragraph"> <p>Evo HTML strukture za ubaciti :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><span style="display:inline-block; width:1em; height:1em; background:#7952b3; vertical-align:middle; margin-right:0.5em"> </span></code></pre> </div> </div> <div class="sect3"> <h4 id="_објашњење_својстава_css">Објашњење својстава CSS</h4> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 25%;"> <col style="width: 75%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Svojstvo</th> <th class="tableblock halign-left valign-top">funkcija</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>display:inline-block</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Omogućava definiranje širine/visine, ostajući u inline toku</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>width:1em; height:1em</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Veličina kvadrata relativna prema veličini fonta (responsive)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>background:#7952b3</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Boja koja se prikazuje (varijabilna prema vašim potrebama)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>vertical-align:middle</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Упореди квадрат са суседим текстом</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>margin-right:0.5em</code></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Razmak između kvadrata i teksta</p></td> </tr> </tbody> </table> </div> </div> <div class="sect2"> <h3 id="_комплетни_пример">Комплетни пример</h3> <div class="paragraph"> <p>Ovo je primer koji dokumentuje paletu teme:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">== Thème Clair * pass:[<span style="display:inline-block;width:1em;height:1em;background:#f8f9fa;border:1px solid #ccc;vertical-align:middle;margin-right:0.5em"></span>] --bg-primary: `#f8f9fa` (blanc cassé) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#212529;vertical-align:middle;margin-right:0.5em"></span>] --text-primary: `#212529` (noir très foncé) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#7952b3;vertical-align:middle;margin-right:0.5em"></span>] --accent-color: `#7952b3` (violet Bootstrap) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#61428f;vertical-align:middle;margin-right:0.5em"></span>] --accent-hover: `#61428f` (violet plus foncé) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#ffffff;border:1px solid #ccc;vertical-align:middle;margin-right:0.5em"></span>] --card-bg: `#ffffff` (blanc)</code></pre> </div> </div> <div class="paragraph"> <p>Ko daje sledeći izlaz :</p> </div> <div class="paragraph"> <p>svetla tema</p> </div> <div class="ulist"> <ul> <li> <p><span style="display:inline-block;width:1em;height:1em:background:#f8f9fa;border:1px solid #ccc;vertical-align:middle;margin-right:0.5em"></span> --bg-primary:`#f8f9fa`(ebež)</p> </li> <li> <p>lozinka:[<span style="display:inline-block;width:1em;height:1em;background:#212529;vertical-align:middle;margin-right:0.5em"></span>] --text-primary:`#212529`(vrlo tamno crno)</p> </li> <li> <p><span style="display:inline-block;width:1em;height:1em;background:#7952b3;vertical-align:middle;margin-right:0.5em"></span> --accent-color:`#7952b3`(ljubičasta Bootstrap)</p> </li> <li> <p><span style="display:inline-block;width:1em;height:1em;background:#61428f;vertical-align:middle;margin-right:0.5em"></span> --accent-hover:`#61428f`(tamniji ljubičast)</p> </li> <li> <p><span style="display:inline-block;width:1em;height:1em;background:#ffffff;border:1px solid #ccc;vertical-align:middle;margin-right:0.5em"></span> --card-bg:`#ffffff`(бел)</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_optimizacije_i_najbolje_prakse">Optimizacije i najbolje prakse</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_upravljaj_svetle_boje">upravljaj svetle boje</h3> <div class="paragraph"> <p>Za veoma svetle boje (bele, veoma svetle sive), dodajte rub za da budu vidljivi na beloj pozadini :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><span style="display:inline-block;width:1em;height:1em; background:#ffffff;border:1px solid #ccc; vertical-align:middle;margin-right:0.5em"></span></code></pre> </div> </div> <div class="paragraph"> <p>Siva ruba (<code>border:1px solid #ccc</code>) омогућава обележивање белог квадрата на белој подложи.</p> </div> </div> <div class="sect2"> <h3 id="_prilagodi_veličinu_kvadrata">Prilagodi veličinu kvadrata</h3> <div class="paragraph"> <p>Možete prilagoditi veličinu kvadrata po vašim potrebama:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">* pass:[<span style="display:inline-block;width:1.5em;height:1.5em;background:#7952b3;vertical-align:middle;margin-right:0.5em"></span>] Grand carré * pass:[<span style="display:inline-block;width:0.8em;height:0.8em;background:#7952b3;vertical-align:middle;margin-right:0.5em"></span>] Petit carré</code></pre> </div> </div> <div class="paragraph"> <p>Korišćenje jedinice`em`Гарантује да се квадрати прилагођавају величини фонта.</p> </div> </div> <div class="sect2"> <h3 id="_kreirati_varijante">Kreirati varijante</h3> <div class="paragraph"> <p>Za specifične potrebe, možete da kreirate različite oblike :</p> </div> <div class="sect3"> <h4 id="_obojen_krug">obojen krug</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">* pass:[<span style="display:inline-block;width:1em;height:1em;background:#7952b3;border-radius:50%;vertical-align:middle;margin-right:0.5em"></span>] Cercle violet</code></pre> </div> </div> </div> <div class="sect3"> <h4 id="_kvadrat_sa_obojenom_rubom">Kvadrat sa obojenom rubom</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">* pass:[<span style="display:inline-block;width:1em;height:1em;background:#ffffff;border:3px solid #7952b3;vertical-align:middle;margin-right:0.5em"></span>] Bordure violette</code></pre> </div> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_архитектура_решења">Архитектура решења</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml package "Radni tok dokumentacije" { [Document AsciiDoc\navec pass macro] as asciidoc [Processeur JBake] as jbake [Site HTML statique] as html [Navigateur Web] as browser } asciidoc --> jbake : 1. Compilation jbake --> html : 2. Génération html --> browser : 3. Affichage browser --> browser : 4. Rendu CSS note right of asciidoc Contient les balises pass:[] avec HTML inline end note note right of jbake Préserve le HTML dans pass:[] end note note right of browser Applique les styles inline CSS end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_prednosti_i_ograničenja">Prednosti i ograničenja</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_предности">Предности</h3> <div class="ulist"> <ul> <li> <p>✓ <strong>Autonomija</strong> : Nema ovisnosti o vanjskim datotekama</p> </li> <li> <p><strong>Преносност</strong> : Radi sa svim procesorima AsciiDoc</p> </li> <li> <p><strong>Синхронизација</strong> : Boijski kod je непосредno u HTML</p> </li> <li> <p>✓ <strong>Fleksibilnost</strong> : Potpuna prilagođavanje stila</p> </li> <li> <p>✓ <strong>Održavanje</strong> : Jednostavna izmena heksadekadarnog koda</p> </li> <li> <p>✓ <strong>Судирање JBake</strong> : Сасвим ради са генераторима статичних сајтова</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_ograničenja">Ograničenja</h3> <div class="ulist"> <ul> <li> <p><strong>visložitost</strong> : Ponavljajući HTML kod u izvoru AsciiDoc</p> </li> <li> <p>✗ <strong>Izvorna čitljivost</strong> : Izvorni dokument je manje obrađen</p> </li> <li> <p><strong>Приступност</strong> : Ниједан нативни алтернативни текст (да додате ручно)</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_unapređenje_pristupačnosti">Unapređenje pristupačnosti</h3> <div class="paragraph"> <p>Da bi kvadrati bili dostupni čitaocima ekrana:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">* pass:[<span role="img" aria-label="Couleur violet Bootstrap" style="display:inline-block;width:1em;height:1em;background:#7952b3; vertical-align:middle;margin-right:0.5em"></span>] --accent-color: `#7952b3` (violet Bootstrap)</code></pre> </div> </div> <div class="paragraph"> <p>Atributi`role="img"` et `aria-label`omogućavaju tehnologijama podrške da razumeju i opišu vizuelni sadržaj.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konkreatan_primer_dokumentacija_tema">Konkreatan primer: Dokumentacija tema</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovo je kompletan primer dokumentujući više tema:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">= Guide des couleurs de l'application == Thème Clair (`:root`) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#f8f9fa;border:1px solid #ccc;vertical-align:middle;margin-right:0.5em"></span>] --bg-primary: `#f8f9fa` (blanc cassé) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#212529;vertical-align:middle;margin-right:0.5em"></span>] --text-primary: `#212529` (noir très foncé) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#7952b3;vertical-align:middle;margin-right:0.5em"></span>] --accent-color: `#7952b3` (violet Bootstrap) == Thème Sombre (`[data-bs-theme="dark"]`) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#212529;vertical-align:middle;margin-right:0.5em"></span>] --bg-primary: `#212529` (noir très foncé) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#ffffff;border:1px solid #999;vertical-align:middle;margin-right:0.5em"></span>] --text-primary: `#ffffff` (blanc) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#0d6efd;vertical-align:middle;margin-right:0.5em"></span>] --accent-color: `#0d6efd` (bleu Bootstrap) == Thème Contraste Élevé (`[data-bs-theme="high-contrast"]`) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#000000;vertical-align:middle;margin-right:0.5em"></span>] --bg-primary: `#000000` (noir) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#ffffff;border:1px solid #000;vertical-align:middle;margin-right:0.5em"></span>] --text-primary: `#ffffff` (blanc) * pass:[<span style="display:inline-block;width:1em;height:1em;background:#00ff00;vertical-align:middle;margin-right:0.5em"></span>] --accent-color: `#00ff00` (vert vif)</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>HTML injekcija kroz makro``AsciiDoc nudi elegantno i praktično rešenje za prikaz uzoraka boje u tehničkoj dokumentaciji. Iako je malo rečniva, ovaj pristup osigurava maksimalnu prenosivu i pojednostavljeno održavanje.</p> </div> <div class="paragraph"> <p>Ova tehnika ne zahteva nikakvu spoljušnju konfiguraciju, nikakvu dodatnu stilsku listu, i odmah radi sa JBake-om i svim standardnim procesorima AsciiDoc-a.</p> </div> <div class="paragraph"> <p>Jednak, nakon što ste napravili svoj prvi obojen kvadrat, dovoljno je kopirati i zalijepiti HTML kod i promeniti heksadekadni kod da biste brzo stvorili kompletnu paletu.</p> </div> <div class="paragraph"> <p>Ova technika se može proširiti na druge slučajeve upotrebe koji zahtevaju prilagođeno vizuelno renderovanje: ikonice, odličke, jednostavni grafikoni, ili svaki vizuelni element koji zahteva preciznu kontrolu stila.</p> </div> </div> </div> <div class="sect1"> <h2 id="_resursi">Resursi</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="https://docs.asciidoctor.org/asciidoc/latest/pass/pass-macro/" target="_blank" rel="noopener">Dokumentacija AsciiDoc : pass macro</a></p> </li> <li> <p><a href="https://jbake.org/docs/2.6.7/" target="_blank" rel="noopener">JBake Документација</a></p> </li> <li> <p><a href="https://developer.mozilla.org/fr/docs/Web/CSS/color_value" target="_blank" rel="noopener">MDN : Vrednosti boje CSS</a></p> </li> </ul> </div> <div class="paragraph"> <p><em>Članak objavljen 2025-11-01</em></p> </div> </div> </div> https://cheroliv.com/blog/2025/0095_i18n-site-statique-jbake-thymeleaf_post.html Mon, 20 Oct 2025 00:00:00 +0000 blog/2025/0095_i18n-site-statique-jbake-thymeleaf_post.html <div id="toc" class="toc"> <div id="toctitle">Table of Contents</div> <ul class="sectlevel1"> <li><a href="#_увод">Увод</a> <ul class="sectlevel2"> <li><a href="#_дијаграм_случајева_коришћења_use_case">Дијаграм случајева коришћења (Use Case)</a></li> </ul> </li> <li><a href="#_arhitektura_internacionalizacije">Arhitektura internacionalizacije</a> <ul class="sectlevel2"> <li><a href="#_strukturalni_dijagram_organizacija_fajlova">Strukturalni dijagram (Organizacija fajlova)</a></li> <li><a href="#_zašto_ovaj_pristup">Zašto ovaj pristup?</a></li> <li><a href="#_dijagram_komponenti">Dijagram komponenti</a></li> </ul> </li> <li><a href="#_i18n_templatanja_pomoću_thymeleaf">I18n templatanja pomoću Thymeleaf</a> <ul class="sectlevel2"> <li><a href="#_структура_фајлова_порука">Структура фајлова порука</a></li> <li><a href="#_sadržaj_datoteka_poruka">Sadržaj datoteka poruka</a></li> <li><a href="#_upotreba_u_šablonima">Upotreba u šablonima</a></li> <li><a href="#_дијаграм_секвенце_решење_i18n">Дијаграм секвенце - Решење i18n</a></li> <li><a href="#_конфигурација_локале_у_jbake">Конфигурација локале у JBake</a></li> </ul> </li> <li><a href="#_i18n_artikala_organizacija_po_direktorijumima">I18n artikala : organizacija po direktorijumima</a> <ul class="sectlevel2"> <li><a href="#_dijagram_toka_flow_generisanje">Dijagram toka (Flow) - Generisanje</a></li> <li><a href="#_структура_фасцикла">Структура фасцикла</a></li> <li><a href="#_предности_овог_приступа">Предности овог приступа</a></li> <li><a href="#_metapodaci_članaka">Metapodaci članaka</a></li> <li><a href="#_конфигурација_url_ова">Конфигурација URL-ова</a></li> </ul> </li> <li><a href="#_šabloni_za_višejezični_prikaz">Šabloni za višejezični prikaz</a> <ul class="sectlevel2"> <li><a href="#_шаблон_статье_са_селектором_језика">Шаблон статье са селектором језика</a></li> <li><a href="#_filtrovan_indeks_po_jeziku">Filtrovan indeks po jeziku</a></li> </ul> </li> <li><a href="#_навигација_између_језика">Навигација између језика</a> <ul class="sectlevel2"> <li><a href="#_globalni_selektor_jezika">Globalni selektor jezika</a></li> <li><a href="#_dijagram_toka_čitanje_korisnika">Dijagram toka - čitanje korisnika</a></li> <li><a href="#_css_stil_za_selektor">CSS stil za selektor</a></li> </ul> </li> <li><a href="#_rss_kanal_po_jeziku">RSS kanal po jeziku</a></li> <li><a href="#_dobre_prakse_i_saveti">Dobre prakse i saveti</a> <ul class="sectlevel2"> <li><a href="#_1_konzistentnost_identifikatora_artikla">1. Konzistentnost identifikatora artikla</a></li> <li><a href="#_2_konsekventni_datumi">2. Konsekventni datumi</a></li> <li><a href="#_3_višejezični_tagovi">3. Višejezični tagovi</a></li> <li><a href="#_4_upravljanje_neprevedenim_članacima">4. Upravljanje neprevedenim članacima</a></li> <li><a href="#_5_višejezična_sitemap">5. Višejezična sitemap</a></li> </ul> </li> <li><a href="#_zaključak">Zaključak</a> <ul class="sectlevel2"> <li><a href="#_dijagram_raspoređivanja">Dijagram raspoređivanja</a></li> </ul> </li> </ul> </div> <div class="sect1"> <h2 id="_увод">Увод</h2> <div class="sectionbody"> <div class="paragraph"> <p>Internacionalizacija (i18n) statičkog sajta može se činiti složeno na prvi pogled, ali JBake u kombinaciji sa Thymeleaf-om nudi elegantna rešenja za kreiranje višezbojnog sajta. U ovom članaku ću vam pokazati kako sam postavio i18n na svom blogu, pokrjujući tako templating i upravljanje člancima na više jezika.</p> </div> <div class="sect2"> <h3 id="_дијаграм_случајева_коришћења_use_case">Дијаграм случајева коришћења (Use Case)</h3> <div class="listingblock"> <div class="content"> <pre>@startuml left to right direction skinparam packageStyle rectangle actor "Аутор" as author actor "Čitač FR" as reader_fr actor "Čitač EN" as reader_en rectangle "сајт JBake вишејезични" { usecase "Напиши članak FR" as UC1 usecase "Написати članak EN" as UC2 usecase "Konfiguriši i18n poruke" as UC3 usecase "Генериши сајт" as UC4 usecase "Pročitaj članak FR" as UC5 usecase "Прочитај чланак EN" as UC6 usecase "Promeniti jezik" as UC7 usecase "Pogledajte dostupne prevodi" as UC8 } author --> UC1 author --> UC2 author --> UC3 author --> UC4 reader_fr --> UC5 reader_fr --> UC7 reader_fr --> UC8 reader_en --> UC6 reader_en --> UC7 reader_en --> UC8 UC1 ..> UC4 : <<include>> UC2 ..> UC4 : <<include>> UC3 ..> UC4 : <<include>> UC5 ..> UC8 : <<extend>> UC6 ..> UC8 : <<extend>> @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_arhitektura_internacionalizacije">Arhitektura internacionalizacije</h2> <div class="sectionbody"> <div class="paragraph"> <p>Naš pristup se zasniva na dva pilija :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>I18n templatinga</strong>: korišćenje datoteka poruka Thymeleaf za elemente interfejsa</p> </li> <li> <p><strong>I18n sadržaja</strong>organizacija artikala po jeziku u posebnoj strukturi direktorijuma</p> </li> </ol> </div> <div class="sect2"> <h3 id="_strukturalni_dijagram_organizacija_fajlova">Strukturalni dijagram (Organizacija fajlova)</h3> <div class="listingblock"> <div class="content"> <pre>@startuml @startsalt { {T + projet-jbake ++ content +++ blog ++++ 2024 +++++ fr ++++++ article1.adoc ++++++ article2.adoc +++++ en ++++++ article1.adoc ++++++ article2.adoc ++++ 2025 +++++ fr ++++++ guide-i18n.adoc +++++ en ++++++ i18n-guide.adoc ++ templates +++ post.html +++ index.html +++ index_en.html +++ messages.properties +++ messages_fr.properties +++ messages_en.properties ++ assets +++ css +++ js +++ img ++ jbake.properties ++ output +++ fr ++++ blog +++++ 2025 ++++++ guide-i18n.html +++ en ++++ blog +++++ 2025 ++++++ i18n-guide.html } } @endsalt @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_zašto_ovaj_pristup">Zašto ovaj pristup?</h3> <div class="paragraph"> <p>Ovo razdvojenje omogućava:</p> </div> <div class="ulist"> <ul> <li> <p>Одржајте кохерентност у интерфесу без обзира на језик</p> </li> <li> <p>Samostalno upravljati sadržajem i prevodima članaka</p> </li> <li> <p>Olaksati dodavanje novih jezika bez veće refaktorizacije</p> </li> <li> <p>Omogućiti članke dostupne samo na nekim jezicima</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_dijagram_komponenti">Dijagram komponenti</h3> <div class="listingblock"> <div class="content"> <pre>@startuml skinparam componentStyle rectangle package "Izvori" { folder "sadržaj/blog/2025/" { folder "fr/" as content_fr { [article1.adoc] [article2.adoc] } folder "en/" as content_en { [article1.adoc] as article1_en [article2.adoc] as article2_en } } folder "шаблони/" { [post.html] [index.html] [index_en.html] } folder "poruke/" { [messages_fr.properties] [messages_en.properties] } [jbake.properties] } package "JBake Engine" { [Parser AsciiDoc] as parser [Template Engine\nThymeleaf] as thymeleaf [Generator] as generator [I18n Resolver] as i18n } package "Generisan sajt" { folder "fr/" { folder "блог/2025/" as blog_fr { [article1.html] [article2.html] } } folder "en/" { folder "блог/2025/" as blog_en { [article1.html] as article1_html_en [article2.html] as article2_html_en } } } content_fr --> parser content_en --> parser parser --> generator templates --> thymeleaf messages --> i18n i18n --> thymeleaf thymeleaf --> generator jbake.properties --> generator generator --> blog_fr generator --> blog_en @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_i18n_templatanja_pomoću_thymeleaf">I18n templatanja pomoću Thymeleaf</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_структура_фајлова_порука">Структура фајлова порука</h3> <div class="paragraph"> <p>Prvi korak je da se kreiraju fajlovi svojstva za svaki podržani jezik:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">src/jbake/templates/ ├── messages.properties # Fallback par défaut ├── messages_fr.properties # Français ├── messages_en.properties # Anglais └── messages_de.properties # Allemand</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_sadržaj_datoteka_poruka">Sadržaj datoteka poruka</h3> <div class="paragraph"> <p>Ovo je primer datoteke`messages_fr.properties`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-properties hljs" data-lang="properties"># Navigation nav.home=Accueil nav.blog=Blog nav.about=À propos nav.contact=Contact # Articles article.readmore=Lire la suite article.published=Publié le article.tags=Étiquettes article.also.available=Également disponible en # Interface site.title=Mon Blog Technique site.description=Partage de connaissances et expériences footer.copyright=© 2025 Tous droits réservés search.placeholder=Rechercher un article...</code></pre> </div> </div> <div class="paragraph"> <p>И његов еквивалент на engleskom`messages_en.properties`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-properties hljs" data-lang="properties"># Navigation nav.home=Home nav.blog=Blog nav.about=About nav.contact=Contact # Articles article.readmore=Read more article.published=Published on article.tags=Tags article.also.available=Also available in # Interface site.title=My Tech Blog site.description=Sharing knowledge and experiences footer.copyright=© 2025 All rights reserved search.placeholder=Search articles...</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_upotreba_u_šablonima">Upotreba u šablonima</h3> <div class="paragraph"> <p>У вашим Thymeleaf шаблонима, користите синтаксу`#{}`Za pristup porukama :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <title th:text="#{site.title}">Mon Blog</title> <meta name="description" th:content="#{site.description}" /> </head> <body> <nav> <a th:href="@{/}" th:text="#{nav.home}">Accueil</a> <a th:href="@{/blog/}" th:text="#{nav.blog}">Blog</a> <a th:href="@{/about.html}" th:text="#{nav.about}">À propos</a> </nav> <footer> <p th:text="#{footer.copyright}">Copyright</p> </footer> </body> </html></code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_дијаграм_секвенце_решење_i18n">Дијаграм секвенце - Решење i18n</h3> <div class="listingblock"> <div class="content"> <pre>@startuml actor Auteur participant JBake participant "AsciiDoc\nParser" as parser participant "Thymeleaf Motor" as thymeleaf participant "I18n\nРешавач" as i18n database "messages_*.properties" as messages Auteur -> JBake: jbake -b activate JBake JBake -> parser: Lire article.fr.adoc activate parser parser --> JBake: Contenu + métadonnées\n(lang=fr, article-id=xyz) deactivate parser JBake -> parser: Lire article.en.adoc activate parser parser --> JBake: Contenu + métadonnées\n(lang=en, article-id=xyz) deactivate parser JBake -> thymeleaf: Générer page FR activate thymeleaf thymeleaf -> i18n: Résoudre #{nav.home} activate i18n i18n -> messages: Lire messages_fr.properties messages --> i18n: "Почетна" i18n --> thymeleaf: "Почетна" deactivate i18n thymeleaf -> JBake: Rechercher traductions\n(article-id=xyz, lang!=fr) JBake --> thymeleaf: article.en.html trouvé thymeleaf --> JBake: /fr/blog/article.html deactivate thymeleaf JBake -> thymeleaf: Générer page EN activate thymeleaf thymeleaf -> i18n: Résoudre #{nav.home} activate i18n i18n -> messages: Lire messages_en.properties messages --> i18n: "Početna" i18n --> thymeleaf: "Početna" deactivate i18n thymeleaf -> JBake: Rechercher traductions\n(article-id=xyz, lang!=en) JBake --> thymeleaf: article.fr.html trouvé thymeleaf --> JBake: /en/blog/article.html deactivate thymeleaf JBake --> Auteur: Site généré deactivate JBake @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_конфигурација_локале_у_jbake">Конфигурација локале у JBake</h3> <div class="paragraph"> <p>U vašoj datoteci`jbake.properties`, postavite podrazumevanu lokalu :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-properties hljs" data-lang="properties"># Locale par défaut thymeleaf.locale=fr # Encodage template.encoding=UTF-8</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_i18n_artikala_organizacija_po_direktorijumima">I18n artikala : organizacija po direktorijumima</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_dijagram_toka_flow_generisanje">Dijagram toka (Flow) - Generisanje</h3> <div class="listingblock"> <div class="content"> <pre>@startuml start :Lire jbake.properties; :Charger configuration i18n; partition "За svaku AsciiDoc datoteku" { :Lire métadonnées\n(:jbake-lang:, :jbake-article-id:); :Parser contenu AsciiDoc; :Stocker en mémoire avec langue; } partition "Za svaki šablon" { :Charger template Thymeleaf; :Identifier langue cible; :Charger messages_{lang}.properties; partition "Filtriranje sadržaja" { :Filtrer articles par langue; :Grouper traductions\npar article-id; } :Appliquer template avec i18n; :Générer HTML dans /{lang}/; } :Copier assets statiques; :Générer sitemap multilingue; :Générer flux RSS par langue; stop @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_структура_фасцикла">Структура фасцикла</h3> <div class="paragraph"> <p>Umesto da koristim suffikse u nazivu datoteke, odlučio sam za organizaciju po folderima koja pruža bolju jasnoću i održivost:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">content/blog/ ├── 2024/ │ ├── fr/ │ │ ├── introduction-jbake.adoc │ │ ├── guide-thymeleaf.adoc │ │ └── astuces-asciidoc.adoc │ └── en/ │ ├── introduction-jbake.adoc │ ├── thymeleaf-guide.adoc │ └── asciidoc-tips.adoc └── 2025/ ├── fr/ │ └── internationalisation-jbake.adoc └── en/ └── jbake-internationalization.adoc</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_предности_овог_приступа">Предности овог приступа</h3> <div class="paragraph"> <p>Ova struktura ima više prednosti:</p> </div> <div class="ulist"> <ul> <li> <p><strong>jasno odvajanje</strong>: svaki jezik ima svoj prostor</p> </li> <li> <p><strong>fleksibilno imeovanje</strong>: datoteke mogu imati različite nazive u zavisnosti od jezika</p> </li> <li> <p><strong>Skalabilnost</strong>: lak je dodati novi jezik</p> </li> <li> <p><strong>Природна организација</strong>: prati vremensku logiku JBake</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_metapodaci_članaka">Metapodaci članaka</h3> <div class="paragraph"> <p>Svaki članak mora sadržavati metapodatke da bi se omogućilo povezivanje između prevoda. Ovo je primer:</p> </div> <div class="paragraph"> <p><strong>Francuska verzija</strong>(<code>2025/fr/internationalisation-jbake.adoc</code>) :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">= Internationalisation d'un site statique JBake :jbake-type: post :jbake-status: published :jbake-date: 2025-10-20 :jbake-lang: fr :jbake-article-id: jbake-i18n-thymeleaf :jbake-tags: jbake, thymeleaf, i18n :jbake-description: Guide pour mettre en place l'i18n avec JBake</code></pre> </div> </div> <div class="paragraph"> <p><strong>Engleska verzija</strong>(empty)<code>2025/en/jbake-internationalization.adoc</code>) :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">= Internationalizing a JBake Static Site :jbake-type: post :jbake-status: published :jbake-date: 2025-10-20 :jbake-lang: en :jbake-article-id: jbake-i18n-thymeleaf :jbake-tags: jbake, thymeleaf, i18n :jbake-description: Guide to implement i18n with JBake</code></pre> </div> </div> <div class="paragraph"> <p>NAPOMENA: Atribut`:jbake-article-id:`је битно : он омогућава везивање различитих превода истог чланка.</p> </div> </div> <div class="sect2"> <h3 id="_конфигурација_url_ова">Конфигурација URL-ова</h3> <div class="paragraph"> <p>U`jbake.properties`, podesite uzorak URL-a da uključuje jezik :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-properties hljs" data-lang="properties"># Pattern d'URL avec langue post.permalink.pattern=:lang/blog/:year/:name.html # Langue par défaut site.default.lang=fr</code></pre> </div> </div> <div class="paragraph"> <p>Ovo će generisati URL-ove tipa :</p> </div> <div class="ulist"> <ul> <li> <p><code>/fr/blog/2025/internationalisation-jbake.html</code></p> </li> <li> <p><code>/en/blog/2025/jbake-internationalization.html</code></p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_šabloni_za_višejezični_prikaz">Šabloni za višejezični prikaz</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_шаблон_статье_са_селектором_језика">Шаблон статье са селектором језика</h3> <div class="paragraph"> <p>Направи шаблон`post.html`ко приказује доступне преводе :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <title th:text="${content.title}">Article</title> </head> <body> <article> <header> <h1 th:text="${content.title}">Titre</h1> <div class="article-meta"> <time th:text="${#dates.format(content.date, 'dd MMMM yyyy')}" th:attr="datetime=${#dates.format(content.date, 'yyyy-MM-dd')}"> Date </time> <!-- Sélecteur de traductions --> <div class="translations" th:if="${content['article-id']}"> <span th:text="#{article.also.available}">Aussi disponible en :</span> <ul class="language-list"> <li th:each="post : ${published_posts}" th:if="${post['article-id'] == content['article-id'] and post.lang != content.lang}"> <a th:href="${post.uri}" th:text="${post.lang.toUpperCase()}"> LANG </a> </li> </ul> </div> </div> </header> <div class="content" th:utext="${content.body}"> Contenu de l'article </div> <footer class="article-footer"> <div class="tags" th:if="${content.tags}"> <span th:text="#{article.tags}">Étiquettes :</span> <span th:each="tag : ${content.tags}"> <a th:href="@{/tags/{tag}.html(tag=${tag})}" th:text="${tag}">tag</a> </span> </div> </footer> </article> </body> </html></code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_filtrovan_indeks_po_jeziku">Filtrovan indeks po jeziku</h3> <div class="paragraph"> <p>Kreirajte šablone indeksa za svaki jezik :</p> </div> <div class="paragraph"> <p><strong>index.html</strong>(indeks francuski) :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <title th:text="#{site.title}">Mon Blog</title> </head> <body> <main> <h1 th:text="#{nav.blog}">Blog</h1> <div class="articles-list"> <article th:each="post : ${published_posts}" th:if="${post.lang == 'fr'}"> <h2> <a th:href="${post.uri}" th:text="${post.title}">Titre</a> </h2> <time th:text="${#dates.format(post.date, 'dd MMMM yyyy')}"> Date </time> <p th:text="${post.description}">Description</p> <a th:href="${post.uri}" th:text="#{article.readmore}"> Lire la suite </a> </article> </div> </main> </body> </html></code></pre> </div> </div> <div class="paragraph"> <p><strong>index_en.html</strong>(engleski indeks) :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <title th:text="#{site.title}">My Blog</title> </head> <body> <main> <h1 th:text="#{nav.blog}">Blog</h1> <div class="articles-list"> <article th:each="post : ${published_posts}" th:if="${post.lang == 'en'}"> <h2> <a th:href="${post.uri}" th:text="${post.title}">Title</a> </h2> <time th:text="${#dates.format(post.date, 'dd MMMM yyyy')}"> Date </time> <p th:text="${post.description}">Description</p> <a th:href="${post.uri}" th:text="#{article.readmore}"> Read more </a> </article> </div> </main> </body> </html></code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_навигација_између_језика">Навигација између језика</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_globalni_selektor_jezika">Globalni selektor jezika</h3> </div> <div class="sect2"> <h3 id="_dijagram_toka_čitanje_korisnika">Dijagram toka - čitanje korisnika</h3> <div class="listingblock"> <div class="content"> <pre>@startuml start :Utilisateur accède au site; if (Langue préférée ?) then (FR) :Afficher /index.html; :Lister articles FR; else (EN) :Afficher /en/index.html; :Lister articles EN; endif :Utilisateur clique sur article; :Afficher article\navec métadonnées; if (Traductions disponibles ?) then (oui) :Afficher sélecteur\nde traductions; if (Changement de langue ?) then (oui) :Rediriger vers\ntraduction; :Afficher article\ndans nouvelle langue; else (non) :Continuer lecture; endif else (non) :Continuer lecture; endif stop @enduml</pre> </div> </div> <div class="paragraph"> <p>Dodajte selektor jezika u vaš glavni šablon:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><nav class="language-switcher"> <a href="/index.html" th:classappend="${content.lang == 'fr'} ? 'active'" title="Français"> 🇫🇷 FR </a> <a href="/en/index.html" th:classappend="${content.lang == 'en'} ? 'active'" title="English"> 🇬🇧 EN </a> </nav></code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_css_stil_za_selektor">CSS stil za selektor</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">.language-switcher { display: flex; gap: 1rem; padding: 0.5rem; background: #f5f5f5; border-radius: 4px; } .language-switcher a { padding: 0.5rem 1rem; text-decoration: none; color: #333; border-radius: 4px; transition: background 0.2s; } .language-switcher a:hover { background: #e0e0e0; } .language-switcher a.active { background: #007bff; color: white; } .translations { margin: 1rem 0; padding: 1rem; background: #f8f9fa; border-left: 4px solid #007bff; } .language-list { display: inline-flex; gap: 0.5rem; list-style: none; padding: 0; margin: 0; } .language-list li::after { content: "•"; margin-left: 0.5rem; } .language-list li:last-child::after { content: ""; }</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_rss_kanal_po_jeziku">RSS kanal po jeziku</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da biste imali RSS tokove odvojeni po jeziku, kreirajte zasebne šablone :</p> </div> <div class="paragraph"> <p><strong>feed.xml</strong>(francuski tok) :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-xml hljs" data-lang="xml"><?xml version="1.0" encoding="UTF-8"?> <rss version="2.0" xmlns:th="http://www.thymeleaf.org"> <channel> <title th:text="#{site.title}">Mon Blog</title> <link th:text="${config.site_host}">http://example.com</link> <description th:text="#{site.description}">Description</description> <language>fr</language> <item th:each="post : ${published_posts}" th:if="${post.lang == 'fr'}"> <title th:text="${post.title}">Titre</title> <link th:text="${config.site_host + post.uri}">Lien</link> <pubDate th:text="${#dates.format(post.date, 'EEE, dd MMM yyyy HH:mm:ss Z')}"> Date </pubDate> <description th:text="${post.description}">Description</description> </item> </channel> </rss></code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_dobre_prakse_i_saveti">Dobre prakse i saveti</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_1_konzistentnost_identifikatora_artikla">1. Konzistentnost identifikatora artikla</h3> <div class="paragraph"> <p>Uverite se da`:jbake-article-id:`je identično za sve prevede od istog članka. Koristite konzistentan format :</p> </div> <div class="ulist"> <ul> <li> <p>Preferirajte engleske identifikatore radi univerzalnosti.</p> </li> <li> <p>Koristić crtice za razdvajanje reči.</p> </li> <li> <p>Izbegavajte specijalne karaktere</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_2_konsekventni_datumi">2. Konsekventni datumi</h3> <div class="paragraph"> <p>Sve prevodi jednog članka moraju imati isti datum objave (<code>:jbake-date:</code>). Ovo olakšava sortiranje i kronološki prikaz.</p> </div> </div> <div class="sect2"> <h3 id="_3_višejezični_tagovi">3. Višejezični tagovi</h3> <div class="paragraph"> <p>Za tagove, imate dve opcije:</p> </div> <div class="paragraph"> <p><strong>Опција 1: Универзални тагови на английском</strong></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">:jbake-tags: java, spring-boot, microservices</code></pre> </div> </div> <div class="paragraph"> <p><strong>Опција 2: тагове преведени са мапингом</strong></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc"># Version française :jbake-tags: java, spring-boot, microservices # Version anglaise :jbake-tags: java, spring-boot, microservices</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_4_upravljanje_neprevedenim_članacima">4. Upravljanje neprevedenim članacima</h3> <div class="paragraph"> <p>Nije obavezno prevedati sve članke. Ako članak postoji samo na jednom jeziku, jednostavno neće se pojaviti u popisima drugog jezika.</p> </div> </div> <div class="sect2"> <h3 id="_5_višejezična_sitemap">5. Višejezična sitemap</h3> <div class="paragraph"> <p>Generišite jedan sitemap koji uključuje sve jezike:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-xml hljs" data-lang="xml"><?xml version="1.0" encoding="UTF-8"?> <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"> <url th:each="post : ${published_posts}"> <loc th:text="${config.site_host + post.uri}">URL</loc> <lastmod th:text="${#dates.format(post.date, 'yyyy-MM-dd')}">Date</lastmod> <!-- Liens alternatifs pour les traductions --> <xhtml:link th:each="translation : ${published_posts}" th:if="${translation['article-id'] == post['article-id'] and translation.lang != post.lang}" rel="alternate" th:attr="hreflang=${translation.lang},href=${config.site_host + translation.uri}" /> </url> </urlset></code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Internacionalizacija JBake sajta pomoću Thymeleaf-a je jak i održiv pristup. Odvajanjem i18n od templatinga (putem datoteka poruka) i i18n od sadržaja (putem organizacije u fasciklama), dobijate fleksibilni sistem koji se lako razvija.</p> </div> <div class="paragraph"> <p>Клучне тачке за запамећавање:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Datoteke poruka Thymeleaf</strong>за кориснички интерфејс</p> </li> <li> <p><strong>Organizacija po fasciklima</strong>(godina/jezik) za članke</p> </li> <li> <p><strong>Identifikatori artikla</strong>повезати преводи</p> </li> <li> <p><strong>Посвећени шаблони</strong>za svaki jezik</p> </li> <li> <p><strong>Eksplicitni URL-ovi</strong>uključujući kod jezika</p> </li> </ul> </div> <div class="sect2"> <h3 id="_dijagram_raspoređivanja">Dijagram raspoređivanja</h3> <div class="listingblock"> <div class="content"> <pre>@startuml node "Mašina za razvoj" { artifact "Izvor" { folder "srećan/" folder "šabloni/" folder "sredstva/" } component "JBake CLI" as jbake Sources --> jbake : jbake -b } node "Server za izgradnju (CI/CD)" { component "GitHub Actions ili GitLab CI" as ci jbake --> ci : push } cloud "CDN / hosting" { node "Statički web server" { artifact "Генерисан сајт" { folder "/blog/" folder "/en/blog/" folder "/assets/" } } } ci --> "Генерисан сајт" : déploiement actor "Čitaoci" as users users --> "Statički web server" : HTTPS @enduml</pre> </div> </div> <div class="paragraph"> <p>Ova arhitektura vam omogućava da pođete jednostavno sa dva jezika i da dodate još jedan bez velike refaktorisanja. Sve ostaje potpuno statičko i performantno, verno filozofiji JBake.</p> </div> <div class="paragraph"> <p>Dobar višijezični razvoj! 🌍</p> </div> </div> </div> </div> https://cheroliv.com/blog/2025/0094_tor_browser_install_post.html Sun, 5 Oct 2025 00:00:00 +0000 blog/2025/0094_tor_browser_install_post.html <div id="toc" class="toc"> <div id="toctitle">Table of Contents</div> <ul class="sectlevel1"> <li><a href="#_uvod">Uvod</a></li> <li><a href="#_preuzimanje_tor_i_njegovog_potpisa">Preuzimanje Tor i njegovog potpisa</a></li> <li><a href="#_криптографска_провјерка_потписа">Криптографска провјерка потписа</a> <ul class="sectlevel2"> <li><a href="#_импортирај_јавни_кључ_тор_пројекта">Импортирај јавни кључ Тор пројекта</a></li> <li><a href="#_2_провери_потпис">2. Провери потпис</a></li> <li><a href="#_praktični_primer_važeći_potpis_ali_nesertifikovan_ključ">Praktični primer: Važeći potpis ali nesertifikovan ključ</a></li> </ul> </li> <li><a href="#_зашто_проверити_потпис">Зашто проверити потпис?</a></li> <li><a href="#_ekstrakcija_i_pokretanje_tor_browser">Ekstrakcija i pokretanje Tor Browser</a></li> <li><a href="#_интеграција_на_убунту_десктоп">Интеграција на Убунту десктоп</a></li> <li><a href="#_istraživanje_obrazovnih_resursa_koristeći_tor">Istraživanje obrazovnih resursa koristeći Tor</a></li> <li><a href="#_ažuriranje_tor_pretraživača">Ažuriranje Tor pretraživača</a></li> <li><a href="#_zaključak">Zaključak</a></li> <li><a href="#_референце">Референце</a></li> </ul> </div> <div class="sect1"> <h2 id="_uvod">Uvod</h2> <div class="sectionbody"> <div class="paragraph"> <p>U svetu gde je digitalna privatnost sve više ugrožena, <strong>Tor Browser</strong> ostaje neophodan alat za čuvanje anonimnosti i slobode informisanja. Međutim, je važno da nikad ne pokrećete preuzeti softver bez da imate<strong>Proverio je njenu autentičnost</strong>. Ovaj članak predstavlja kompletan metod za:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Preuzeti <strong>Tor Browser</strong> i njegov potpis`.asc`</p> </li> <li> <p>Проверити валидност преузетог фајла</p> </li> <li> <p>Instalirati i pokrenuti <strong>Tor Browser</strong> na Ubuntu</p> </li> <li> <p>Dodati ga u menije radne površine za svakodnevno korišćenje</p> </li> <li> <p>Istražujte obrazovne i etičke OSINT resurse kroz Tor</p> </li> </ol> </div> </div> </div> <div class="sect1"> <h2 id="_preuzimanje_tor_i_njegovog_potpisa">Preuzimanje Tor i njegovog potpisa</h2> <div class="sectionbody"> <div class="paragraph"> <p>Napravite poseban folder za Tor pretraživač:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">mkdir -p ~/workspace/tipiak/tor cd ~/workspace/tipiak/tor</code></pre> </div> </div> <div class="paragraph"> <p>Zatim preuzmite arhivu pretraživača Tor i njegov potpis :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">wget https://www.torproject.org/dist/torbrowser/14.5.7/tor-browser-linux-x86_64-14.5.7.tar.xz wget https://www.torproject.org/dist/torbrowser/14.5.7/tor-browser-linux-x86_64-14.5.7.tar.xz.asc</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_криптографска_провјерка_потписа">Криптографска провјерка потписа</h2> <div class="sectionbody"> <div class="paragraph"> <p>Овај чекор је<strong>neophodan</strong>да се осигура да је фајл који је преузет заиста из <strong>Tor Project</strong>-а и није измењен.</p> </div> <div class="sect2"> <h3 id="_импортирај_јавни_кључ_тор_пројекта">Импортирај јавни кључ Тор пројекта</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">gpg --auto-key-locate nodefault,wkd --locate-keys torbrowser@torproject.org</code></pre> </div> </div> <div class="paragraph"> <p>Проверите да је кључ правилно увезен :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">gpg --list-keys torbrowser@torproject.org</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_2_провери_потпис">2. Провери потпис</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">gpg --verify tor-browser-linux-x86_64-14.5.7.tar.xz.asc tor-browser-linux-x86_64-14.5.7.tar.xz</code></pre> </div> </div> <div class="paragraph"> <p>Ако је све исправно, ће се приказати следећа порука:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">gpg: Good signature from "Tor Browser Developers (signing key)"</code></pre> </div> </div> <div class="paragraph"> <p>U slučaju upozorenja na nepotpisani ključ, to znači samo da još niste potpisali poverljivi ključ Tor Projecta, ali potpis ostaje važeći.</p> </div> </div> <div class="sect2"> <h3 id="_praktični_primer_važeći_potpis_ali_nesertifikovan_ključ">Praktični primer: Važeći potpis ali nesertifikovan ključ</h3> <div class="paragraph"> <p>Često je da se naidemo na poruku ovako ova prilikom verifikacije:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">gpg --verify tor-browser-linux-x86_64-14.5.7.tar.xz.asc tor-browser-linux-x86_64-14.5.7.tar.xz gpg: Signature faite le mar. 16 sept. 2025 14:26:26 CEST gpg: avec la clef RSA CAAE408AEBE2288E96FC5D5E157432CF78A65729 gpg: Bonne signature de « Tor Browser Developers (signing key) <torbrowser@torproject.org> » [inconnu] gpg: Attention : cette clef n'est pas certifiée avec une signature de confiance. gpg: Rien n'indique que la signature appartient à son propriétaire. Empreinte de clef principale : EF6E 286D DA85 EA2A 4BA7 DE68 4E2C 6E87 9329 8290 Empreinte de la sous-clef : CAAE 408A EBE2 288E 96FC 5D5E 1574 32CF 78A6 5729</code></pre> </div> </div> <div class="paragraph"> <p>Ova poruka ukazuje da je potpis tehnički "dobar" (datoteka nije izmijenjena), ali vaš GPG sistem ne može <strong>sertifikovati poverenje</strong> u samu ključ. Da biste razriješili ovo sumnjanje, nužno je uporediti odtisak glavnog ključa (<code>EF6E 286D DA85 EA2A 4BA7 DE68 4E2C 6E87 9329 8290</code>) са том objavljenom na zvaničnom sajtu Tor Projekta</p> </div> <div class="paragraph"> <p>Po zvaničnom sajtu, očekivani odtisk prsta je:`EF6E286DDA85EA2A4BA7DE684E2C6E8793298290`.</p> </div> <div class="paragraph"> <p>Пошто отпечат приказан од`gpg`слага се <strong>истачно</strong> са кључем са официјалног сајта, можете да будете сигурни да је кључ легитиман и да је датотека сигурна. Упозорење о "несертификованом кључу" онда је информација о вашој локалној GPG конфигурацији, а не о важењу подписа или аудентичности датотеке.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_зашто_проверити_потпис">Зашто проверити потпис?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Provera GPG potpisa je osnovni čin digitalne bezbednosti. Омогућава:</p> </div> <div class="ulist"> <ul> <li> <p>garantirati<strong>authentičnost</strong>preuzetog softvera</p> </li> <li> <p>Sprečavanje instalacije fajla koji je kompromitovan od strane zlonamernog aktora</p> </li> <li> <p>Sudjelovati u<strong>digitalna suverenitet</strong>individualna</p> </li> <li> <p>Подстикнути одговорну и етичну цифрову културу</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre>@startuml left to right direction actor "Корисник" as U actor "Server TorProject" as S usecase "Preuzmi Tor i njegov potpis" as D usecase "Uvezi javni ključ" as K usecase "Проверити ГПГ потпис" as V usecase "Instaliraj i pokreni Tor" as I U --> D U --> K U --> V U --> I S --> D @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_ekstrakcija_i_pokretanje_tor_browser">Ekstrakcija i pokretanje Tor Browser</h2> <div class="sectionbody"> <div class="paragraph"> <p>Raspakujte preuzetu arhivu :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">tar -xvf tor-browser-linux-x86_64-14.5.7.tar.xz cd tor-browser</code></pre> </div> </div> <div class="paragraph"> <p>Zatim pokrenite pregledač :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./start-tor-browser.desktop</code></pre> </div> </div> <div class="paragraph"> <p>При покретању, отвориће се прозор за конфигурацију да се насреди веза са Тор мрежом.</p> </div> </div> </div> <div class="sect1"> <h2 id="_интеграција_на_убунту_десктоп">Интеграција на Убунту десктоп</h2> <div class="sectionbody"> <div class="paragraph"> <p>За додавање <strong>Tor Browser</strong> у менију приложения:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./start-tor-browser.desktop --register-app</code></pre> </div> </div> <div class="paragraph"> <p>Zatim możete:</p> </div> <div class="ulist"> <ul> <li> <p>Pokreni <strong>Tor Browser</strong> iz menija aplikacija</p> </li> <li> <p>Додати у омиљенице док</p> </li> <li> <p>Kreirati prečac sa tastature ako je željeno</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre>@startuml start :Téléchargement de Tor; :Importation de la clé GPG; :Vérification de la signature; if (Signature valide ?) then (Oui) :Extraction du navigateur; :Lancement du navigateur Tor; :Enregistrement dans le bureau; else (Non) :Supprimer le fichier compromis; endif stop @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_istraživanje_obrazovnih_resursa_koristeći_tor">Istraživanje obrazovnih resursa koristeći Tor</h2> <div class="sectionbody"> <div class="paragraph"> <p>Tor nije samo alat za anonimnost. Ovo je portal za pristup obrazovnim i istraživačkim resursima, posebno u oblastima:</p> </div> <div class="ulist"> <ul> <li> <p><strong>OSINT (Otvoreni izvor informacija)</strong></p> </li> <li> <p><a href="https://inteltechniques.com">https://inteltechniques.com</a></p> </li> <li> <p><a href="https://osintframework.com">https://osintframework.com</a></p> </li> <li> <p><strong>edukativno deljenje i otvoren kod</strong></p> </li> <li> <p><a href="https://archive.org">https://archive.org</a>(pristup kroz Tor za veću privatnost)</p> </li> <li> <p><a href="https://github.com/">https://github.com/</a>(доступан преко Тор)</p> </li> <li> <p><a href="https://librarygenesis.pro">https://librarygenesis.pro</a>(pristup slobodnoj naučnoj literaturi)</p> </li> <li> <p><strong>Prenos znanja i razumevanje čoveka u digitalnom društvu</strong></p> </li> <li> <p>Resursi o digitalnoj kulturi, slobodi izražavanja i pristupu znanju</p> </li> <li> <p>Slobodna dokumentacija o kiberbezbednosti i etike tehnologije</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_ažuriranje_tor_pretraživača">Ažuriranje Tor pretraživača</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bi se osigurala optimalna bezbednost, ključno je da <strong>Tor Browser</strong> ostane ažuriran. Pregledač ima ugrađen mehanizam automatskog ažuriranja koji se može pokrenuti iz komandne linije.</p> </div> <div class="paragraph"> <p>Iz direktorijuma instalacije Tor Browsera, dosta je ponovo pokrenuti skript za pokretanje :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">cd ~/workspace/tipiak/tor/tor-browser ./start-tor-browser.desktop</code></pre> </div> </div> <div class="paragraph"> <p>Pri pokretanju, <strong>Tor Browser</strong> će automatski proveriti da li postoji nova verzija. Ako je tako, on će je preuzeti i instalirati za vas.</p> </div> <div class="paragraph"> <p>Ova jednostavna metoda osigurava da uvek imate najnovija bezbednosna ažuriranja i najnovija unapređenja, što je ključno za bezbednu navigaciju.</p> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Provera vaših preuzimanja je bitna navika za svakoga koji želi da se razvija u bezbednom digitalnom okruženju. Instalirati Tor na proveren način, to je<strong>zaštiti svoj digitalni integritet</strong>, <strong>сачувати поверенје у слободном софтверу</strong>, et <strong>јачање његове информационалне аутономије</strong>.</p> </div> <div class="paragraph"> <p>Digitalna bezbednost je čin svesti, ne paranoje.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml title Sintetski pregled upotrebe Tora actor Utilisateur rectangle "Tor Browser" { rectangle "анонимтет" as A rectangle "Pretraga OSINT" as O rectangle "Obrazovno deljenje" as E } Utilisateur --> A Utilisateur --> O Utilisateur --> E @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_референце">Референце</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Oficialni sajt Tor Proekta :https://www.torproject.org/download/[<a href="https://www.torproject.org/download/" class="bare">https://www.torproject.org/download/</a>]</p> </li> <li> <p>Документација проверке подписаhttps://support.torproject.org/tbb/how-to-verify-signature/[<a href="https://support.torproject.org/tbb/how-to-verify-signature/" class="bare">https://support.torproject.org/tbb/how-to-verify-signature/</a>]</p> </li> <li> <p>Dokumentacija Ubuntu :https://ubuntu.com[<a href="https://ubuntu.com" class="bare">https://ubuntu.com</a>]</p> </li> <li> <p>Archive образована :https://archive.org/details/opensource[<a href="https://archive.org/details/opensource" class="bare">https://archive.org/details/opensource</a>]</p> </li> </ul> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p>Ovaj članak je deo serije <strong>Sigurnost i digitalna svest</strong> u cilju promocije odgovornih i pedagoških praksi oko slobodnih alata.</p> </div> </td> </tr> </table> </div> </div> </div> https://cheroliv.com/blog/2025/0093_gradle_plugin_toml_composite_build_post.html Sat, 27 Sep 2025 00:00:00 +0000 blog/2025/0093_gradle_plugin_toml_composite_build_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_uvod">Uvod</a></li> <li><a href="#_katalog_verzija_libs_versions_toml_jedno_podsjetanje">Katalog verzija (<code>libs.versions.toml</code>) : Jedno podsjetanje</a></li> <li><a href="#_2_problem_jedan_build_kompozitni_i_dva_odvojena_sveta">2. Problem : Jedan Build Kompozitni i dva odvojena sveta</a></li> <li><a href="#_3_решение_делити_решење_зависности">3. Решение: Делити решење зависности</a></li> <li><a href="#_4_zaključak_moć_dobro_upravljenih_kompozitnih_gradnje">4. Zaključak : Moć dobro upravljenih kompozitnih gradnje</a></li> </ul> </div> <div class="sect1"> <h2 id="_uvod">Uvod</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title">Ciljna grupa: Razvojni inženjeri Gradle koji se suočavaju sa upravljanjem zavisnostima u projektima sa više build-ova.</div> <p>U našoj potrazi za kreiranjem plugina`site-baker`, smo se trudili da održamo čistu i centralizovanu bazu koda. Jedna od najboljih praksi u modernom Gradle ekosustavu je korištenje<strong>katalog verzija</strong>(<code>libs.versions.toml</code>) за управљање зависностима. Но шта се дешава када ваш пројекат постаје сложенији, као један<strong>Izgradi kompozit</strong>Где независни билд (наш плагин) треба да буде укључен у друг ?</p> </div> <div class="paragraph"> <p>Tu je naša avantura došla do nezvaničanog obreta. Hteli smo da naš plugin`site-baker`, koji je sam po sebi Gradle projekat, koristi isti katalog verzija kao i naš glavni projekat. Ovaj članak, peti u našoj seriji, opisuje kako smo rešili ovaj izazov.</p> </div> </div> </div> <div class="sect1"> <h2 id="_katalog_verzija_libs_versions_toml_jedno_podsjetanje">Katalog verzija (<code>libs.versions.toml</code>) : Jedno podsjetanje</h2> <div class="sectionbody"> <div class="paragraph"> <p>Datoteka`gradle/libs.versions.toml`је функционалност Gradle-а која омогућава централизацију верзија и координата зависиености вашег пројекта. Обично је структуриран у четири секcije :</p> </div> <div class="ulist"> <ul> <li> <p><code>[versions]</code>: Definiše alias za brojeve verzija (npr:`kotlin = "1.9.20"`).</p> </li> <li> <p><code>[libraries]</code>: Дефинише алиаси за потпуне зависносце, коришћењем верзија дефиницисаних изнад (на пример:`kotlin-stdlib = { module = "org.jetbrains.kotlin:kotlin-stdlib", version.ref = "kotlin" }`)</p> </li> <li> <p><code>[bundles]`Skupiti više biblioteka pod jednim pseudinomom (primer:`jackson = ["jackson-core", "jackson-databind"]</code>).</p> </li> <li> <p><code>[plugins]</code>: Definiše alias za Gradle pluginove.</p> </li> </ul> </div> <div class="paragraph"> <p>Jednom definisano, Gradle automatski generiše tipizovane pristupnike, što čini vaše`build.gradle.kts`mnogo čitljivije:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">dependencies { // Au lieu de : implementation("org.jetbrains.kotlin:kotlin-stdlib:1.9.20") implementation(libs.kotlin.stdlib) }</code></pre> </div> </div> <div class="listingblock"> <div class="title">Tok podataka iz kataloga verzija</div> <div class="content"> <pre>@startuml !theme plain file "gradle/libs.versions.toml" as Toml node "Gradle" as G file "build.gradle.kts" as BuildScript Toml --> G : "je čitan od" G --> BuildScript : "generiše akcesor `libs" BuildScript -> G : "Koristi `libs` za deklarisanje zavisnosti" @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_2_problem_jedan_build_kompozitni_i_dva_odvojena_sveta">2. Problem : Jedan Build Kompozitni i dva odvojena sveta</h2> <div class="sectionbody"> <div class="paragraph"> <p>Наша структура пројекта је један<strong>Izgradi kompozit</strong>. Главни пројект (<code>thymeleaf.cheroliv.com</code>) uključuje projekat plugina (<code>site-baker</code>) komandom`includeBuild("site-baker")<code>у фајлу`settings.gradle.kts</code>.</p> </div> <div class="listingblock"> <div class="title">Struktura kompozitnog građenja</div> <div class="content"> <pre>@startuml !theme plain package "Glavni projekt" { file "settings.gradle.kts" as MainSettings folder "gradle" { file "libs.versions.toml" as MainToml } } package "Plugin `site-baker` (Build Uključen)" { file "settings.gradle.kts" as PluginSettings file "build.gradle.kts" as PluginBuild } MainSettings -> PluginSettings : `includeBuild("site-pekar")` PluginBuild ..> MainToml : **Voulait accéder à...** note right on link: ...mais ne pouvait pas ! @enduml</pre> </div> </div> <div class="paragraph"> <p>Problem je što je, po defaultu, uključen build jedan<strong>odvojen svet</strong>. On ima svoju konfiguraciju, svoj životni ciklus, i on ne vidi datoteku`libs.versions.toml`glavnog builda. Naš`plugin/build.gradle.kts`pokušavao je da koristi`libs.plugins.kotlin.jvm`, ali objekat`libs`Nije generisan iz ispravne TOML datoteke, što je izazvalo greške u gradnji.</p> </div> </div> </div> <div class="sect1"> <h2 id="_3_решение_делити_решење_зависности">3. Решение: Делити решење зависности</h2> <div class="sectionbody"> <div class="paragraph"> <p>Posle nekoliko istraživanja, rešenje se ukazalo kao funkcionalnost Gradle dizajnirana baš za ovaj slučaj :`dependencyResolutionManagement`.</p> </div> <div class="paragraph"> <p>У фајлу`settings.gradle.kts` du <strong>build uključen</strong>(<code>site-baker/settings.gradle.kts</code>), možemo da Gradle-u kažemo gde da pronađe katalog verzija koje treba da koristimo.</p> </div> <div class="paragraph"> <p>Ovo je konfiguracija koju smo dodali`site-baker/settings.gradle.kts`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// site-baker/settings.gradle.kts dependencyResolutionManagement { repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS) repositories { gradlePluginPortal() mavenCentral() } versionCatalogs { create("libs") { from(files("../gradle/libs.versions.toml")) } } } rootProject.name = "site-baker" include("plugin")</code></pre> </div> </div> <div class="paragraph"> <p>Анализирамо критичан део:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">versionCatalogs { create("libs") { // Crée un catalogue nommé 'libs' from(files("../gradle/libs.versions.toml")) // En utilisant ce fichier } }</code></pre> </div> </div> <div class="ulist"> <ul> <li> <p><code>create("libs")</code>: Декларишем каталог верзија који ће бити доступан преко алиаса`libs`.</p> </li> <li> <p><code>from(files("../gradle/libs.versions.toml"))`Ovo je magija. Govorimo Gradle-u da je izvor ovog kataloga datoteka TOML koja se nalazi u direktorijumu.`gradle</code> du <strong>roditeljski projekat</strong>(<code>../</code>).</p> </li> </ul> </div> <div class="paragraph"> <p>С овим подешавањем, саграда`site-baker`Сада зна да мора да користи каталог верзија главног пројекта. Објекат`libs`је правилно генерисан, и зависимости су решены као што је планирано.</p> </div> </div> </div> <div class="sect1"> <h2 id="_4_zaključak_moć_dobro_upravljenih_kompozitnih_gradnje">4. Zaključak : Moć dobro upravljenih kompozitnih gradnje</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovo iskustvo je bilo bogato lekcijama. Katalog verzija je fantastičan alat za održavanje, ali ponašanje u scenarijima složenih građenja nije uvek intuitivno.</p> </div> <div class="paragraph"> <p>Ključ je da se sećamo da je uključen build i dalje nezavisni build. Da bi se delile konfiguracije, kao što je katalog verzija, potrebno je koristiti eksplicitne mehanizme koje pruža Gradle, kao što je blok`dependencyResolutionManagement`у`settings.gradle.kts`.</p> </div> <div class="paragraph"> <p>Rešavanjem ovog problema, nismo samo napravili naš build čistiji, već smo takođe jačili konsistenciju našeg projekta osiguravajući da plugin i glavni projekat dele jedinstveni izvor istine za njihove zavisnosti.</p> </div> <div class="paragraph"> <p>У следећем чланку, nastavit ćemo da poboljšamo naš plugin dodavanjem složenijih zadataka, sada kada je naše upravljanje zavisnostima čvrsto i centralizovano.</p> </div> </div> </div> https://cheroliv.com/blog/2025/0092_gradle_configuration_cache_post.html Fri, 26 Sep 2025 00:00:00 +0000 blog/2025/0092_gradle_configuration_cache_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_uvod">Uvod</a></li> <li><a href="#_simptom_neki_fantomski_builds">Simptom: Neki Fantomski Builds</a></li> <li><a href="#_istraživanje_šta_je_keš_konfiguracije">Istraživanje: Šta je keš konfiguracije ?</a></li> <li><a href="#_причина_проблема_непоглашајући_плагин">Причина проблема: Непоглашајући плагин</a></li> <li><a href="#_временно_решење_ономогући_кеш">Временно решење: Ономогући кеш</a></li> <li><a href="#_истинско_решение_направити_плагин_совместим">Истинско решение : Направити плагин совместим</a></li> </ul> </div> <div class="sect1"> <h2 id="_uvod">Uvod</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title">Ciljna publika : Gradle programeri koji su već susreli "magična" ili nepredvidljiva ponašanja gradle buildova.</div> <p>У нашој авантури креирања плагина`site-baker`, smo sledili rigorozan TDD pristup. Svaka funkcionalnost je bila testirana, validirana, i napredovali smo sa pouzdanjem. I onda je jednog dana neočekivano stigli. Build-ovi su počeli da se ponašaju neravnomerno. Izmene u logici plugina ili u fajlovima konfiguracije su se čile da se ignorišu, i naši funkcioni testovi, koji su bili pouzdani, su počeli da neuspešaju bez razloga.</p> </div> <div class="paragraph"> <p>Posle intenzivne sesije debugovanja, krivac je identifikovan: le<strong>keš konfiguracije Gradle</strong>.</p> </div> </div> </div> <div class="sect1"> <h2 id="_simptom_neki_fantomski_builds">Simptom: Neki Fantomski Builds</h2> <div class="sectionbody"> <div class="paragraph"> <p>Problem se manifestovao na nekoliko načina :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Ja sam menjao niz znakova u jednom zadatku`println`, ali stara niza je nastavila da se prikaže tokom izvršavanja.</p> </li> <li> <p>Menjao sam vrednost u svom fajlu`managed-jbake-context.yml`, ali je plugin postupao kao da fajl nije bio promenjen.</p> </li> <li> <p>Funkcionalni testovi, koji kreiraju test projekte na leto, pađali su jer plugin nije uspeo da otkrije nova kreirana konfiguraciona fajla.</p> </li> </ol> </div> <div class="paragraph"> <p>Sve se odlagalo kao da Gradle izvršava "fantomsku verziju" našeg builda, ignorirajući naše najnovije izmene.</p> </div> </div> </div> <div class="sect1"> <h2 id="_istraživanje_šta_je_keš_konfiguracije">Istraživanje: Šta je keš konfiguracije ?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Keš konfiguracije je relativno moderna i ekstremno moćna funkcija Gradle-ova, aktiviran podrazumevano u novijim verzijama. Njegov cilj je da ubrzade gradnje.</p> </div> <div class="olist arabic"> <div class="title">Princip je jednostavan :</div> <ol class="arabic"> <li> <p>При првом извршавању, Gradle извршава фазу<strong>Конфигурација</strong>(читање des`build.gradle.kts`, креирање задатака, решавање зависности) и конструише граф задатака.</p> </li> <li> <p>Na kraju ove faze, Gradle<strong>Серијализује овај граф задатака</strong>i kešira ga.</p> </li> <li> <p>Tokom sledećih izvršavanja, ako se ništa nije promenilo (skripte za izgradnju,<code>gradle.properties</code>, itd.), Gradle<strong>Потпуно прескачу фазу конфигурације</strong>i ponovo koristi keširani graf zadataka.</p> </li> </ol> </div> <div class="paragraph"> <p>Mnoštvo uštedjenog vremena je spektakularno na velikim projektima. međutim, ova performans ima svoju cenu: zahteva da se plugins pišu prema strožim pravilima.</p> </div> <div class="listingblock"> <div class="title">Животни циклус кеша конфигурације</div> <div class="content"> <pre>@startuml start :Première exécution; :Phase de Configuration; :Création du graphe de tâches; :Mise en cache du graphe; :Phase d'Exécution; end start :Exécution suivante; if (Cache valide ?) then (oui) :Restauration du graphe depuis le cache; note right La phase de configuration est sautée ! end note else (non) :Phase de Configuration; :Mise à jour du cache; endif :Phase d'Exécution; stop @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_причина_проблема_непоглашајући_плагин">Причина проблема: Непоглашајући плагин</h2> <div class="sectionbody"> <div class="paragraph"> <p>Naš plugin`site-baker`kršio, ne znajući, više pravila keša konfiguracije. Da bi graf zadataka bio serijalizabilan, zadaci ne smeju da sadrže reference na složene objekte kao što je objekat`Project`ili čitati fajlove proizvoljno tokom faze izvršenja.</p> </div> <div class="paragraph"> <p>Naša glavna greška bila je da smo čitali sadržaj YAML fajla direktno u logiku izvršenja zadatka, koristeći referencu na putanju koja je bila smeštena u našoj ekstenziji. Ovaj pristup je nekompatibilan sa keširanjem jer Gradle ne može da zna da li se sadržaj fajla promenio ako se ovo čitanje ne modelira kao<strong>unos zadatka</strong>(Task Input).</p> </div> </div> </div> <div class="sect1"> <h2 id="_временно_решење_ономогући_кеш">Временно решење: Ономогући кеш</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bi se otključali i vratili u ponašanje gradnje koje se može predvideti, najbrža rešenje je bilo da se isključi keš konfiguracije. Dovoljno je dodati sledeću liniju u fajl`gradle.properties`projekta koji koristi plugin (ili u našem slučaju, testni projekat)<code>site-baker</code>).</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-properties hljs" data-lang="properties"># site-baker/gradle.properties org.gradle.configuration-cache=false</code></pre> </div> </div> <div class="paragraph"> <p>Odmah, builds su se vratili na svoje normalno ponašanje. Svako pokretanje je pokrenulo fazu konfiguracije i naše promene su bile uzeti u obzir.</p> </div> <div class="paragraph"> <p>Међутим, ово је обходно решење, не трајно решење. Оно жртвује перформансе и не решава основи проблем нашег плагина.</p> </div> </div> </div> <div class="sect1"> <h2 id="_истинско_решение_направити_плагин_совместим">Истинско решение : Направити плагин совместим</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bi plugin bio dobar građanin u modernom Gradle ekosistemu, mora biti kompatibilan sa keširanjem konfiguracije. To podrazumeva ponovo razmišljanje o tome kako podaci težu ka nasim zadacima.</p> </div> <div class="paragraph"> <p>Ključ je da se koriste<strong>API‑ji pružatelja</strong>od Gradle. Umesto prosleđivanja direktnih vrednosti (kao`String` ou un <code>File</code>) na naše zadatke, moramo provesti`Property<T>`или неке`Provider<T>`.</p> </div> <div class="olist arabic"> <div class="title">Ово је план рефакторинга :</div> <ol class="arabic"> <li> <p><strong>Пријавите унос задатака :</strong>Задатак који анализира YAML датотеку мора да декларише ову датотеку као улаз. За то се користи анотација`@InputFile`.</p> </li> </ol> </div> <div class="paragraph"> <p>[source,kotlin] ---- @get:InputFile abstract val configFile: RegularFileProperty ----</p> </div> <div class="listingblock"> <div class="content"> <pre></pre> </div> </div> </div> </div> https://cheroliv.com/blog/2025/0091_jackson_yaml_tdd_post.html Thu, 25 Sep 2025 00:00:00 +0000 blog/2025/0091_jackson_yaml_tdd_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_uvod">Uvod</a></li> <li><a href="#_1_контекст_наш_плагин_site_baker">1. Контекст: Наш плагин `site-baker</a></li> <li><a href="#_2_modelovanje_konfiguracije_u_kotlinu">2. Modelovanje Konfiguracije u Kotlinu</a></li> <li><a href="#_3_интеграција_jackson_a_у_build_gradle_kts">3. Интеграција Jackson-a у `build.gradle.kts</a></li> <li><a href="#_4_tdd_pristup_testiranje_yaml_parsiranja">4. TDD pristup: Testiranje YAML parsiranja</a> <ul class="sectlevel2"> <li><a href="#_4_1_jedinični_test_mapirati_yaml_u_kotlin_objekat">4.1. Jedinični test : Mapirati YAML u Kotlin objekat</a></li> <li><a href="#_4_2_funkcionišni_test_provera_čitanja_konfiguracionog_fajla">4.2. Funkcionišni test : Provera čitanja konfiguracionog fajla</a></li> </ul> </li> <li><a href="#_5_vizualizacija_toka_parsiranja">5. Vizualizacija toka parsiranja</a></li> <li><a href="#_zaključak">zaključak</a></li> </ul> </div> <div class="sect1"> <h2 id="_uvod">Uvod</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title">Ciljna grupa: Srednji Gradle programeri koji žele da upravljaju složenim konfiguracijama.</div> <p>U razvoju Gradle pluginova, upravljanje složenim konfiguracijama je čežnji zadatak. Umesto da preopterećite DSL stotinama osobina, često je čistije i lakše održivati da se konfiguracija definiše u vanjskom fajlu, kao što je YAML. Ovaj članak vas vodí kroz integraciju moćne Jackson biblioteke za parsiranje YAML fajlova u Kotlin objekte, primenjujući strogu TDD pristup kako bi se osigurala jakost našeg plugina.<code>site-baker</code>.</p> </div> </div> </div> <div class="sect1"> <h2 id="_1_контекст_наш_плагин_site_baker">1. Контекст: Наш плагин `site-baker</h2> <div class="sectionbody"> <div class="paragraph"> <p>Naš plugin`site-baker`je namenjen da automatizuje generisanje i implementaciju statičkog sajta. Treba da pročita datoteku konfiguracije YAML (<code>managed-jbake-context.yml</code>) za dobijanje informacija kao što su putanje izvora, odredišta deploy-a i Git identifikatori.</p> </div> <div class="paragraph"> <p>YAML konfiguracija koju želimo da parsiramo glasi ovako:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml">bake: srcPath: "./site/jbake" destDirPath: "bake" cname: "cheroliv.com" pushPage: from: "bake" to: "cvs" repo: name: "trainings" repository: "https://github.com/pages-content/pages-content.github.io.git" credentials: username: "USERNAME" password: "SECRET_TOKEN" branch: "main" message: "cheroliv.com" # ... autres configurations (pushMaquette, supabase, etc.)</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_2_modelovanje_konfiguracije_u_kotlinu">2. Modelovanje Konfiguracije u Kotlinu</h2> <div class="sectionbody"> <div class="paragraph"> <p>Пре него што парсирамо, морамо да дефинишемо структуру наших података у Kotlin. Jackson ће ови класе користити за аутоматичко мапирање садржаја YAML.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// plugin/src/main/kotlin/com/cheroliv/site/baker/data/SiteConfiguration.kt package com.cheroliv.site.baker.data import com.fasterxml.jackson.databind.ObjectMapper import com.fasterxml.jackson.dataformat.yaml.YAMLFactory import com.fasterxml.jackson.module.kotlin.readValue import com.fasterxml.jackson.module.kotlin.registerKotlinModule fun parseSiteConfiguration(yaml: String): SiteConfiguration { val mapper = ObjectMapper(YAMLFactory()).registerKotlinModule() return mapper.readValue(yaml) } data class GitPushConfiguration( val from: String = "", val to: String = "", val repo: RepositoryConfiguration = RepositoryConfiguration(), val branch: String = "", val message: String = "", ) data class RepositoryConfiguration( val name: String = "", val repository: String = "", val credentials: RepositoryCredentials = RepositoryCredentials(), ) { companion object { const val ORIGIN = "origin" const val CNAME = "CNAME" const val REMOTE = "remote" } } data class RepositoryCredentials(val username: String = "", val password: String = "") data class SiteConfiguration( val bake: BakeConfiguration = BakeConfiguration(), val pushPage: GitPushConfiguration = GitPushConfiguration(), val pushMaquette: GitPushConfiguration = GitPushConfiguration(), val pushSource: GitPushConfiguration? = null, val pushTemplate: GitPushConfiguration? = null, val supabase: SupabaseContactFormConfig? = null ) data class BakeConfiguration( val srcPath: String = "", val destDirPath: String = "", val cname: String? = null, ) // ... (autres data classes pour Supabase, si nécessaire)</code></pre> </div> </div> <div class="paragraph"> <p>Funkcija`parseSiteConfiguration`je naša tačka ulaza za deserijalizaciju. Ona koristi`ObjectMapper`de Jackson, konfigurisan sa`YAMLFactory`за YAML format i`registerKotlinModule()`за подршку специфичности Kotlin-а (kao što su podrazumevane vrednosti svojstava)</p> </div> </div> </div> <div class="sect1"> <h2 id="_3_интеграција_jackson_a_у_build_gradle_kts">3. Интеграција Jackson-a у `build.gradle.kts</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bismo koristili Jackson, moramo da dodamo neophodne zavisnosti u`build.gradle.kts`našeg modula`plugin`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// plugin/build.gradle.kts dependencies { // Jackson for YAML parsing implementation("com.fasterxml.jackson.module:jackson-module-kotlin:2.18.3") implementation("com.fasterxml.jackson.dataformat:jackson-dataformat-yaml:2.18.3") // ... autres dépendances }</code></pre> </div> </div> <div class="paragraph"> <p>Koristimo`jackson-module-kotlin`за подршку Kotlin и`jackson-dataformat-yaml`за управљање форматом YAML.</p> </div> </div> </div> <div class="sect1"> <h2 id="_4_tdd_pristup_testiranje_yaml_parsiranja">4. TDD pristup: Testiranje YAML parsiranja</h2> <div class="sectionbody"> <div class="paragraph"> <p>Sada primenjujemo TDD da bismo validirali našu logiku parsiranja.</p> </div> <div class="sect2"> <h3 id="_4_1_jedinični_test_mapirati_yaml_u_kotlin_objekat">4.1. Jedinični test : Mapirati YAML u Kotlin objekat</h3> <div class="paragraph"> <p>Počinjemo sa jediničnim testom u`SiteBakerPluginTest.kt`за проверу да функција`parseSiteConfiguration`може правилно претворити YAML низ у објекат`SiteConfiguration`.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// plugin/src/test/kotlin/com/cheroliv/site/baker/SiteBakerPluginTest.kt @Test fun `can map configuration text to SiteConfiguration object`() { val yamlString = "../../managed-jbake-context.yml" .run(::File) .readText() .trimIndent() val config: SiteConfiguration = parseSiteConfiguration(yamlString) assertEquals("cheroliv.com", config.bake.cname) assertEquals("main", config.pushPage.branch) assertEquals("https://github.com/pages-content/pages-content.github.io.git", config.pushPage.repo.repository) }</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj test čita sadržaj fajla`managed-jbake-context.yml`(koji mora da postoji da bi test bio važeći) i izvršava tvrdnje na objektu`SiteConfiguration`резултант. Он проверава да ли кључне вредности YAML су правилно пресликане.</p> </div> </div> <div class="sect2"> <h3 id="_4_2_funkcionišni_test_provera_čitanja_konfiguracionog_fajla">4.2. Funkcionišni test : Provera čitanja konfiguracionog fajla</h3> <div class="paragraph"> <p>Da bismo se uverili da plugin može da pročita fajl konfiguracije kroz svoj DSL i da parsiranje radi u stvarnom Gradle okruženju, dodajemo funkcionalni test u`SiteBakerPluginFunctionalTest.kt`.</p> </div> <div class="paragraph"> <p>Оvaj тест је веома битан јер симулира извршавање додатка у stvarном пројекту. Мора да буде<strong>hermetički</strong>, to jest da mora sam da kreira fajl`managed-jbake-context.yml`sa kontrolisanim sadržajem, da bi se osigurala ponovljivost i izolacija testa</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// plugin/src/functionalTest/kotlin/com/cheroliv/site/baker/SiteBakerPluginFunctionalTest.kt @Test fun `config file contains good data`(){ val configContent = configFile.readText(UTF_8) // Vérifications comme dans vos commentaires assertTrue(configContent.contains("bake")) assertTrue(configContent.contains("pushPage")) assertTrue(configContent.contains("repository")) }</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj funkcionalni test proverava da li fajl konfiguracije kopiran u privremeni direktorijum testa sadrži ocekivane podatke. Iako ovaj test ne parsira direktno YAML u Kotlin objekat, validira prisustvo fajla i njegovog sadržaja, što je neophodan prethodan korak za parsiranje od strane plugin‑a.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_5_vizualizacija_toka_parsiranja">5. Vizualizacija toka parsiranja</h2> <div class="sectionbody"> <div class="paragraph"> <p>Sljedeći dijagram ilustruje tok podataka i interakcije tokom parsiranja YAML konfiguracije:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml actor "Корисник Gradle" as User participant "build.gradle.kts" as BuildScript participant "SiteBakerPlugin" as Plugin participant "Proširenje sajta" as Extension participant "managed-bake-context.yml" as ConfigFile participant "parsirajKonfiguracijuSajta()" as Parser participant "SiteConfiguration (Kotlin objekat)" as KotlinObject User -> BuildScript : Applique le plugin et configure le DSL BuildScript -> Plugin : apply() Plugin -> Extension : Crée et enregistre l'extension 'site' User -> BuildScript : site { configPath = "..." } BuildScript -> Extension : Définit configPath Plugin -> ConfigFile : Lit le fichier (via configPath) ConfigFile --> Plugin : Contenu YAML Plugin -> Parser : Appelle parseSiteConfiguration(yamlString) Parser -> KotlinObject : Mappe le YAML en objet SiteConfiguration KotlinObject --> Plugin : Retourne l'objet configuré @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Sledeći TDD pristup, uspešno smo integrirali biblioteku Jackson za parsiranje YAML konfiguracionih fajlova u Kotlin objekte u našem Gradle plug-inu. Ova nam metoda je omogućila:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Modelovati jasno</strong>naša konfiguracija sa Kotlin data klasama.</p> </li> <li> <p><strong>Потврдити логику парсинга</strong>sa ciljnim jediničnim testovima.</p> </li> <li> <p><strong>Osigurati integraciju</strong>u realnom Gradle okruženju zahvaljujući hermetičkim funkcionalnim testovima</p> </li> </ul> </div> <div class="paragraph"> <p>Ova jaka baza nam daje veliko pouzdanje da proširimo naš plugin sa funkcionalnostima koje se baziraju na ovoj konfiguraciji, uz osiguravanje održivosti i jakosti koda. Parsiranje YAML sada je pouzdana i testirana funkcionalnost našeg plugina.<code>site-baker</code>.</p> </div> </div> </div> https://cheroliv.com/blog/2025/0090_TDD_gradle_plugin_post.html Wed, 24 Sep 2025 00:00:00 +0000 blog/2025/0090_TDD_gradle_plugin_post.html <div id="toc" class="toc"> <div id="toctitle">Table of Contents</div> <ul class="sectlevel1"> <li><a href="#_1_иницијализација_пројекта">1. Иницијализација пројекта</a></li> <li><a href="#_2_nas_prvi_tdd_ciklus_unesi_zadatak">2. Nas prvi TDD ciklus: unesi zadatak</a> <ul class="sectlevel2"> <li><a href="#_2_1_први_тест_тест_који_није_успео">2.1. Први тест (Тест који није успео)</a></li> <li><a href="#_2_2_kod_nakon_uspostavi_test">2.2. Kod nakon (Uspostavi test)</a></li> </ul> </li> <li><a href="#_3_drugi_ciklus_tdd_dodati_dsl_ekstenziju">3. Drugi ciklus TDD: Dodati DSL ekstenziju</a> <ul class="sectlevel2"> <li><a href="#_3_1_тест_први">3.1. Тест први</a></li> <li><a href="#_3_2_sledeći_kod">3.2. Sledeći kod</a></li> </ul> </li> <li><a href="#_4_funkcionalni_test_validacija_integracije">4. Funkcionalni test: Validacija integracije</a> <ul class="sectlevel2"> <li><a href="#_4_1_test_integracije_kreirati_kontrolisano_okruženje">4.1. Test integracije: Kreirati kontrolisano okruženje</a></li> <li><a href="#_4_2_završiti_logiku">4.2. Završiti logiku</a></li> </ul> </li> <li><a href="#_zaključak">Zaključak</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <p>U ovom članku bićemo istraživali kako postaviti čvrsto temelj za razvoj Gradle plugina koristeći pristup Test-Driven Development (TDD). Ova metoda nam osigurava da je naš kod robustan, Drživ i tačno odgovara zahtevima od samog početka.</p> </div> </div> </div> <div class="sect1"> <h2 id="_1_иницијализација_пројекта">1. Иницијализација пројекта</h2> <div class="sectionbody"> <div class="paragraph"> <p>Gradle olakšava kreiranje novog plugina zahvaljujući naredbi`gradle init`. Izborom da kreiramo "Gradle Plugin" uz Kotlin, dobijamo spremnu strukturu projekta koja uključuje dva ključna tipa testova :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Jedinični testovi :</strong>položeni u`src/test`, oni omogućavaju validaciju izolovanih komponenti naše dodatka, kao što je interna logika zadatka ili konfiguracija dodatka. Oni su brzi i ne zahtevaju punu izvršavanje Gradle.</p> </li> <li> <p><strong>Funkcionalni testovi :</strong>Smješteni u`src/functionalTest`, oni koriste`GradleRunner`Za izvršavanje kompletne Gradle gradnje u privremenom testnom projektu. Ovo nam omogućava da proverimo stvarno ponašanje plugina u kontrolisanom okruženju.</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_2_nas_prvi_tdd_ciklus_unesi_zadatak">2. Nas prvi TDD ciklus: unesi zadatak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Naša prva zahteva je jednostavna: plugin mora da zabilježi nazvan zadatak`printSiteConfig`.</p> </div> <div class="sect2"> <h3 id="_2_1_први_тест_тест_који_није_успео">2.1. Први тест (Тест који није успео)</h3> <div class="paragraph"> <p>U skladu sa TDD-om, prvo pišemo test koji proverava da li postoji ovaj zadatak. U`SiteBakerPluginTest.kt`(naš fajl za jedinični test), dodajemo :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `plugin registers task`() { // Créer un projet de test en mémoire val project = ProjectBuilder.builder().build() project.plugins.apply("com.cheroliv.site-baker") // Vérifier que la tâche a bien été enregistrée assertNotNull(project.tasks.findByName("printSiteConfig")) }</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj test ne uspeva, jer smo još nijedan kod napisali u našem pluginu.</p> </div> </div> <div class="sect2"> <h3 id="_2_2_kod_nakon_uspostavi_test">2.2. Kod nakon (Uspostavi test)</h3> <div class="paragraph"> <p>Sada, pišemo minimalno potrebni kod u`SiteBakerPlugin.kt`da bi test prošao :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">class SiteBakerPlugin: Plugin<Project> { override fun apply(project: Project) { // Enregistrer une tâche simple project.tasks.register("printSiteConfig") { task -> // ... la logique de la tâche viendra plus tard } } }</code></pre> </div> </div> <div class="paragraph"> <p>Ponovo pokrećemo testove, i oni prolaze. Naša prva funkcionalnost je validovana.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_3_drugi_ciklus_tdd_dodati_dsl_ekstenziju">3. Drugi ciklus TDD: Dodati DSL ekstenziju</h2> <div class="sectionbody"> <div class="paragraph"> <p>Sledeći zahtev je omogućiti korisnicima da konfigurisu naš plugin putem DSL bloka u njihovom`build.gradle.kts`. Želimo blok`site { …​ }`где може да се наведе путања конфигурације.</p> </div> <div class="sect2"> <h3 id="_3_1_тест_први">3.1. Тест први</h3> <div class="paragraph"> <p>Dodajemo test da proverimo da li je ekstenzija`site`Je dobro evidentirano i možemo joj dodeliti vrednost.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `plugin registers extension`() { val project = ProjectBuilder.builder().build() project.plugins.apply("com.cheroliv.site-baker") // Récupérer l'extension et lui affecter une valeur project.extensions .findByType(SiteExtension::class.java)!! .configPath .set("config.yml") // Vérifier que la valeur a bien été prise en compte assertEquals( "config.yml", project.extensions.findByType(SiteExtension::class.java)?.configPath?.get() ) }</code></pre> </div> </div> <div class="paragraph"> <p>Овај тест не успева ни класа`SiteExtension`ni evidencija ekstenzije ne postoji</p> </div> </div> <div class="sect2"> <h3 id="_3_2_sledeći_kod">3.2. Sledeći kod</h3> <div class="paragraph"> <p>Kreiramo klasu`SiteBakerExtension.kt`i ažuriramo`SiteBakerPlugin.kt`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// SiteBakerExtension.kt open class SiteExtension @Inject constructor(objects: ObjectFactory) { val configPath: Property<String> = objects.property(String::class.java) } // SiteBakerPlugin.kt class SiteBakerPlugin: Plugin<Project> { override fun apply(project: Project) { // Enregistrer l'extension val extension = project.extensions.create("site", SiteExtension::class.java) project.tasks.register("printSiteConfig") { task -> task.doLast { // On utilisera l'extension plus tard } } } }</code></pre> </div> </div> <div class="paragraph"> <p>Testovi ponovo prolaze.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_4_funkcionalni_test_validacija_integracije">4. Funkcionalni test: Validacija integracije</h2> <div class="sectionbody"> <div class="paragraph"> <p>Sada kada su jedinice testirane, moramo se uveriti da sve radi zajedno u stvarnoj gradnji. To je uloga funkcionalnog testa u`SiteBakerPluginFunctionalTest.kt`.</p> </div> <div class="sect2"> <h3 id="_4_1_test_integracije_kreirati_kontrolisano_okruženje">4.1. Test integracije: Kreirati kontrolisano okruženje</h3> <div class="paragraph"> <p>Ovaj test će simulirati pravi projekat koji koristi naš plugin. Da bi bio pouzdan, mora biti<strong>hermetski</strong>, to jest da ne smije zavisiti od postojećih datoteka na sistemu. On mora sam stvoriti sve neophodne uslove za njegovo izvršenje.</p> </div> <div class="paragraph"> <p>Test će dakle :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Napraviti jedan`build.gradle.kts`test koji koristi naš plugin i njegov DSL.</p> </li> <li> <p><strong>Kreirajte datoteku konfiguracije</strong>(<code>managed-jbake-context.yml</code>) što plugin treba da pročita. Ovo je ključni korak za robustnost testa.</p> </li> <li> <p>Izvršiti zadatak`printSiteConfig`преку`GradleRunner`.</p> </li> <li> <p>Proveri da li je izlaz izgradnje ispravan.</p> </li> </ol> </div> <div class="paragraph"> <p>Kopirandom ili stvaranjem ove datoteke konfiguracije pri svakom pokretanju, osiguravamo da je test<strong>повторљив</strong>i ne zavisi od vanjskog stanja. Ovo zaštičava naše testove od regresija koje bi mogle biti povezane sa čitanjem fajla.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `can run task with DSL`() { // 1. Créer un build.gradle.kts de test buildFile.writeText(""" plugins { id("com.cheroliv.site-baker") } site { configPath = "managed-jbake-context.yml" } """.trimIndent()) // 2. Créer le fichier de configuration pour un test contrôlé val configFile = File(projectDir, "managed-jbake-context.yml") configFile.writeText("site: { title: 'Mon Site de Test' }") // Contenu YAML simple // 3. Exécuter la build val runner = GradleRunner.create() runner.withPluginClasspath() runner.withArguments("printSiteConfig") runner.withProjectDir(projectDir) // Spécifier le répertoire du projet de test val result = runner.build() // 4. Vérifier la sortie assertTrue(result.output.contains("Site config path: managed-jbake-context.yml")) }</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj test će neudati dok je zadatak`printSiteConfig`Neće zapravo koristiti vrednost ekstenzije.</p> </div> </div> <div class="sect2"> <h3 id="_4_2_završiti_logiku">4.2. Završiti logiku</h3> <div class="paragraph"> <p>Ažuriramo zadatak u`SiteBakerPlugin.kt`da bi prikazala konfigurisanu vrednost:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">project.tasks.register("printSiteConfig") { task -> task.doLast { println("Site config path: ${extension.configPath.get()}") } }</code></pre> </div> </div> <div class="paragraph"> <p>Svi testovi, jedinični i funkcionalni, sada prolaze.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Sledeći pristup TDD, izgradili smo plugin inkrementalno i bezbedno. Svaka mala funkcionalnost se odmah validira testem, od brzi unitarni testovi do funkcionalnih testova koji validiraju kompletnu integraciju.</p> </div> <div class="paragraph"> <p>Pažljivo čineći naše teste funkcionalnim<strong>hermetски</strong>— naročito programski kreiranjem potrebnih konfiguraционных fajlova — gradimo ekstremno jaku mrežu bezbednosti. Ova riguroznost nam efikasno štiti od regresija i nam daje veliko poverenje da dodajemo složenije funkcionalnosti kasnije, kao što je parsiranje YAML konfiguraционог fajla.</p> </div> <div class="paragraph"> <p>Ova čvrsta baza testova je najvažnija vrednost za održavanje i budući razvoj plugin-a.</p> </div> </div> </div> https://cheroliv.com/blog/2025/0089_creation_projet_plugin_gradle_post.html Tue, 23 Sep 2025 00:00:00 +0000 blog/2025/0089_creation_projet_plugin_gradle_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_увод">Увод</a></li> <li><a href="#_корак_1_покренути_асистент_пројекта">Корак 1: Покренути асистент пројекта</a></li> <li><a href="#_korak_2_razumeti_generisanu_strukturu">Korak 2: Razumeti generisanu strukturu</a> <ul class="sectlevel2"> <li><a href="#_fajlovi_i_ključni_folderi">Fajlovi i ključni folderi</a></li> </ul> </li> </ul> </div> <div class="sect1"> <h2 id="_увод">Увод</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title">Ciljna grupa: Početni do srednji programer sa Gradle-om.</div> <p>Pokretanje novog projekta Gradle dodatka može da izgleda užasno. Na sreću, Gradle pruža moćan interaktivni asistent, zadatak`init`, koji generiše kompletnu, čistu i spremnu strukturu projekta. Ovaj vodič će vam pokazati kako koristiti ovaj alat da kreirate zdravu bazu dodatka, objasniće strukturu i pokazaće vam kako pokrenuti prve zadatke gradnje.</p> </div> </div> </div> <div class="sect1"> <h2 id="_корак_1_покренути_асистент_пројекта">Корак 1: Покренути асистент пројекта</h2> <div class="sectionbody"> <div class="paragraph"> <p>Komanda`gradle init`Je početna tačka. Ona pokreće komandni asistent koji vam postavlja seriju pitanja za podešavanje projekta.</p> </div> <div class="paragraph"> <p>Otvorite vaš terminal u praznoj mapi i pokrenite :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">gradle init</code></pre> </div> </div> <div class="paragraph"> <p>Asistent će vas voditi. Evo izbora koji treba učiniti za Gradle plugin napisan u Kotlinu:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Izaberite tip projekta za generiranje:</strong>Izaberite`Gradle plugin`.</p> </li> <li> <p><strong>Izaberite jezik implementacije:</strong>Izaberite`Kotlin`.</p> </li> <li> <p><strong>Izaberite DSL za skriptu građenja:</strong>Изаберите`Kotlin`.</p> </li> <li> <p><strong>Назив пројекта :</strong>Unesite naziv vašeg projekta (primer:`site-baker`).</p> </li> <li> <p><strong>Идентификатор додатка:</strong>Дайте својој додатку јединствени идентификатор (пример:`com.cheroliv.site-baker`)</p> </li> <li> <p><strong>Plugin klasa:</strong>Navedite naziv klase implementacije (ex:`com.cheroliv.SiteBakerPlugin`).</p> </li> </ol> </div> <div class="paragraph"> <p>Kada se završi, Gradle generira kompletno stablo datoteka.</p> </div> <div class="listingblock"> <div class="title">дијаграм процеса иницијалисања</div> <div class="content"> <pre>@startuml start :Lancer `gradle init`; :Choisir "Gradle plugin"; :Choisir "Kotlin" (langage); :Choisir "Kotlin" (DSL); :Saisir nom, ID, et classe; :Projet généré; stop @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_korak_2_razumeti_generisanu_strukturu">Korak 2: Razumeti generisanu strukturu</h2> <div class="sectionbody"> <div class="paragraph"> <p>Asistent kreira višemodularnu strukturu projekta, odvajajući korenski projekat od izvornog koda plugin-a samog.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">. ├── gradle/ │ └── wrapper/ │ ├── gradle-wrapper.jar │ └── gradle-wrapper.properties ├── gradlew ├── gradlew.bat ├── plugin/ │ ├── build.gradle.kts │ └── src/ │ ├── main/ │ │ └── kotlin/ │ │ └── com/cheroliv/SiteBakerPlugin.kt │ ├── test/ │ │ └── kotlin/ │ │ └── com/cheroliv/SiteBakerPluginTest.kt │ └── functionalTest/ │ └── kotlin/ │ └── com/cheroliv/SiteBakerPluginFunctionalTest.kt └── settings.gradle.kts</code></pre> </div> </div> <div class="sect2"> <h3 id="_fajlovi_i_ključni_folderi">Fajlovi i ključni folderi</h3> <div class="ulist"> <ul> <li> <p><code>settings.gradle.kts`Ovaj fajl u korenu definiše module koji su uključeni u build. Ovde uključe podprojekat.`plugin</code>.</p> </li> </ul> </div> <div class="paragraph"> <p>[source,kotlin] ---- rootProject.name = "site-baker include("plugin") ----</p> </div> <div class="listingblock"> <div class="content"> <pre></pre> </div> </div> </div> </div> </div> https://cheroliv.com/blog/2025/0088_environnement_plugin_gradle_post.html Mon, 22 Sep 2025 00:00:00 +0000 blog/2025/0088_environnement_plugin_gradle_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_uvod">Uvod</a></li> <li><a href="#_1_jdk_pokretač_gradle">1. JDK : Pokretač Gradle</a> <ul class="sectlevel2"> <li><a href="#_koja_verzija_da_se_izabere">Koja verzija da se izabere?</a></li> <li><a href="#_instalacija_preko_sdkman_preporučeno">Instalacija preko SDKMAN! (Preporučeno)</a> <ul class="sectlevel3"> <li><a href="#_instaliraj_sdkman"><strong>Instaliraj SDKMAN!</strong></a></li> <li><a href="#_instalirati_verziju_jdk"><strong>Instalirati verziju JDK</strong></a></li> <li><a href="#_провери_инсталацију">Провери инсталацију</a></li> </ul> </li> </ul> </li> <li><a href="#_2_ide_intellij_idea">2. IDE : IntelliJ IDEA</a></li> <li><a href="#_3_gradle_alat_za_izgradnju">3. Gradle : alat za izgradnju</a> <ul class="sectlevel2"> <li><a href="#_instalacija_putem_sdkman">Instalacija putem SDKMAN!</a> <ul class="sectlevel3"> <li><a href="#_instaliraj_gradle"><strong>Instaliraj Gradle</strong></a></li> <li><a href="#_проверити_инсталацију">Проверити инсталацију</a></li> </ul> </li> </ul> </li> <li><a href="#_4_jbake_generator_statičkog_sajta">4. JBake : Generator statičkog sajta</a> <ul class="sectlevel2"> <li><a href="#_instalacija_putem_sdkman_2">Instalacija putem SDKMAN!</a> <ul class="sectlevel3"> <li><a href="#_instaliraj_jbake"><strong>Instaliraj JBake</strong></a></li> <li><a href="#_proveriti_instalaciju">Proveriti instalaciju</a></li> </ul> </li> </ul> </li> <li><a href="#_5_gradle_wrapper_najbolja_praksa">5. Gradle Wrapper: Najbolja praksa</a></li> <li><a href="#_6_docker_i_portainer_za_ponavljive_gradnje_opciono">6. Docker i Portainer: Za ponavljive gradnje (opciono)</a> <ul class="sectlevel2"> <li><a href="#_instalacija_docker_engine">Instalacija Docker Engine</a> <ul class="sectlevel3"> <li><a href="#_instalirajte_docker_putem_zvaničnog_skripta"><strong>Instalirajte Docker putem zvaničnog skripta :</strong></a></li> <li><a href="#_upravljanje_docker_om_bez_sudo_preporučeno">Upravljanje Docker-om bez <code>sudo</code> (preporučeno) :</a></li> </ul> </li> <li><a href="#_управљање_docker_ом_користијући_portainer_gui">Управљање Docker-ом користијући Portainer (GUI)</a> <ul class="sectlevel3"> <li><a href="#_kreirati_volumen_za_podatke_portainer">Kreirati volumen za podatke Portainer :</a></li> <li><a href="#_pokreni_portainer_kontejner">Pokreni Portainer kontejner :</a></li> </ul> </li> </ul> </li> <li><a href="#_zaključak">Zaključak</a></li> </ul> </div> <div class="sect1"> <h2 id="_uvod">Uvod</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title">Ciljna grupa : Programeri koji želju da se uđu u kreiranje Gradle pluginova.</div> <p>Za efikasno razvoj Gradle pluginova, neophodno je dobro podešeno razvojno okruženje. Dobro podešavanje vam će uštedeti vreme, smanjiti frustracije i osigurati konzistentnost vaših buildova.</p> </div> <div class="olist arabic"> <div class="title">Ovaj vodič se koncentruje na četiri bitna stupa :</div> <ol class="arabic"> <li> <p>Le <strong>JDK</strong>(Java Development Kit), jer Gradle i JBake pokreću se na JVM.</p> </li> <li> <p>Un <strong>IDE</strong>moderno (IntelliJ IDEA) sa dobrom podrškom za Kotlin i Gradle.</p> </li> <li> <p><strong>Gradle</strong>sebe, da inicijalizuje projekte.</p> </li> <li> <p><strong>JBake</strong>, motor našeg statičkog sajta.</p> </li> </ol> </div> <div class="listingblock"> <div class="title">Komponenti razvojnog okruženja</div> <div class="content"> <pre>@startuml !theme plain node "Машина програмера" { component "JDK (JVM)" as JDK component "IntelliJ IDEA" as IDE component "Gradle (globalni)" as Gradle component "JBake (globalno)" as JBake IDE --> JDK : utilise Gradle --> JDK : utilise JBake --> JDK : utilise } @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_1_jdk_pokretač_gradle">1. JDK : Pokretač Gradle</h2> <div class="sectionbody"> <div class="paragraph"> <p>Gradle je aplikacija koja se izvršava na Java Virtual Machine (JVM). Zato, instalacija JDK-a je apsolutni preduslov.</p> </div> <div class="sect2"> <h3 id="_koja_verzija_da_se_izabere">Koja verzija da se izabere?</h3> <div class="paragraph"> <p>Preporučuje se da se koristi verzija LTS (Long-Term Support) Jave. Тренутно,<strong>JDK 17</strong> ou <strong>JDK 21</strong>су отлични избори.</p> </div> </div> <div class="sect2"> <h3 id="_instalacija_preko_sdkman_preporučeno">Instalacija preko SDKMAN! (Preporučeno)</h3> <div class="paragraph"> <p>SDKMAN! je odličan alat za upravljanje verzijama mnogih SDK-a, uključujući Java i Gradle.</p> </div> <div class="sect3"> <h4 id="_instaliraj_sdkman"><strong>Instaliraj SDKMAN!</strong></h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">curl -s "https://get.sdkman.io" | bash source "$HOME/.sdkman/bin/sdkman-init.sh"</code></pre> </div> </div> </div> <div class="sect3"> <h4 id="_instalirati_verziju_jdk"><strong>Instalirati verziju JDK</strong></h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Pour lister les versions de Java disponibles sdk list java # Pour installer Java 17 (par exemple, la distribution Temurin) sdk install java 17.0.8-tem</code></pre> </div> </div> </div> <div class="sect3"> <h4 id="_провери_инсталацију">Провери инсталацију</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">java -version</code></pre> </div> </div> <div class="paragraph"> <p>Trebalo bi da vidite verziju koju ste upravo instalirali da se prikaže.</p> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_2_ide_intellij_idea">2. IDE : IntelliJ IDEA</h2> <div class="sectionbody"> <div class="paragraph"> <p>Za razvoj Gradle dodataka sa Kotlin DSL-om,<strong>IntelliJ IDEA</strong>je alat izbora. Njegova integracija sa Gradle i Kotlinom je nepoređena.</p> </div> <div class="ulist"> <ul> <li> <p><strong>Издање за заједницу :</strong>Besplatna i dovoljna za početak.</p> </li> <li> <p><strong>Ultimate Edition :</strong>Плаћена, нуди напредне функционалности за веб развој и базе података.</p> </li> </ul> </div> <div class="paragraph"> <p>Преузмите верзију која вам одговара са сајта JetBrains: <a href="https://www.jetbrains.com/idea/download/" class="bare">https://www.jetbrains.com/idea/download/</a></p> </div> <div class="paragraph"> <p>IDE će automatski detektovati vaše fajlove.<code>build.gradle.kts</code> et <code>settings.gradle.kts</code>, nudeći vam snažnu autodopunu, navigaciju kroz kod i integrirane alate za debugiranje.</p> </div> </div> </div> <div class="sect1"> <h2 id="_3_gradle_alat_za_izgradnju">3. Gradle : alat za izgradnju</h2> <div class="sectionbody"> <div class="paragraph"> <p>Čak i ako će svaki projekat koristiti svoju verziju Gradle kroz Gradle Wrapper, korisno je imati globalnu instalaciju Gradle za zadatke kao što je inicijalizacija novih projekata (<code>gradle init</code>).</p> </div> <div class="sect2"> <h3 id="_instalacija_putem_sdkman">Instalacija putem SDKMAN!</h3> <div class="paragraph"> <p>Slično kao i za JDK, SDKMAN! pojednostavljuje instalaciju Gradle.</p> </div> <div class="sect3"> <h4 id="_instaliraj_gradle"><strong>Instaliraj Gradle</strong></h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sdk install gradle</code></pre> </div> </div> </div> <div class="sect3"> <h4 id="_проверити_инсталацију">Проверити инсталацију</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">gradle -v</code></pre> </div> </div> <div class="paragraph"> <p>Ова команда ће приказати верзије Gradle, Kotlin, Groovy и JDK-a које се користе.</p> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_4_jbake_generator_statičkog_sajta">4. JBake : Generator statičkog sajta</h2> <div class="sectionbody"> <div class="paragraph"> <p>JBake je alat koji ćemo koristiti da pretvorimo naše izvorne fajlove (kao ovaj) u statički web sajt. Imati lokalnu instalaciju je praktično za pregled promena.</p> </div> <div class="sect2"> <h3 id="_instalacija_putem_sdkman_2">Instalacija putem SDKMAN!</h3> <div class="paragraph"> <p>Kao i za ostale alate, SDKMAN! je najjednostavnija metoda.</p> </div> <div class="sect3"> <h4 id="_instaliraj_jbake"><strong>Instaliraj JBake</strong></h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sdk install jbake</code></pre> </div> </div> </div> <div class="sect3"> <h4 id="_proveriti_instalaciju">Proveriti instalaciju</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">jbake -v</code></pre> </div> </div> <div class="paragraph"> <p>Ova komanda će prikazati verziju JBake i informacije o Java okruženju koje koristi.</p> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_5_gradle_wrapper_najbolja_praksa">5. Gradle Wrapper: Najbolja praksa</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kada vaš projekat bude kreiran (što ćemo videti u sledećem članku), ne bi trebalo da više koristite globalnu komandu.<code>gradle</code>. Umesto toga, ćete ga koristiti<strong>Gradle omotač</strong>(<code>./gradlew</code>), jedna skripta uključena u vašem projektu.</p> </div> <div class="paragraph"> <p>Zašto ?</p> </div> <div class="ulist"> <ul> <li> <p><strong>Репродуктивност :</strong>Ovaj Wrapper garantuje da svako lice koje radi na projektu (uključujući vaš CI/CD server) koristi tačno<strong>ista verzija Gradle</strong>, tako uklanjajući greške u izgradnji zbog različitih okruženja.</p> </li> <li> <p><strong>Jednostavnost :</strong>Нема потребе да ручно инсталирате Gradle за да допринесете пројекту.</p> </li> </ul> </div> <div class="paragraph"> <p>Dovoljno je klonirati repozitorijum i pokrenuti`./gradlew`.</p> </div> <div class="paragraph"> <p>Tipična komanda će izgledati ovako:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Ne pas faire : gradle build # À faire : ./gradlew build</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_6_docker_i_portainer_za_ponavljive_gradnje_opciono">6. Docker i Portainer: Za ponavljive gradnje (opciono)</h2> <div class="sectionbody"> <div class="paragraph"> <p>Iako nisu strogo neophodni za pisanje plugina, Docker i Portainer su moderni DevOps alati koji olakšavaju kreiranje reproduktivnih buildova i upravljanje vašim okruženjem.</p> </div> <div class="sect2"> <h3 id="_instalacija_docker_engine">Instalacija Docker Engine</h3> <div class="paragraph"> <p>Docker vam omogućava da pakujete vašu aplikaciju i njene zavisnosti u kontejneru.</p> </div> <div class="sect3"> <h4 id="_instalirajte_docker_putem_zvaničnog_skripta"><strong>Instalirajte Docker putem zvaničnog skripta :</strong></h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">curl -fsSL https://get.docker.com -o get-docker.sh sudo sh get-docker.sh</code></pre> </div> </div> </div> <div class="sect3"> <h4 id="_upravljanje_docker_om_bez_sudo_preporučeno">Upravljanje Docker-om bez <code>sudo</code> (preporučeno) :</h4> <div class="paragraph"> <p>Додајте вашог корисника у групу.<code>docker</code>.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo usod -aG docker $USER</code></pre> </div> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="Important"></i> </td> <td class="content"> </td> </tr> </table> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">docker run hello-world</code></pre> </div> </div> </div> </div> <div class="sect2"> <h3 id="_управљање_docker_ом_користијући_portainer_gui">Управљање Docker-ом користијући Portainer (GUI)</h3> <div class="paragraph"> <p>Portainer je lagani web interfejs za upravljanje vašim Docker kontejnerima.</p> </div> <div class="sect3"> <h4 id="_kreirati_volumen_za_podatke_portainer">Kreirati volumen za podatke Portainer :</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">docker volume create portainer_data</code></pre> </div> </div> </div> <div class="sect3"> <h4 id="_pokreni_portainer_kontejner">Pokreni Portainer kontejner :</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">docker run -d -p 8000:8000 -p 9443:9443 --name portainer --restart=always -v /var/run/docker.sock:/var/run/docker.sock -v portainer_data:/data portainer/portainer-ce:latest</code></pre> </div> </div> <div class="paragraph"> <p>Vi sada možete da pristupite interfejsu Portainer-a na`https://localhost:9443`.</p> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Vaše okruženje je sada spremno! Imate JDK, najprikladniji IDE, Gradle i JBake. Sa dodavanjem Dockera, ste takođe spremni da kreirate kontejnerizovane i reproducibili gradnje. Ova čvrsta osnova vam će omogućiti da se fokusirate na ono što je važno: razvoj jakih i korisnih dodataka.</p> </div> <div class="paragraph"> <p>У следећем чланку, ћемо користити команду`gradle init`da generišemo strukturu našeg prvog projekta dodatka</p> </div> </div> </div> https://cheroliv.com/blog/2025/0087_pypi_cicd_part_3_post.html Sat, 19 Jul 2025 00:00:00 +0000 blog/2025/0087_pypi_cicd_part_3_post.html <div id="toc" class="toc"> <div id="toctitle">Table of Contents</div> <ul class="sectlevel1"> <li><a href="#_integracija_sa_poetry">Integracija sa Poetry</a> <ul class="sectlevel2"> <li><a href="#_instalacija_poetry">Instalacija Poetry</a></li> <li><a href="#_иницијализација_пројекта">Иницијализација пројекта</a></li> <li><a href="#_додавање_и_инсталација_зависности">Додавање и инсталација зависности</a></li> <li><a href="#_objavljivanje_uz_poetry">Objavljivanje uz Poetry</a></li> </ul> </li> <li><a href="#_reproduktibilne_izgrade_sa_dockerom">Reproduktibilne izgrade sa Dockerom</a> <ul class="sectlevel2"> <li><a href="#_primer_dockerfile">Primer Dockerfile</a></li> <li><a href="#_integracija_u_github_actions">Integracija u GitHub Actions</a></li> </ul> </li> <li><a href="#_uslovna_objava">Uslovna objava</a></li> <li><a href="#_automatizacija_zavisnosti_sa_renovate_i_dependabot">Automatizacija zavisnosti sa Renovate i Dependabot</a> <ul class="sectlevel2"> <li><a href="#_dependabot">Dependabot</a></li> <li><a href="#_renovirati">Renovirati</a></li> </ul> </li> <li><a href="#_dijagrami_plantuml">Dijagrami PlantUML</a> <ul class="sectlevel2"> <li><a href="#_slučaj_upotrebe_napredno_cicd">Slučaj upotrebe – napredno CI/CD</a></li> <li><a href="#_секвенција_условно_објављивање">Секвенција – Условно објављивање</a></li> <li><a href="#_stanje_pipeline_cicd">Stanje – Pipeline CI/CD</a></li> <li><a href="#_разврштање_cicd_архитектура">Разврштање – CI/CD архитектура</a></li> </ul> </li> <li><a href="#_zaključak">Zaključak</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <p>U prvim dva dela ove serije, imali smo: - Осигуран функционалан CI/CD конвејер за Python апликацију са GitHub Actions и PyPI. - Industrijalizovan ovim pipeline-om sa testovima više verzija, postupno objavljivanjem preko Test PyPI i alatkama za kvalitet i bezbednost.</p> </div> <div class="paragraph"> <p>U ovom trećem delu, idemo ići<strong>Izvan jednostavne objave na PyPI</strong>Конструисати kompletan, jak i profesionalan CI/CD lanac sa: - <strong>Poezija</strong>за модерно упаковљење и оптимизовано управљање зависностима. - <strong>Docker</strong>за правиње репродуктивних и крос-платформских билдова. - <strong>uslovna objava</strong>да се управља scenarijima kao što su release candidates. - <strong>Алатке за аутоматизацију</strong>(Renovate, Dependabot) da bi se cipovod održao ažuriran bez napora.</p> </div> </div> </div> <div class="sect1"> <h2 id="_integracija_sa_poetry">Integracija sa Poetry</h2> <div class="sectionbody"> <div class="paragraph"> <p>Poetry zamjenjuje starije alate za pakovanje (setup.py, requirements.txt) centralizujući upravljanje zavisnostima i gradnju u`pyproject.toml`.</p> </div> <div class="sect2"> <h3 id="_instalacija_poetry">Instalacija Poetry</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-shell hljs" data-lang="shell"># Installer Poetry curl -sSL https://install.python-poetry.org | python3 - # Vérifier la version poetry --version</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_иницијализација_пројекта">Иницијализација пројекта</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-shell hljs" data-lang="shell"># Initialiser un nouveau projet avec Poetry poetry init # Suivre l'assistant pour renseigner : nom, version, description, licence, dépendances.</code></pre> </div> </div> <div class="paragraph"> <p>Ovo generiše fajl`pyproject.toml`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-toml hljs" data-lang="toml">[tool.poetry] name = "playlist-downloader" version = "0.1.0" description = "CLI tool for managing YouTube playlists" authors = ["Christophe Hérolivier <cheroliv@example.com>"] [tool.poetry.dependencies] python = ">=3.8" typer = "^0.9.0" yt-dlp = "^2023.7.6" google-api-python-client = "^2.0.0" google-auth-oauthlib = "^1.0.0" [tool.poetry.group.dev.dependencies] pytest = "^7.0" mypy = "^1.0" bandit = "^1.7" safety = "^2.3" black = "^23.0" ruff = "^0.1"</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_додавање_и_инсталација_зависности">Додавање и инсталација зависности</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-shell hljs" data-lang="shell">poetry add typer yt-dlp google-api-python-client google-auth-oauthlib poetry add --group dev pytest mypy black bandit safety ruff</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_objavljivanje_uz_poetry">Objavljivanje uz Poetry</h3> <div class="paragraph"> <p>Poetry nativno upravlja publikacijom:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-shell hljs" data-lang="shell"># Publication sur Test PyPI poetry publish --build --repository test-pypi # Publication sur PyPI poetry publish --build</code></pre> </div> </div> <div class="paragraph"> <p>Ова команда аутоматски користи информације које се налазе у`pyproject.toml`.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_reproduktibilne_izgrade_sa_dockerom">Reproduktibilne izgrade sa Dockerom</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bi se osigurali identična izvršavanja u razvoju, CI/CD i proizvodnji, Docker se savršeno integriše sa Poetry.</p> </div> <div class="sect2"> <h3 id="_primer_dockerfile">Primer Dockerfile</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-dockerfile hljs" data-lang="dockerfile">FROM python:3.11-slim WORKDIR /app COPY pyproject.toml poetry.lock ./ RUN pip install poetry RUN poetry install --no-root --only main COPY . . CMD ["poetry", "run", "python", "cli.py"]</code></pre> </div> </div> <div class="paragraph"> <p>Ovo garantuje : - Fiksno Python okruženje. - Zaključane zavisnosti kroz`poetry.lock`. - Izvršna slika na svakom sistemu koji podržava Docker.</p> </div> </div> <div class="sect2"> <h3 id="_integracija_u_github_actions">Integracija u GitHub Actions</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml">name: Docker Build on: push: branches: [main] jobs: build-docker: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - name: Build Docker image run: docker build -t ghcr.io/${{ github.repository }}:latest . - name: Push Docker image run: docker push ghcr.io/${{ github.repository }}:latest</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_uslovna_objava">Uslovna objava</h2> <div class="sectionbody"> <div class="paragraph"> <p>U profesionalnom kanalu treba moći da se objavljuje samo u određenim slučajevima: - Release candidates ka Test PyPI. - Stabilne verzije ka PyPI - Gradevi Docker pokrenuti samo za`main`.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml">- name: Publish to Test PyPI if: contains(github.ref, '-rc') run: poetry publish --build --repository test-pypi - name: Publish to PyPI if: startsWith(github.ref, 'refs/tags/v') run: poetry publish --build</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj pristup sprečava slučajne objave.</p> </div> </div> </div> <div class="sect1"> <h2 id="_automatizacija_zavisnosti_sa_renovate_i_dependabot">Automatizacija zavisnosti sa Renovate i Dependabot</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bi se izbeglo da vaše zavisnosti postanu zastarele, integrirajte alate za automatsko ažuriranje.</p> </div> <div class="sect2"> <h3 id="_dependabot">Dependabot</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml">version: 2 updates: - package-ecosystem: "pip" directory: "/" schedule: interval: "weekly" - package-ecosystem: "github-actions" directory: "/" schedule: interval: "weekly"</code></pre> </div> </div> <div class="paragraph"> <p>Dependabot otvara PR svake nedelje da ažurira Python i GitHub Actions zavisnosti.</p> </div> </div> <div class="sect2"> <h3 id="_renovirati">Renovirati</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-json hljs" data-lang="json">{ "extends": ["config:base"], "packageRules": [ { "matchManagers": ["pip"], "groupName": "python-dependencies", "schedule": ["before 6am on monday"] } ] }</code></pre> </div> </div> <div class="paragraph"> <p>Renovate omogućava finiji kontrol: grupisanje zavisnosti, planiranje i napredna pravila.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_dijagrami_plantuml">Dijagrami PlantUML</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_slučaj_upotrebe_napredno_cicd">Slučaj upotrebe – napredno CI/CD</h3> <div class="listingblock"> <div class="content"> <pre>@startuml actor Developer actor GitHub as "GitHub Actions" actor PyPI actor DockerRegistry as "Docker Registry" actor Automation as "Оновирај/Dependabot" Developer --> (Push code) (Trigger CI) --> GitHub GitHub --> (Run Tests & Lint) GitHub --> (Build Docker Image) GitHub --> DockerRegistry GitHub --> (Publish to Test PyPI) GitHub --> (Promote to PyPI) Automation --> (Update Dependencies) @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_секвенција_условно_објављивање">Секвенција – Условно објављивање</h3> <div class="listingblock"> <div class="content"> <pre>@startuml !theme vibrant left to right direction Developer -> GitHub: Push tag v1.2.3-rc GitHub -> CI: Run tests CI -> CD: Check release type CD -> Test PyPI: Publish RC Developer -> GitHub: Push tag v1.2.3 GitHub -> CD: Publish to PyPI CD -> Docker Registry: Push Docker image @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_stanje_pipeline_cicd">Stanje – Pipeline CI/CD</h3> <div class="listingblock"> <div class="content"> <pre>@startuml [*] --> Idle Idle --> CI_Running : push CI_Running --> CI_Success : tests ok CI_Running --> CI_Failed : tests fail CI_Success --> CD_Running : tag detected CD_Running --> CD_Success : publish ok CD_Running --> CD_Failed : error CD_Success --> [*] @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_разврштање_cicd_архитектура">Разврштање – CI/CD архитектура</h3> <div class="listingblock"> <div class="content"> <pre>@startuml node "Mašina developera" { component "Klijent Git" } node "GitHub akcije" { component "CI radni tok" component "CD radni tok" } node "Репозиторијуми пакета" { artifact "Testiranje PyPI" artifact "PyPI" artifact "Регистар Докер" } "Mašina developera" --> "GitHub akcije" "GitHub akcije" --> "Testiranje PyPI" "GitHub akcije" --> "PyPI" "GitHub akcije" --> "Регистар Докер" @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>У овој трећој части, смо видели како : - Modernizovati pakovanje Python-a pomoću Poetry. - Osigurati reproizvodive gradnje kroz Docker. Postaviti uslovno objavljivanje. - Automatizujte ažuriranje zavisnosti.</p> </div> <div class="paragraph"> <p>Сада имате CI/CD пајплај.<strong>сав, индустриализовaн и сигуран</strong>, spreman da se razvija sa vašim projektima.</p> </div> </div> </div> https://cheroliv.com/blog/2025/0086_pypi_cicd_part_2_post.html Fri, 18 Jul 2025 00:00:00 +0000 blog/2025/0086_pypi_cicd_part_2_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_uvod">Uvod</a></li> <li><a href="#_arhitektura_cicd_pipeline">Arhitektura CI/CD pipeline</a></li> <li><a href="#_struktura_projekta">Struktura projekta</a></li> <li><a href="#_конфигурација_пакета_са_pyproject_toml">Конфигурација пакета са pyproject.toml</a></li> <li><a href="#_workflow_cicd_testovi_i_kvalitet">Workflow CI/CD - Testovi i Kvalitet</a></li> <li><a href="#_radni_tok_za_objavu_i_implementaciju">Radni tok za objavu i implementaciju</a></li> <li><a href="#_дијаграми_архитектуре">Дијаграми архитектуре</a> <ul class="sectlevel2"> <li><a href="#_дијаграм_последовательности_процес_издања">Дијаграм последовательности - Процес издања</a></li> <li><a href="#_dijagram_stanja_životni_ciklus_paketa">Dijagram stanja - Životni ciklus paketa</a></li> <li><a href="#_dijagram_raspoređivanja_cicd_infrastruktura">Dijagram raspoređivanja - CI/CD infrastruktura</a></li> </ul> </li> <li><a href="#_predmeti_i_modeli_pipeline_a">Predmeti i modeli pipeline-a</a> <ul class="sectlevel2"> <li><a href="#_дијаграм_класа_модели_cicd">Дијаграм класа - Модели CI/CD</a></li> </ul> </li> <li><a href="#_konfiguracija_tajni">Konfiguracija tajni</a> <ul class="sectlevel2"> <li><a href="#_tajne_github_actions">Tajne GitHub Actions</a></li> <li><a href="#_генерација_pypi_токена">Генерација PyPI токена</a></li> </ul> </li> <li><a href="#_skripte_lokalnog_razvoja">Skripte lokalnog razvoja</a> <ul class="sectlevel2"> <li><a href="#_makefile">Makefile</a></li> <li><a href="#_скрипта_верзије">Скрипта верзије</a></li> </ul> </li> <li><a href="#_добре_праксе_и_препоруке">Добре праксе и препоруке</a> <ul class="sectlevel2"> <li><a href="#_семантичко_верционирање">Семантичко верционирање</a></li> <li><a href="#_strategija_grananja">Strategija grananja</a></li> <li><a href="#_testovi_i_pokrivenost">Testovi i pokrivenost</a></li> <li><a href="#_bezbednost">Bezbednost</a></li> </ul> </li> <li><a href="#_monitoring_i_observabilnost">monitoring i observabilnost</a> <ul class="sectlevel2"> <li><a href="#_metrike_pipeline">Metrike pipeline</a></li> <li><a href="#_obaveštenja">Obaveštenja</a></li> </ul> </li> <li><a href="#_закључак">Закључак</a></li> <li><a href="#_додатни_ресурси">Додатни ресурси</a></li> </ul> </div> <div class="sect1"> <h2 id="_uvod">Uvod</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title">Cilj : Preobraziti jednostavni pipeline u jak industrielni pipeline, koji poštuje moderne standarde pakovanja i softverskog inženjerstva.</div> <p>U prvom delu ove serije, smo izgradili jednostavan ali efikasan CI/CD pipeline za automatizaciju testiranja i objavljivanja Python paketa na PyPI.</p> </div> <div class="paragraph"> <p>Sada je vreme da profesionalizujemo ovaj pipeline. U ovom drugom delu, ćemo :</p> </div> <div class="ulist"> <ul> <li> <p>Migrirati na moderni standard pyproject.toml,</p> </li> <li> <p>Додати алате квалитета и безбедности (Black, Mypy, Bandit, Safety),</p> </li> <li> <p>Postaviti testove za više verzija,</p> </li> <li> <p>Интеграција постепеног распоређења кроз Test PyPI,</p> </li> <li> <p>Automatizovati verzioniranje i unaprediti nadzor pipelinea.</p> </li> </ul> </div> <div class="paragraph"> <p>Pripremite se da pređete iz funkcionalnog pipelajna u profesionalnu CI/CD infrastrukturu.</p> </div> <div class="paragraph"> <p>Deployovanje Python aplikacije na PyPI zahteva jak CI/CD pipeline koji automatizuje testiranje, gradanje i objavljivanje paketa. Ovaj članak detaljno opisuje postavljanje kompletnog pipeline-a korišćenjem GitHub Actions za Python CLI aplikaciju, oslanjanjem na najbolje prakse modernog Python ekosustava.</p> </div> </div> </div> <div class="sect1"> <h2 id="_arhitektura_cicd_pipeline">Arhitektura CI/CD pipeline</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pipelajn koji ćemo graditi slede višekorakni pristup:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain title CI/CD Python pipeline ka PyPI skinparam backgroundColor #f8f9fa skinparam componentStyle rectangle rectangle "Развојник" as dev rectangle "GitHub repozitorijum" as repo { rectangle ".github/workflows/" as workflows rectangle "testovi/" as tests rectangle "setup.py / pyproject.toml" as setup rectangle "requirements.txt" as req } rectangle "GitHub Actions" as actions { rectangle "Pokretač testova" as test_runner rectangle "Izgraditi" as build rectangle "Скан безбедности" as security rectangle "Провера квалитета" as quality } rectangle "PyPI" as pypi { rectangle "Тест PyPI" as test_pypi rectangle "Производња PyPI" as prod_pypi } rectangle "Korisnici" as users dev --> repo : push/PR repo --> actions : trigger workflow actions --> test_runner : run tests actions --> security : security checks actions --> quality : code quality actions --> build : build package build --> test_pypi : deploy (pre-release) build --> prod_pypi : deploy (release) prod_pypi --> users : install package @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_struktura_projekta">Struktura projekta</h2> <div class="sectionbody"> <div class="paragraph"> <p>Python CLI aplikacija spremna za distribuciju mora da poštuje standardizovanu strukturu:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">playlist-downloader/ ├── .github/ │ └── workflows/ │ ├── ci.yml │ ├── release.yml │ └── security.yml ├── src/ │ └── playlist_downloader/ │ ├── __init__.py │ ├── cli.py │ ├── core/ │ └── adapters/ ├── tests/ │ ├── unit/ │ ├── integration/ │ └── conftest.py ├── docs/ ├── pyproject.toml ├── requirements.txt ├── requirements-dev.txt ├── MANIFEST.in ├── README.md ├── LICENSE └── CHANGELOG.md</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_конфигурација_пакета_са_pyproject_toml">Конфигурација пакета са pyproject.toml</h2> <div class="sectionbody"> <div class="paragraph"> <p>fajl`pyproject.toml`je moderni standard za konfigurisanje Python paketa:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-toml hljs" data-lang="toml">[build-system] requires = ["setuptools>=45", "wheel", "setuptools_scm>=6.2"] build-backend = "setuptools.build_meta" [project] name = "playlist-downloader" authors = [ {name = "Christophe Hérolivier", email = "cheroliv@example.com"}, ] description = "CLI tool for YouTube playlist management" readme = "README.md" requires-python = ">=3.8" keywords = ["youtube", "playlist", "cli", "downloader"] license = {text = "MIT"} classifiers = [ "Development Status :: 4 - Beta", "Environment :: Console", "Intended Audience :: End Users/Desktop", "License :: OSI Approved :: MIT License", "Operating System :: OS Independent", "Programming Language :: Python :: 3", "Programming Language :: Python :: 3.8", "Programming Language :: Python :: 3.9", "Programming Language :: Python :: 3.10", "Programming Language :: Python :: 3.11", "Topic :: Multimedia :: Sound/Audio", "Topic :: Utilities", ] dependencies = [ "typer>=0.9.0", "yt-dlp>=2023.7.6", "google-api-python-client>=2.0.0", "google-auth-oauthlib>=1.0.0", "pyyaml>=6.0", "rich>=13.0.0", ] dynamic = ["version"] [project.optional-dependencies] dev = [ "pytest>=7.0.0", "pytest-cov>=4.0.0", "pytest-mock>=3.10.0", "black>=23.0.0", "flake8>=6.0.0", "mypy>=1.0.0", "pre-commit>=3.0.0", "tox>=4.0.0", ] test = [ "pytest>=7.0.0", "pytest-cov>=4.0.0", "pytest-mock>=3.10.0", ] [project.urls] Homepage = "https://github.com/cheroliv/playlist-downloader" Documentation = "https://github.com/cheroliv/playlist-downloader#readme" Repository = "https://github.com/cheroliv/playlist-downloader.git" "Bug Tracker" = "https://github.com/cheroliv/playlist-downloader/issues" [project.scripts] playlist-downloader = "playlist_downloader.cli:main" [tool.setuptools_scm] write_to = "src/playlist_downloader/_version.py" [tool.setuptools.packages.find] where = ["src"] [tool.pytest.ini_options] testpaths = ["tests"] python_files = ["test_*.py"] python_classes = ["Test*"] python_functions = ["test_*"] addopts = [ "--cov=src/playlist_downloader", "--cov-report=html", "--cov-report=term-missing", "--cov-fail-under=85", ] [tool.black] line-length = 88 target-version = ['py38'] include = '\.pyi?$' extend-exclude = ''' /( \.eggs | \.git | \.hg | \.mypy_cache | \.tox | \.venv | _build | buck-out | build | dist )/ ''' [tool.mypy] python_version = "3.8" warn_return_any = true warn_unused_configs = true disallow_untyped_defs = true disallow_incomplete_defs = true check_untyped_defs = true disallow_untyped_decorators = true no_implicit_optional = true warn_redundant_casts = true warn_unused_ignores = true warn_no_return = true warn_unreachable = true strict_equality = true [[tool.mypy.overrides]] module = [ "yt_dlp.*", "googleapiclient.*", "google_auth_oauthlib.*", ] ignore_missing_imports = true</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_workflow_cicd_testovi_i_kvalitet">Workflow CI/CD - Testovi i Kvalitet</h2> <div class="sectionbody"> <div class="paragraph"> <p>Glavni radni tok (<code>ci.yml</code>) izvršava testove na više verzija Pythona:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml">name: CI on: push: branches: [ main, develop ] pull_request: branches: [ main ] jobs: test: runs-on: ubuntu-latest strategy: matrix: python-version: ["3.8", "3.9", "3.10", "3.11"] steps: - uses: actions/checkout@v4 with: fetch-depth: 0 - name: Set up Python ${{ matrix.python-version }} uses: actions/setup-python@v4 with: python-version: ${{ matrix.python-version }} - name: Cache dependencies uses: actions/cache@v3 with: path: | ~/.cache/pip ~/.cache/pre-commit key: ${{ runner.os }}-pip-${{ hashFiles('**/requirements*.txt') }} restore-keys: | ${{ runner.os }}-pip- - name: Install dependencies run: | python -m pip install --upgrade pip pip install -e ".[dev]" - name: Lint with flake8 run: | flake8 src tests --count --select=E9,F63,F7,F82 --show-source --statistics flake8 src tests --count --exit-zero --max-complexity=10 --max-line-length=88 --statistics - name: Check code formatting with Black run: black --check src tests - name: Type checking with mypy run: mypy src - name: Run tests with pytest run: | pytest tests/ -v --cov=src/playlist_downloader \ --cov-report=xml --cov-report=term-missing - name: Upload coverage to Codecov uses: codecov/codecov-action@v3 if: matrix.python-version == '3.11' with: file: ./coverage.xml flags: unittests name: codecov-umbrella security: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - name: Set up Python uses: actions/setup-python@v4 with: python-version: "3.11" - name: Install dependencies run: | python -m pip install --upgrade pip pip install bandit[toml] safety - name: Run security checks with bandit run: bandit -r src/ -f json -o bandit-report.json - name: Check dependencies with safety run: safety check --json --output safety-report.json - name: Upload security reports uses: actions/upload-artifact@v3 if: always() with: name: security-reports path: | bandit-report.json safety-report.json build: needs: [test, security] runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 with: fetch-depth: 0 - name: Set up Python uses: actions/setup-python@v4 with: python-version: "3.11" - name: Install build dependencies run: | python -m pip install --upgrade pip pip install build twine - name: Build package run: python -m build - name: Check package with twine run: twine check dist/* - name: Upload build artifacts uses: actions/upload-artifact@v3 with: name: dist path: dist/</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_radni_tok_za_objavu_i_implementaciju">Radni tok za objavu i implementaciju</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ток рада издавања (<code>release.yml</code>) upravlja automatsko objavljivanje na PyPI :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml">name: Release on: push: tags: - 'v*.*.*' workflow_dispatch: inputs: environment: description: 'Deployment environment' required: true default: 'test' type: choice options: - test - production env: PYTHON_VERSION: "3.11" jobs: release: runs-on: ubuntu-latest environment: name: ${{ github.event.inputs.environment || (startsWith(github.ref, 'refs/tags/') && 'production' || 'test') }} steps: - uses: actions/checkout@v4 with: fetch-depth: 0 - name: Set up Python uses: actions/setup-python@v4 with: python-version: ${{ env.PYTHON_VERSION }} - name: Install dependencies run: | python -m pip install --upgrade pip pip install build twine - name: Build package run: python -m build - name: Check package run: twine check dist/* - name: Publish to Test PyPI if: github.event.inputs.environment == 'test' || (startsWith(github.ref, 'refs/tags/') && contains(github.ref, 'rc')) env: TWINE_USERNAME: __token__ TWINE_PASSWORD: ${{ secrets.TEST_PYPI_API_TOKEN }} run: | twine upload --repository testpypi dist/* - name: Publish to PyPI if: github.event.inputs.environment == 'production' || (startsWith(github.ref, 'refs/tags/') && !contains(github.ref, 'rc')) env: TWINE_USERNAME: __token__ TWINE_PASSWORD: ${{ secrets.PYPI_API_TOKEN }} run: | twine upload dist/* - name: Create GitHub Release if: startsWith(github.ref, 'refs/tags/') uses: actions/create-release@v1 env: GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} with: tag_name: ${{ github.ref }} release_name: Release ${{ github.ref }} draft: false prerelease: ${{ contains(github.ref, 'rc') }} post-release: needs: release runs-on: ubuntu-latest if: startsWith(github.ref, 'refs/tags/') steps: - uses: actions/checkout@v4 - name: Set up Python uses: actions/setup-python@v4 with: python-version: ${{ env.PYTHON_VERSION }} - name: Test installation from PyPI run: | sleep 60 # Attendre la propagation sur PyPI pip install playlist-downloader playlist-downloader --version - name: Update documentation run: | # Script pour mettre à jour la documentation echo "Documentation updated for version ${GITHUB_REF#refs/tags/}"</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_дијаграми_архитектуре">Дијаграми архитектуре</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_дијаграм_последовательности_процес_издања">Дијаграм последовательности - Процес издања</h3> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain title Sekvenca release ka PyPI actor Developer as dev participant "GitHub" as gh participant "GitHub Actions" as ga participant "Тест PyPI" as tpypi participant "PyPI" as pypi participant "Korisnici" as users dev -> gh : git push --tags v1.2.3 gh -> ga : trigger release workflow ga -> ga : checkout code ga -> ga : setup Python environment ga -> ga : install dependencies ga -> ga : run tests ga -> ga : build package (wheel + sdist) ga -> ga : check package with twine alt Pre-release (rc tag) ga -> tpypi : upload to Test PyPI tpypi -> ga : confirm upload else Stable release ga -> pypi : upload to PyPI pypi -> ga : confirm upload end ga -> gh : create GitHub release ga -> ga : test installation from PyPI users -> pypi : pip install playlist-downloader pypi -> users : download package @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_dijagram_stanja_životni_ciklus_paketa">Dijagram stanja - Životni ciklus paketa</h3> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain title Stanja paketa Python [*] --> Development Development --> Testing : commit/PR Testing --> Development : tests fail Testing --> Built : tests pass Built --> TestPyPI : pre-release tag Built --> PyPI : stable tag TestPyPI --> PyPI : validation OK PyPI --> Published Published --> [*] state Development { [*] --> Coding Coding --> LocalTesting LocalTesting --> Coding : fix issues LocalTesting --> ReadyForCI : all tests pass } state Testing { [*] --> CITests CITests --> SecurityScan SecurityScan --> QualityCheck QualityCheck --> BuildValidation } @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_dijagram_raspoređivanja_cicd_infrastruktura">Dijagram raspoređivanja - CI/CD infrastruktura</h3> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain title Infrastruktura Primene node "GitHub" { component "Repozitorijum" as repo component "Акције трчач" as runner component "Skladište tajni" as secrets } node "PyPI infrastruktura" { component "PyPI" as pypi component "Тест PyPI" as testpypi database "Индекс пакета" as index } node "Машина програмера" { component "Git klijent" as git component "Python okruženje" as python component "интегрирано razvojно окружење" as ide } node "Korisničko okruženje" { component "пип" as pip_client component "Vreme izvođenja Pythona" as py_runtime } git --> repo : push code/tags repo --> runner : trigger workflows runner --> secrets : read API tokens runner --> testpypi : upload pre-release runner --> pypi : upload release pypi --> index : store package pip_client --> pypi : download package py_runtime <-- pip_client : install package @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_predmeti_i_modeli_pipeline_a">Predmeti i modeli pipeline-a</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_дијаграм_класа_модели_cicd">Дијаграм класа - Модели CI/CD</h3> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain title Modeli CI/CD pipeline-a class PipelineConfig { +python_versions: List[str] +test_environments: List[str] +security_checks: bool +coverage_threshold: float +validate() } class BuildArtifact { +name: str +version: str +wheel_path: str +sdist_path: str +checksums: Dict[str, str] +validate_integrity() } class TestResult { +test_suite: str +python_version: str +passed: int +failed: int +coverage: float +duration: float +is_success(): bool } class SecurityReport { +bandit_issues: List[Issue] +safety_vulnerabilities: List[Vulnerability] +severity_level: str +is_secure(): bool } class DeploymentTarget { +name: str +url: str +api_token: str +environment: str +deploy(artifact: BuildArtifact) } class ReleaseManager { +version: str +changelog: str +artifacts: List[BuildArtifact] +test_results: List[TestResult] +security_report: SecurityReport +deploy_to_test() +deploy_to_production() +create_github_release() } PipelineConfig ||--o{ TestResult ReleaseManager *-- BuildArtifact ReleaseManager *-- SecurityReport ReleaseManager o-- DeploymentTarget DeploymentTarget ..> BuildArtifact : uses @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konfiguracija_tajni">Konfiguracija tajni</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bi pipeline funkcionisao, morate da konfigurisate sledeće sekrete u GitHub-u :</p> </div> <div class="sect2"> <h3 id="_tajne_github_actions">Tajne GitHub Actions</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Dans Settings > Secrets and variables > Actions # Token PyPI pour la production PYPI_API_TOKEN=pypi-... # Token Test PyPI pour les pré-releases TEST_PYPI_API_TOKEN=pypi-... # Token GitHub pour créer les releases GITHUB_TOKEN=(automatiquement fourni) # Token Codecov (optionnel) CODECOV_TOKEN=...</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_генерација_pypi_токена">Генерација PyPI токена</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># 1. Créer un compte sur PyPI et Test PyPI # 2. Aller dans Account Settings > API tokens # 3. Créer un token avec scope "Entire account" ou spécifique au projet # 4. Format du token : pypi-AgEIcHlwaS5vcmc...</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_skripte_lokalnog_razvoja">Skripte lokalnog razvoja</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bi olakšali razvoj, kreirajte korisne skripte:</p> </div> <div class="sect2"> <h3 id="_makefile">Makefile</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-makefile hljs" data-lang="makefile">.PHONY: install test lint format security build clean release-test release-prod install: pip install -e ".[dev]" test: pytest tests/ -v --cov=src/playlist_downloader lint: flake8 src tests mypy src format: black src tests security: bandit -r src/ safety check build: python -m build twine check dist/* clean: rm -rf build/ dist/ *.egg-info/ find . -type d -name __pycache__ -delete find . -name "*.pyc" -delete release-test: clean build twine upload --repository testpypi dist/* release-prod: clean build twine upload dist/* pre-commit: format lint test security @echo "✅ Prêt pour commit"</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_скрипта_верзије">Скрипта верзије</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-python hljs" data-lang="python">#!/usr/bin/env python3 """Script pour gérer les versions du projet.""" import sys import subprocess from pathlib import Path def get_current_version(): """Récupère la version actuelle depuis git.""" try: result = subprocess.run( ["git", "describe", "--tags", "--abbrev=0"], capture_output=True, text=True, check=True ) return result.stdout.strip() except subprocess.CalledProcessError: return "0.0.0" def create_version_tag(version, message=None): """Crée un tag de version.""" if not version.startswith('v'): version = f'v{version}' tag_message = message or f"Release {version}" subprocess.run(["git", "tag", "-a", version, "-m", tag_message], check=True) print(f"✅ Tag {version} créé") # Push le tag subprocess.run(["git", "push", "origin", version], check=True) print(f"✅ Tag {version} poussé vers origin") if __name__ == "__main__": if len(sys.argv) < 2: current = get_current_version() print(f"Version actuelle: {current}") print("Usage: python version.py <new_version> [message]") sys.exit(1) new_version = sys.argv[1] message = sys.argv[2] if len(sys.argv) > 2 else None create_version_tag(new_version, message)</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_добре_праксе_и_препоруке">Добре праксе и препоруке</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_семантичко_верционирање">Семантичко верционирање</h3> <div class="paragraph"> <p>Koristite semantičko verzioniranje (SemVer) :</p> </div> <div class="ulist"> <ul> <li> <p><code>MAJOR.MINOR.PATCH</code> (ex: 1.2.3)</p> </li> <li> <p><code>MAJOR</code>: nekompatibilne promene</p> </li> <li> <p><code>MINOR</code> : nove funkcionalnosti kompatibilne</p> </li> <li> <p>`PATCH`kompatibilne ispravke grešaka</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_strategija_grananja">Strategija grananja</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">main ──●──●──●──●──●────●── (releases stables) / / / develop ──●──●──●──●──●──●──●──●── (développement) / / / feature/xxx ●──●──●──●──●──/ (fonctionnalités)</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_testovi_i_pokrivenost">Testovi i pokrivenost</h3> <div class="ulist"> <ul> <li> <p>Минимална покривност кода: 85%</p> </li> <li> <p>Jedinični testovi za poslovnu logiku</p> </li> <li> <p>Интеграцијски тестови за адаптере</p> </li> <li> <p>Testovi end-to-end za CLI</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_bezbednost">Bezbednost</h3> <div class="ulist"> <ul> <li> <p>Automatsko skeniranje zavisnosti (Safety)</p> </li> <li> <p>Statička analiza koda (Bandit)</p> </li> <li> <p>Тајне никад у коду</p> </li> <li> <p>Korišćenje specifičnih PyPI tokena</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_monitoring_i_observabilnost">monitoring i observabilnost</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_metrike_pipeline">Metrike pipeline</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml"># .github/workflows/metrics.yml name: Pipeline Metrics on: workflow_run: workflows: ["CI", "Release"] types: [completed] jobs: metrics: runs-on: ubuntu-latest steps: - name: Collect metrics run: | echo "Pipeline: ${{ github.event.workflow_run.name }}" echo "Status: ${{ github.event.workflow_run.conclusion }}" echo "Duration: ${{ github.event.workflow_run.updated_at - github.event.workflow_run.created_at }}" # Envoyer vers système de monitoring</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_obaveštenja">Obaveštenja</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml"># Ajout dans les workflows pour notifications - name: Notify on failure if: failure() uses: 8398a7/action-slack@v3 with: status: failure text: "❌ Pipeline failed for ${{ github.repository }}" env: SLACK_WEBHOOK_URL: ${{ secrets.SLACK_WEBHOOK }}</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_закључак">Закључак</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovaj kompletan CI/CD pipeline za Python nudi :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Potpuna automatizacija</strong>: od validacije koda do objave</p> </li> <li> <p><strong>Безбедност</strong>automatski skenovi i bezbedno upravljanje tajnostima</p> </li> <li> <p><strong>kvalitet</strong>: testovi verzija, lintiranje i pokrivenost koda</p> </li> <li> <p><strong>Pouzdanost</strong>: postupno uvođenje putem Test PyPI</p> </li> <li> <p><strong>trazabilnost</strong>artefakti, izveštaji i izdanja GitHub</p> </li> </ul> </div> <div class="paragraph"> <p>Uvođenje ovih praksi osigurava jak i profesionalan proces isporuke za vaše Python CLI aplikacije, olakšavajući održavanje i razvoj vaših projekata na duži rok.</p> </div> </div> </div> <div class="sect1"> <h2 id="_додатни_ресурси">Додатни ресурси</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="https://packaging.python.org/">Упутник за кориснике паковања Pythona</a></p> </li> <li> <p><a href="https://docs.github.com/en/actions">Документација за GitHub Actions</a></p> </li> <li> <p><a href="https://pypi.org/help/">PyPI pomoćna dokumentacija</a></p> </li> <li> <p><a href="https://semver.org/">Specifikacija semantičkog verzioniranja</a></p> </li> <li> <p><a href="https://keepachangelog.com/">Чувај changelog</a></p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2025/0085_pypi_cicd_part_1_post.html Thu, 17 Jul 2025 00:00:00 +0000 blog/2025/0085_pypi_cicd_part_1_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_uvod">Uvod</a></li> <li><a href="#_архитектура_пиплайна">Архитектура пиплайна</a></li> <li><a href="#_konfiguracija_ci_pipeline_a">Konfiguracija CI pipeline-a</a> <ul class="sectlevel2"> <li><a href="#_struktura_ci_radnog_toka">Struktura CI radnog toka</a></li> <li><a href="#_analiza_koraka_ci">Analiza koraka CI</a> <ul class="sectlevel3"> <li><a href="#_pokretači_on">Pokretači (<code>on</code>)</a></li> </ul> </li> </ul> </li> </ul> </div> <div class="sect1"> <h2 id="_uvod">Uvod</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title">Циљ : Pomoći čitaču u postavljanju minimalističkog, ali funkcionalnog CI/CD pipelinea za Python aplikaciju, sa automatskim deploy-om na PyPI.</div> <p>Automatizacija procesa razvoja postala je neophodna u modernim projektima. Dobro dizajniran CI/CD pipeline ne samo što otkriva regresije ranije u ciklusu razvoja, već i potpuno automatizuje proces raspoređivanja.</p> </div> <div class="paragraph"> <p>У овом чланку ћемо испитати како подешати потпуни са GitHub Actions за Python апликацију, од континуиране интеграције (CI) до континуиране доставе (CD) на PyPI.</p> </div> </div> </div> <div class="sect1"> <h2 id="_архитектура_пиплайна">Архитектура пиплайна</h2> <div class="sectionbody"> <div class="paragraph"> <p>Naš pipeline se sastoji od dvaju različitih workflow:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>CI Pipeline</strong>Izvršen na svakom push-u i pull request-u</p> </li> <li> <p><strong>CD Pipeline</strong>: Pokreće se samo tokom GitHub release-ova</p> </li> </ol> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain package "Repozitorijum GitHub" { [Source Code] as source [GitHub Actions] as actions } package "CI cevovod" { [Checkout] as checkout_ci [Setup Python] as python_ci [Install Dependencies] as deps_ci [Linting (Ruff)] as lint [Unit Tests] as tests } package "CD Pipeline" { [Checkout] as checkout_cd [Setup Python] as python_cd [Build Package] as build [Publish to PyPI] as pypi } source --> actions : Push/PR actions --> checkout_ci checkout_ci --> python_ci python_ci --> deps_ci deps_ci --> lint lint --> tests source --> actions : Release actions --> checkout_cd : On Release checkout_cd --> python_cd python_cd --> build build --> pypi @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konfiguracija_ci_pipeline_a">Konfiguracija CI pipeline-a</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_struktura_ci_radnog_toka">Struktura CI radnog toka</h3> <div class="paragraph"> <p>CI radni tok je dizajniran da validira svaki doprinos kodu. Evo njene potpune konfiguracije:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml">name: CI/CD Pipeline on: push: branches: - main pull_request: branches: - main jobs: build: runs-on: ubuntu-latest steps: - name: Checkout code uses: actions/checkout@v4 - name: Set up Python uses: actions/setup-python@v5 with: python-version: '3.x' - name: Install dependencies run: | python -m pip install --upgrade pip pip install -r requirements.txt pip install ruff pytest pytest-mock - name: Run Linting (Ruff) run: ruff check . - name: Run Tests (Pytest) run: pytest</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_analiza_koraka_ci">Analiza koraka CI</h3> <div class="sect3"> <h4 id="_pokretači_on">Pokretači (<code>on</code>)</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml">---- ---- on: push: branches: - main pull_request: branches: - main ---- Pajplajn se pokreće na: - Svaki push na granu`main` - svaki pull request ka`main` Ovaj pristup garantuje da glavni kod ostane stabilan i da svaki doprinos bude proveren pre integracije. ==== 2. Izvršno okruženje ---- runs-on: ubuntu-latest Ubuntu Latest nudi dobar kompromis između performansi, cene i kompatibilnosti za većinu Python projekata. ==== 3. Check‑out koda ```yaml ---- ---- - name: Checkout code uses: actions/checkout@v4 ---- Akcija`checkout@v4`Преузима изворни код из репозиторија. Верзија v4 донесе надоградње у области перформанси и безбедности. ==== 4. Конфигурација Python ---- - name: Set up Python uses: actions/setup-python@v5 with: python-version: '3.x' Коришћење`'3.x'`omogućuje automatsko korišćenje najnovije stabilne verzije Python 3, pojednostavljajući održavanje. ==== 5. Инсталација зависности ```yaml ---- ---- - name: Install dependencies run: | python -m pip install --upgrade pip pip install -r requirements.txt pip install ruff pytest pytest-mock ---- Овај чекор : - Ažuriraj pip na najnoviju verziju - Instaliraj zavisnosti projekta - Dodaj alate za razvoj (linting i testovi) ==== 6. Lintiranje sa Ruff ---- - name: Run Linting (Ruff) run: ruff check . **Ruff**Ултра-брз Python линтер написан на Rust. Он комбинује функционалности неколико алата (Flake8, Black, isort) у један ефикасан алат. ==== 7. Izvršavanje testova ```yaml ---- ---- - name: Run Tests (Pytest) run: pytest ---- Pytest izvršava celi skup testova, osiguravajući da promene ne uvedu regresije. == Конфигурација ЦИД пайплайна === Struktura CD workflow-a CD workflow se pokreće samo tokom GitHub release-ova i automatizuje objavu na PyPI: [source,yaml] ---- name: Publish to PyPI on: release: types: - published jobs: deploy: runs-on: ubuntu-latest steps: - name: Checkout code uses: actions/checkout@v4 - name: Set up Python uses: actions/setup-python@v5 with: python-version: '3.x' - name: Install dependencies run: | python -m pip install --upgrade pip pip install setuptools wheel twine - name: Build and publish env: TWINE_USERNAME: __token__ TWINE_PASSWORD: ${{ secrets.PYPI_API_TOKEN }} run: | python setup.py sdist bdist_wheel twine upload dist/* ---- === Analiza koraka CD ==== Pokretač Release ---- on: release: types: - published CD pipeline se pokreće samo prilikom objavljivanja GitHub release-a. Ovaj pristup osigurava preciznu kontrolu nad deploy-ovanjem. ==== 2. Instalacija alata za gradnju ```yaml ---- ---- pip install setuptools wheel twine ---- - **setuptools**: Alati za pakiranje Python - **wheel**: Moderni format distribucije Pythona - **konopac**: Осигурен алат за аплоадинг ка PyPI ==== 3. Конфигурација аутентификације ---- env: TWINE_USERNAME: __token__ TWINE_PASSWORD: ${{ secrets.PYPI_API_TOKEN }} Аутентификација користи PyPI API токен складиштењен као GitHub тајна, који је безбеднији од традиционалних учредња. ==== 4. Izgradnja i objava ```yaml ---- ---- run: | python setup.py sdist bdist_wheel twine upload dist/* ---- - `sdist`: Kreiraj izvornu distribuciju - `bdist_wheel`Kreiraj wheel (binarna distribucija) - `twine upload`Objavljuje distribucije na PyPI == Конфигурација пајтон пакета === Struktura fajla setup.py Da bi pipeline funkcionisao, vaš projekat mora da uključuje fajl.`setup.py`: [source,python] ---- from setuptools import setup, find_packages with open("README.adoc", "r", encoding="utf-8") as fh: long_description = fh.read() setup( name="playlist-downloader", version="1.0.0", author="Votre Nom", author_email="votre.email@example.com", description="CLI tool for managing YouTube playlists", long_description=long_description, long_description_content_type="text/plain", url="https://github.com/cheroliv/playlist-downloader", packages=find_packages(), classifiers=[ "Development Status :: 4 - Beta", "Intended Audience :: Developers", "License :: OSI Approved :: MIT License", "Operating System :: OS Independent", "Programming Language :: Python :: 3", "Programming Language :: Python :: 3.8", "Programming Language :: Python :: 3.9", "Programming Language :: Python :: 3.10", "Programming Language :: Python :: 3.11", ], python_requires=">=3.8", install_requires=[ "typer>=0.9.0", "yt-dlp>=2023.1.6", "google-api-python-client>=2.70.0", "google-auth-oauthlib>=0.7.1", "pymonad>=2.4.0", "pyyaml>=6.0", ], entry_points={ "console_scripts": [ "playlist-downloader=cli:app", ], }, ) ---- === Kljucne tačke setup.py 1. **Metapodaci**: Ime, verzija, autor, opis 2. **зависност**: Списак потребних пакета 3. **Улазне тачке**: Izložene CLI komande 4. **Klasifikatori**Metapodaci za PyPI == Заштита преко GitHub secretова === Конфигурација Token PyPI 1. **Kreirati API token na PyPI**: - Prijavite se na PyPI - Idite na Account Settings > API tokens - Креирајте нови токен са одговарајућим овозбедицама 1. **Додај секрет у GitHub**: - Podešavanja repozitorija > Tajne i varijable > Akcije - Kreirajte novu tajnu nazvanu`PYPI_API_TOKEN` - Унесите ваш PyPI токен [plantuml, secrets-flow, svg] ---- @startuml !theme plain actor Developer as dev participant "GitHub репозиторијум" as repo participant "GitHub Actions" as actions participant PyPI dev -> repo : Configure PYPI_API_TOKEN secret repo -> actions : Trigger CD pipeline on release actions -> actions : Access secret securely actions -> PyPI : Authenticate with token PyPI -> PyPI : Validate and publish package note over actions, PyPI Token never exposed in logs Automatic rotation possible end note @enduml ---- == Radni tok potpunog raspoređivanja === sekvenca implementacije [plantuml, deployment-sequence, svg] ---- @startuml !theme plain actor Developer as dev participant "Lokalni Git" as git participant "GitHub" as github participant "GitHub akcije" as actions participant PyPI participant "Krajnji korisnici" as users dev -> git : git tag v1.0.0 dev -> git : git push origin v1.0.0 git -> github : Push tag dev -> github : Create release from tag github -> actions : Trigger CD pipeline actions -> actions : Checkout code actions -> actions : Setup Python environment actions -> actions : Install build tools actions -> actions : Build distributions (sdist + wheel) actions -> PyPI : Upload to PyPI with token PyPI -> PyPI : Validate and publish users -> PyPI : pip install playlist-downloader note over dev, github Release creation can be automated or done manually through GitHub UI end note @enduml ---- === Stanja pipeline-a [plantuml, pipeline-states, svg] ---- @startuml !theme plain [*] --> Idle Idle --> CI_Running : Push/PR created CI_Running --> CI_Success : All checks pass CI_Running --> CI_Failed : Linting/Tests fail CI_Success --> Idle : Merge completed CI_Failed --> Idle : Fix and retry Idle --> CD_Running : Release published CD_Running --> CD_Success : Package published CD_Running --> CD_Failed : Build/Upload error CD_Success --> Idle : Package available on PyPI CD_Failed --> Idle : Fix and retry release note on link #red : Blocks merge note on link #green : Allows deployment @enduml ---- == Dobre prakse i optimizacije === Upravljanje verzijama Koristite semantičke Git tagove: ---- git tag -a v1.2.3 -m "Release version 1.2.3" git push origin v1.2.3 === 2. Testovi matrice Za testiranje na verzijama Pythona: ```yaml ---- ---- strategy: matrix: python-version: [3.8, 3.9, "3.10", "3.11"] ---- === 3. Keš zavisnosti Ubrzajte gradnje sa kešom: ---- - name: Cache pip dependencies uses: actions/cache@v3 with: path: ~/.cache/pip key: ${{ runner.os }}-pip-${{ hashFiles('**/requirements.txt') }} === 4. Okruženja za deploy Koristite GitHub okruženja za kontrolisana objavljivanja: ```yaml ---- ---- jobs: deploy: environment: production runs-on: ubuntu-latest ---- == Случај употребе и архитектура === Дијаграм случајева коришћења [plantuml, use-cases, svg] ---- @startuml !theme plain left to right direction actor "razvijalac" as dev actor "GitHub Actions" as ga actor "Krajnji korisnik" as user package "CI/CD Sistem" { usecase "Pokreni lintanje" as lint usecase "Izvrši testove" as test usecase "Izgradite paket" as build usecase "Objavi na PyPI" as publish usecase "Kreiraj izdanje" as release } dev --> lint : Pushes code dev --> test : Pushes code dev --> release : Creates release ga --> build : On release trigger ga --> publish : After successful build user --> publish : Downloads package lint .> test : triggers test .> build : on success build .> publish : on success @enduml ---- === Архитектура деплојмента [plantuml, deployment-architecture, svg] ---- @startuml !theme plain cloud "GitHub" { [Source Repository] [GitHub Actions] [Secrets Store] } cloud "PyPI" { [Package Registry] [Distribution Files] } node "CI/CD cijevovod" { [Linting] [Testing] [Building] [Publishing] } [Source Repository] --> [GitHub Actions] : Triggers [GitHub Actions] --> [Linting] [Linting] --> [Testing] [Testing] --> [Building] [Building] --> [Publishing] [Publishing] --> [Package Registry] : Uploads [Secrets Store] --> [Publishing] : Provides token note as N1 Secure token-based authentication end note [Secrets Store] .. N1 @enduml ---- == Надзор и Debugging === logovi i monitoring GitHub Actions nudi detaljne zapise za svaki korak. Za debugiranje: 1. **Ispitajte logove**svake korak 2. **Uključite debug**sa`ACTIONS_STEP_DEBUG` 3. **Koristi artefakte**Да сачувате fajlove za build ---- - name: Upload build artifacts uses: actions/upload-artifact@v3 if: failure() with: name: build-logs path: build/ === Obaveštenja Dodajte Slack ili e‑mail obaveštenja: ```yaml ---- ---- - name: Notify on failure if: failure() uses: 8398a7/action-slack@v3 with: status: ${{ job.status }} webhook_url: ${{ secrets.SLACK_WEBHOOK }} ---- == Zaključak Postavljanje jakog CI/CD pipelinea sa GitHub Actions radikalno menja iskustvo razvoja. Automatizovanjem lintovanja, testova i deploy-a, vi : - **Смањите грешке**у производњу - **Ubržajte ciklusi**od razvoja - **Poboljšajte poverenje**u vašim releasima - **Olakšajte saradnju**у тим Ovaj pipeline se može prilagoditi različitim vrstama Python projekata prilagođavanjem alata za lintiranje, okvira za testiranje ili destinacija za implementaciju. Početni ulaganje u podešavanje ovih radnih tokova se brzo vraća zbog uštede vremena i smanjivanja ručnih grešaka tokom implementacija. == Dodatni resursi - https://docs.github.com/en/actions[Документација GitHub Actions] - https://packaging.python.org/[Python vodič za pakovanje] - https://docs.pytest.org/[Dokumentacija Pytest] - https://docs.astral.sh/ruff/[Документација Ruff] - https://twine.readthedocs.io/[Документация Twine] ✅ Funkcionalni pipeline postignut ! Sada imate jednostavni CI/CD pipeline koji vam omogućava da automatizujete svoje testove i da objavite svoj Python paket na PyPI izravno iz GitHub Actions. Ovakav pipeline ostaje svestrano minimalistički. Još ne pokriva neke neophodne aspekte u profesionalnom kontekstu : Тестови више верзија Питона, Automatska analiza bezbednosti, Postupno raspoređivanje putem Test PyPI, Набљудање и метрике конвејера, Automatizacija verzioniranja i uvođenje modernih dobrih praksi (pyproject.toml). U sledećem delu, prelazimo na viši nivo. Naučit ćete da preobrazite ovaj osnovni pipeline u stvarni industrijski lanac implementacije, čvrst i siguran, spreman za Python projekte u proizvodnji. ----</code></pre> </div> </div> </div> </div> </div> </div> https://cheroliv.com/blog/2025/0084_disco_bot_discord_python_post.html Wed, 16 Jul 2025 00:00:00 +0000 blog/2025/0084_disco_bot_discord_python_post.html <div id="toc" class="toc"> <div id="toctitle">Table of Contents</div> <ul class="sectlevel1"> <li><a href="#_uvod">Uvod</a></li> <li><a href="#_контекст_и_тренутни_изазова">Контекст и тренутни изазова</a> <ul class="sectlevel2"> <li><a href="#_evolucija_muzičkih_api_jeva">Evolucija Muzičkih API-jeva</a></li> <li><a href="#_pristup_razvoju_vođenog_logom">Pristup razvoju vođenog logom</a></li> </ul> </li> <li><a href="#_konceptualna_arhitektura">konceptualna arhitektura</a></li> <li><a href="#_tehnički_stog_i_funkcionalni_paradigam">Tehnički stog i funkcionalni paradigam</a> <ul class="sectlevel2"> <li><a href="#_технолошки_избор">Технолошки избор</a></li> <li><a href="#_primenjeni_funkcionalni_principi">Primenjeni funkcionalni principi</a></li> </ul> </li> <li><a href="#_agile_metodologija_i_backlog">Agile metodologija i Backlog</a> <ul class="sectlevel2"> <li><a href="#_epic_glavne">Epic Glavne</a> <ul class="sectlevel3"> <li><a href="#_epic_1_bot_infrastrukture_discord">Epic 1 : Bot infrastrukture Discord</a></li> <li><a href="#_epic_2_integracija_spotify">Epic 2: Integracija Spotify</a></li> <li><a href="#_epic_3_integrisanje_youtube">Epic 3 : Integrisanje YouTube</a></li> <li><a href="#_epic_4_muzičke_funkcionalnosti">Epic 4 : Muzičke funkcionalnosti</a></li> </ul> </li> <li><a href="#_user_stories_detaljne">User Stories Detaljne</a> <ul class="sectlevel3"> <li><a href="#_us1_1_inicijalizacija_bot">US1.1 : Inicijalizacija Bot</a></li> <li><a href="#_us2_1_inteligentna_pretraga_spotify">US2.1 : Inteligentna pretraga Spotify</a></li> <li><a href="#_us3_1_rezilijentno_izvučenje_youtube">US3.1 : Rezilijentno izvučenje YouTube</a></li> </ul> </li> </ul> </li> <li><a href="#_pristup_log_driven_development">Pristup Log Driven Development</a> <ul class="sectlevel2"> <li><a href="#_стратегия_логовања">Стратегия логовања</a></li> <li><a href="#_struktura_logova">Struktura logova</a></li> <li><a href="#_пример_дизајна_лога">Пример дизајна лога</a></li> </ul> </li> <li><a href="#_архитектура_валидације_са_pydantic">Архитектура валидације са Pydantic</a> <ul class="sectlevel2"> <li><a href="#_modele_podataka">Modele podataka</a></li> </ul> </li> <li><a href="#_funkcionalno_upravljanje_greškama">Funkcionalno upravljanje greškama</a> <ul class="sectlevel2"> <li><a href="#_монаде_и_обрада_грешака">Монаде и обрада грешака</a></li> </ul> </li> <li><a href="#_strategija_obešavanja_ograničenja">Strategija obešavanja ograničenja</a> <ul class="sectlevel2"> <li><a href="#_višeizvorni_pristup">Višeizvorni pristup</a></li> </ul> </li> <li><a href="#_iterativni_plan_razvoja">Iterativni plan razvoja</a> <ul class="sectlevel2"> <li><a href="#_planiranje_sprinta">planiranje sprinta</a></li> <li><a href="#_metrike_kvaliteta">Metrike kvaliteta</a></li> </ul> </li> <li><a href="#_размотривање_и_мониторинг">Размотривање и мониторинг</a> <ul class="sectlevel2"> <li><a href="#_архитектура_производње">Архитектура производње</a></li> <li><a href="#_proaktivno_praćenje">Proaktivno praćenje</a></li> </ul> </li> <li><a href="#_zaključak_i_perspektive">Zaključak i perspektive</a> <ul class="sectlevel2"> <li><a href="#_следни_кораци">Следни кораци</a></li> </ul> </li> </ul> </div> <div class="sect1"> <h2 id="_uvod"><a class="anchor" href="#_uvod"></a>Uvod</h2> <div class="sectionbody"> <div class="paragraph"> <p>Razvoj bota Discorda koji integrira API-jeve Spotify i YouTube predstavlja savremeni tehnički izazov, posebno u svetlu nedavnih ograničenja i izmena platformi. Ovaj članak prezentuje metodološki pristup baziran na<strong>Razvoj pod logom</strong>(LDD), proširenje razvoja pod vodenjem testova, primenjeno u funkcionalnom paradigmu sa Pythonom.</p> </div> <div class="paragraph"> <p>Naš cilj: napraviti jak, održiv i skalabilan bot, koji može da navigira kroz trenutne ograničenja muzičkih API-jeva, pružajući glatko iskustvo korisnika na Discordu.</p> </div> </div> </div> <div class="sect1"> <h2 id="_контекст_и_тренутни_изазова"><a class="anchor" href="#_контекст_и_тренутни_изазова"></a>Контекст и тренутни изазова</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_evolucija_muzičkih_api_jeva"><a class="anchor" href="#_evolucija_muzičkih_api_jeva"></a>Evolucija Muzičkih API-jeva</h3> <div class="paragraph"> <p>Muzičke platforme su značajno otežale pristup:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Spotify</strong>: Ograničenja pristupa metapodacima, ograničenje kvota</p> </li> <li> <p><strong>YouTube</strong>: Ојачана политика против бота, сложење процеса аудентификации</p> </li> <li> <p><strong>Discord</strong>Novi zahtevi bezbednosti i performansi</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_pristup_razvoju_vođenog_logom"><a class="anchor" href="#_pristup_razvoju_vođenog_logom"></a>Pristup razvoju vođenog logom</h3> <div class="paragraph"> <p>LDD proširuje TDD postavljanje logova u sam sredinu razvoja:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Definicija logova</strong>pre implementacije</p> </li> <li> <p><strong>Валидација преко наблюђења</strong>очекивана понашања</p> </li> <li> <p><strong>Пуна прослеживност</strong>токови података</p> </li> <li> <p><strong>proaktivni debug</strong>u očekivanju grešaka</p> </li> </ol> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konceptualna_arhitektura"><a class="anchor" href="#_konceptualna_arhitektura"></a>konceptualna arhitektura</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml !theme aws-orange package "Discord Bot jezgra" { [Command Handler] as CH [Event Listener] as EL [Log Manager] as LM } package "Sloj integracije muzike" { [Spotify Client] as SC [YouTube Client] as YC [Audio Processor] as AP } package "Funkcionalni jezgro" { [Data Validation] as DV [Business Logic] as BL [Error Handling] as EH } package "vanjski API-jevi" { [Spotify API] as SAPI [YouTube API] as YAPI [Discord API] as DAPI } CH --> BL EL --> BL BL --> DV BL --> EH BL --> LM SC --> SAPI YC --> YAPI CH --> DAPI DV ..> SC : validates DV ..> YC : validates AP --> SC AP --> YC LM --> EH : logs errors LM --> BL : logs operations @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_tehnički_stog_i_funkcionalni_paradigam"><a class="anchor" href="#_tehnički_stog_i_funkcionalni_paradigam"></a>Tehnički stog i funkcionalni paradigam</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_технолошки_избор"><a class="anchor" href="#_технолошки_избор"></a>Технолошки избор</h3> <div class="paragraph"> <p>Naš stek se okrece oko funkcionalnog programiranja :</p> </div> <div class="dlist"> <dl> <dt class="hdlist1"><strong>PyMonade</strong></dt> <dd> <p>Upravljanje efektima po strani i kompozicija funkcija</p> </dd> <dt class="hdlist1"><strong>Pydantic</strong></dt> <dd> <p>Validacija tipno bezbednih podataka i serijalizacija</p> </dd> <dt class="hdlist1"><strong>Asyncio</strong></dt> <dd> <p>Asinhrono programiranje za API-je</p> </dd> <dt class="hdlist1"><strong>Structlog</strong></dt> <dd> <p>Strukturisano logiranje za LDD</p> </dd> </dl> </div> </div> <div class="sect2"> <h3 id="_primenjeni_funkcionalni_principi"><a class="anchor" href="#_primenjeni_funkcionalni_principi"></a>Primenjeni funkcionalni principi</h3> <div class="listingblock"> <div class="content"> <pre>@startuml !theme plain title Функционалан ток података participant "Discord komanda" as DC participant "Validator" as V participant "poslovna logika" as BL participant "Klijent API" as AC participant "Јуналаžник" as L DC -> V: Raw Input activate V V -> V: Pydantic Validation V -> L: Log Validation V --> DC: Maybe[ValidData] deactivate V DC -> BL: ValidData activate BL BL -> BL: Pure Computation BL -> L: Log Business Logic BL -> AC: API Request activate AC AC -> AC: IO Operation AC -> L: Log API Call AC --> BL: Maybe[Result] deactivate AC BL --> DC: Either[Error, Success] deactivate BL DC -> L: Log Final Result @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_agile_metodologija_i_backlog"><a class="anchor" href="#_agile_metodologija_i_backlog"></a>Agile metodologija i Backlog</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_epic_glavne"><a class="anchor" href="#_epic_glavne"></a>Epic Glavne</h3> <div class="paragraph"> <p>Naš razvoj se organizuje oko 4 velike epike:</p> </div> <div class="sect3"> <h4 id="_epic_1_bot_infrastrukture_discord"><a class="anchor" href="#_epic_1_bot_infrastrukture_discord"></a>Epic 1 : Bot infrastrukture Discord</h4> <div class="paragraph"> <p><strong>Poslovna vrednost</strong> : Jaka i fleksibilna osnova</p> </div> <div class="paragraph"> <p><strong>Kriteriji prihvaćanja</strong> : - Stabilna Discord veza sa upravljanjem ponovnim povezivanjem - Modularni sistem naredbi - Ugrađeno strukturovano beleženje centralizovana greške</p> </div> </div> <div class="sect3"> <h4 id="_epic_2_integracija_spotify"><a class="anchor" href="#_epic_2_integracija_spotify"></a>Epic 2: Integracija Spotify</h4> <div class="paragraph"> <p><strong>Poslovna vrednost</strong> : Pristup muzičkim metapodacima</p> </div> <div class="paragraph"> <p><strong>Критерии прихватање</strong> : Sigurna OAuth2 autentifikacija - Претрага трекова са интелигентним кешем - Upravljanje kvotama API - Резервна механизма при мрежним грешкама</p> </div> </div> <div class="sect3"> <h4 id="_epic_3_integrisanje_youtube"><a class="anchor" href="#_epic_3_integrisanje_youtube"></a>Epic 3 : Integrisanje YouTube</h4> <div class="paragraph"> <p><strong>Poslovna vrednost</strong> : Pristup audio sadržaju</p> </div> <div class="paragraph"> <p><strong>Критеријуми прихваћања</strong> : - Правно облажење ограничења - Optimizovana ekstrakcija audija - Upravljanje privatnim/obrisanim videozapisima - Шањање Услових коришћења YouTube-а</p> </div> </div> <div class="sect3"> <h4 id="_epic_4_muzičke_funkcionalnosti"><a class="anchor" href="#_epic_4_muzičke_funkcionalnosti"></a>Epic 4 : Muzičke funkcionalnosti</h4> <div class="paragraph"> <p><strong>Poslovna vrednost</strong> : Kompletno korisničko iskustvo</p> </div> <div class="paragraph"> <p>Kriteriji prihvatanja - Zvukovna predavanja visoke kvalitete - Inteligentni red za čitanje - Glasovne komande Discorda - Sinhronizacija na više platformi</p> </div> </div> </div> <div class="sect2"> <h3 id="_user_stories_detaljne"><a class="anchor" href="#_user_stories_detaljne"></a>User Stories Detaljne</h3> <div class="sect3"> <h4 id="_us1_1_inicijalizacija_bot"><a class="anchor" href="#_us1_1_inicijalizacija_bot"></a>US1.1 : Inicijalizacija Bot</h4> <div class="paragraph"> <p>Kao razvojjač <strong>Хоћу</strong> Discord бота који се надежно повезује <strong>U svrhu</strong> osigurati dostupnost usluge</p> </div> <div class="paragraph"> <p><strong>DoD (Definicija gotovosti)</strong> : - [ ] Bot se automatski povezuje pri pokretanju - [ ] Strukturišani logovi dokumentuju svaki korak - [ ] Automatsko ponovo povezivanje u slučaju prekida veze - [ ] Тестови интеграције пролазе</p> </div> </div> <div class="sect3"> <h4 id="_us2_1_inteligentna_pretraga_spotify"><a class="anchor" href="#_us2_1_inteligentna_pretraga_spotify"></a>US2.1 : Inteligentna pretraga Spotify</h4> <div class="paragraph"> <p><strong>Као</strong> корисник Discorda <strong>Жељу</strong> претраживати тргове преко Spotify <strong>У сврши</strong> откривати и делити музику</p> </div> <div class="paragraph"> <p><strong>DoD</strong> : - [ ] Narudžba`/search`функционална - [ ] Relevantni rezultati sa metapodacima - [ ] Lokalni keš za optimizaciju upita - [ ] Ugrađeno upravljanje greškama API</p> </div> </div> <div class="sect3"> <h4 id="_us3_1_rezilijentno_izvučenje_youtube"><a class="anchor" href="#_us3_1_rezilijentno_izvučenje_youtube"></a>US3.1 : Rezilijentno izvučenje YouTube</h4> <div class="paragraph"> <p><strong>kao</strong> sistem <strong>Je veux</strong> извући YouTube аудио надежно <strong>U svrhu održavanja kontinuirane usluge</strong></p> </div> <div class="paragraph"> <p><strong>DoD</strong> : - [ ] Ekstrakcija bez kršenja Uslova korišćenja - [ ] Optimalna kvaliteta zvuka - [ ] Управљање географским ограничицама - [ ] Детаљни journalistes операција</p> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_pristup_log_driven_development"><a class="anchor" href="#_pristup_log_driven_development"></a>Pristup Log Driven Development</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_стратегия_логовања"><a class="anchor" href="#_стратегия_логовања"></a>Стратегия логовања</h3> <div class="listingblock"> <div class="content"> <pre>@startuml !theme spacelab title Tok razvoja vodjen logovima start :Define Expected Behavior; note right: Spécification des logs attendus :Write Log Assertions; note right: Tests basés sur les logs :Implement Minimal Code; note right: Code juste suffisant :Run & Observe Logs; note right: Validation comportementale if (Logs Match Expectations?) then (yes) :Refactor & Optimize; note right: Amélioration continue else (no) :Debug via Logs; note right: Analyse des écarts :Fix Implementation; endif :Integration Tests; note right: Validation end-to-end stop @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_struktura_logova"><a class="anchor" href="#_struktura_logova"></a>Struktura logova</h3> <div class="paragraph"> <p>Naš LDD pristup koristi strukturalni zapisnici sa semantičkim nivojima:</p> </div> <div class="dlist"> <dl> <dt class="hdlist1"><strong>траг</strong></dt> <dd> <p>Detaljan tok podataka</p> </dd> <dt class="hdlist1"><strong>DEBUG</strong></dt> <dd> <p>Unutrašnji stanja funkcija</p> </dd> <dt class="hdlist1"><strong>info</strong></dt> <dd> <p>Uspešne poslovne operacije</p> </dd> <dt class="hdlist1"><strong>opomeni</strong></dt> <dd> <p>Degradirane situacije ali upravljane</p> </dd> <dt class="hdlist1"><strong>ERROR</strong></dt> <dd> <p>Greške koje zahtevaju interveniju</p> </dd> <dt class="hdlist1"><strong>kritičan</strong></dt> <dd> <p>Sistemski greškovi</p> </dd> </dl> </div> </div> <div class="sect2"> <h3 id="_пример_дизајна_лога"><a class="anchor" href="#_пример_дизајна_лога"></a>Пример дизајна лога</h3> <div class="paragraph"> <p>Pre nego što implementiramo funkciju pretrage na Spotify-u, definišemo njene logove:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">INFO: spotify.search.start query="bohemian rhapsody" user_id=123456 DEBUG: spotify.search.validation query_length=16 safe_chars=true DEBUG: spotify.search.api_call endpoint="/search" params={...} INFO: spotify.search.success results_count=15 duration_ms=340</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_архитектура_валидације_са_pydantic"><a class="anchor" href="#_архитектура_валидације_са_pydantic"></a>Архитектура валидације са Pydantic</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_modele_podataka"><a class="anchor" href="#_modele_podataka"></a>Modele podataka</h3> <div class="paragraph"> <p>Naša funkcionalna pristup daje prednost validaciji u ranim fazama:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !theme cerulean-outline class SpotifyTrack { +id: str +name: str +artists: List[str] +duration_ms: int +external_urls: Dict[str, str] -- +validate_duration() : bool +to_discord_embed() : Embed } class YouTubeVideo { +id: str +title: str +duration: timedelta +available: bool -- +validate_availability() : bool +extract_audio_url() : Optional[str] } class DiscordCommand { +command: str +args: List[str] +user: User +channel: Channel -- +validate_permissions() : bool +log_execution() : None } SpotifyTrack --|> BaseModel YouTubeVideo --|> BaseModel DiscordCommand --|> BaseModel @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_funkcionalno_upravljanje_greškama"><a class="anchor" href="#_funkcionalno_upravljanje_greškama"></a>Funkcionalno upravljanje greškama</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_монаде_и_обрада_грешака"><a class="anchor" href="#_монаде_и_обрада_грешака"></a>Монаде и обрада грешака</h3> <div class="paragraph"> <p>Korišćenje PyMonade omogućava elegano rukovanje greškama:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !theme toy title Error Handling Flow participant "Komanda" as C participant "Možda Monad" as M participant "Ili Monad" as E participant "Logger" as L C -> M: search_query activate M alt Valid Query M -> E: Success(query) activate E E -> E: api_call() alt API Success E -> L: log_success() E --> C: Right(result) else API Error E -> L: log_api_error() E --> C: Left(api_error) end deactivate E else Invalid Query M -> L: log_validation_error() M --> C: Nothing end deactivate M @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_strategija_obešavanja_ograničenja"><a class="anchor" href="#_strategija_obešavanja_ograničenja"></a>Strategija obešavanja ograničenja</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_višeizvorni_pristup"><a class="anchor" href="#_višeizvorni_pristup"></a>Višeizvorni pristup</h3> <div class="paragraph"> <p>Usled ograničenja API-ja, primenjujemo strategiju diversifikacije:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !theme mars title Стратегија из више izvora start :User Request; :Primary Source\n(Spotify); if (Available?) then (yes) :Return Spotify Data; stop else (no) :Log Fallback; :Secondary Source\n(YouTube Music); if (Available?) then (yes) :Return YouTube Data; stop else (no) :Tertiary Source\n(Local Cache); if (Available?) then (yes) :Return Cached Data; :Log Cache Hit; stop else (no) :Return Error; :Log Complete Failure; stop end end end @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_iterativni_plan_razvoja"><a class="anchor" href="#_iterativni_plan_razvoja"></a>Iterativni plan razvoja</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_planiranje_sprinta"><a class="anchor" href="#_planiranje_sprinta"></a>planiranje sprinta</h3> <div class="paragraph"> <p>Наш развој следи циклус спринтова трајања две недеље :</p> </div> <div class="dlist"> <dl> <dt class="hdlist1"><strong>Sprint 1-2</strong></dt> <dd> <p>Infrastruktura i Discord Bot Core</p> </dd> <dt class="hdlist1"><strong>Šprint 3-4</strong></dt> <dd> <p>Integracija Spotify sa LDD</p> </dd> <dt class="hdlist1"><strong>Sprint 5-6</strong></dt> <dd> <p>Integracija YouTube i obilaženje</p> </dd> <dt class="hdlist1"><strong>Sprint 7-8</strong></dt> <dd> <p>Napredne muzičke features</p> </dd> <dt class="hdlist1"><strong>Sprint 9-10</strong></dt> <dd> <p>Optimizacija i proizvodnja</p> </dd> </dl> </div> </div> <div class="sect2"> <h3 id="_metrike_kvaliteta"><a class="anchor" href="#_metrike_kvaliteta"></a>Metrike kvaliteta</h3> <div class="paragraph"> <p>Svaki sprint se ocjenjuje po:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Pokrivenost logova</strong>>90% kritičnih puteva</p> </li> <li> <p><strong>Pouzdanost API</strong>: <1% neriješenih grešaka</p> </li> <li> <p><strong>Performanse</strong>: <500ms srednje vreme odговора</p> </li> <li> <p><strong>одржаљивост</strong>: Ciklična kompleksnost <10</p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_размотривање_и_мониторинг"><a class="anchor" href="#_размотривање_и_мониторинг"></a>Размотривање и мониторинг</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_архитектура_производње"><a class="anchor" href="#_архитектура_производње"></a>Архитектура производње</h3> <div class="listingblock"> <div class="content"> <pre>@startuml !theme vibrant cloud "Discord serveri" { [User Commands] } node "Radno okruženje" { [Discord Bot] [Log Aggregator] [Metrics Collector] [Health Monitor] } database "Складиште логова" { [Structured Logs] [Error Traces] [Performance Metrics] } cloud "Vanjske API-je" { [Spotify API] [YouTube API] } [User Commands] --> [Discord Bot] [Discord Bot] --> [Log Aggregator] [Discord Bot] --> [Spotify API] [Discord Bot] --> [YouTube API] [Log Aggregator] --> [Structured Logs] [Metrics Collector] --> [Performance Metrics] [Health Monitor] --> [Error Traces] @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_proaktivno_praćenje"><a class="anchor" href="#_proaktivno_praćenje"></a>Proaktivno praćenje</h3> <div class="paragraph"> <p>LDD olakšava inteligentno praćenje:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Upozorenja bazirana na obrascima logova</strong></p> </li> <li> <p><strong>Detekcija ponašačkih anomalija</strong></p> </li> <li> <p><strong>Poslovne metrike u realnom vremenu</strong></p> </li> <li> <p><strong>Debugging podržan korelacijom logova</strong></p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak_i_perspektive"><a class="anchor" href="#_zaključak_i_perspektive"></a>Zaključak i perspektive</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ova metodološka kombinuje prednosti funkcionalnog paradigme sa čvrstoćom Log Driven Development. Omogućava nam:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Предувидети проблеме</strong>благодаря логовима направљеним унапред</p> </li> <li> <p><strong>Одржати квалитет</strong>kroz neprekidnu validaciju</p> </li> <li> <p><strong>Brzo se prilagoditi</strong>promenama API-ja</p> </li> <li> <p><strong>Osigurati tracebilnost</strong>kompletne operacije</p> </li> </ol> </div> <div class="paragraph"> <p>Iterativni razvoj i modularna arhitektura osiguravaju skalabilnost u odnosu na promenljiva ograničenja muzičkih platforma.</p> </div> <div class="sect2"> <h3 id="_следни_кораци"><a class="anchor" href="#_следни_кораци"></a>Следни кораци</h3> <div class="ulist"> <ul> <li> <p><strong>Faza 1</strong>: Implementacija jadra sa PyMonade</p> </li> <li> <p><strong>Faza 2</strong>: Integracija Spotify sa inteligentnim kešem</p> </li> <li> <p><strong>Faza 3</strong>Резилиентно YouTube решение</p> </li> <li> <p><strong>Faza 4</strong>: Napredne funkcije i optimizacija</p> </li> </ul> </div> <div class="paragraph"> <p>Ova jak temeljna koncepcija nam omogućava da navigiramo kroz tehničke izazove, pri čemu dostavljamo izuzetno korisničko iskustvo.</p> </div> <hr> <div class="paragraph"> <p><strong>Ovaj članak će biti suivio tehničkom serijom koja detaljno opisuje implementaciju svakog komponenta uz primere koda i funkcionalne obrasce.</strong></p> </div> </div> </div> </div> https://cheroliv.com/blog/2025/0083_cold_computer_post.html Tue, 15 Jul 2025 00:00:00 +0000 blog/2025/0083_cold_computer_post.html <div id="toc" class="toc"> <div id="toctitle">Table of Contents</div> <ul class="sectlevel1"> <li><a href="#_cilj_ovog_vodiča">Cilj ovog vodiča</a></li> <li><a href="#_preduslov">Preduslov</a></li> <li><a href="#_instalirati_i_konfigurisati_alate">Instalirati i konfigurisati alate</a> <ul class="sectlevel2"> <li><a href="#_lm_sensors_за_детектовање_сензора">lm-sensors` за детектовање сензора</a></li> <li><a href="#_tlp_inteligentni_menadžer_energije">tlp` : inteligentni menadžer energije</a></li> <li><a href="#_cpufrequtils_ograničiti_frekvencije_cpu">cpufrequtils` : ograničiti frekvencije CPU</a></li> <li><a href="#_auto_cpufreq_jednostavno_dinamičko_upravljanje">auto-cpufreq` : jednostavno dinamičko upravljanje</a></li> <li><a href="#_thermald_automatska_termička_zaštita">thermald` : automatska termička zaštita</a></li> </ul> </li> <li><a href="#_набљуђење_у_реалном_времену">Набљуђење у реалном времену</a> <ul class="sectlevel2"> <li><a href="#_sensors_na_komandnoj_liniji">sensors` na komandnoj liniji</a></li> <li><a href="#_opcija_gui_psensor">Opcija GUI : `psensor</a></li> </ul> </li> <li><a href="#_додатни_савети">Додатни савети</a></li> <li><a href="#_очистити_систем_за_ограничавање_преоптерећа">Очистити систем за ограничавање преоптерећа</a></li> <li><a href="#_за_да_се_дови">За да се дови</a></li> <li><a href="#_zaključak">📚 Zaključak</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <p>Da li osećate da vaš laptop pregreje anormalno pod Ubuntu ? Ovaj članak vam predlaže jedan pristup<strong>softverski</strong>потпуна за<strong>ohladiti</strong>, <strong>прати</strong> et <strong>овлаштити температуром</strong>ваше машине</p> </div> </div> </div> <div class="sect1"> <h2 id="_cilj_ovog_vodiča">Cilj ovog vodiča</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Smanjiti globalnu temperaturu računara</p> </li> <li> <p>Optimalizovati upravljanje energijom</p> </li> <li> <p>Пратите критичне компоненте (CPU, GPU, итд.)</p> </li> <li> <p>Spriječiti zakasnjenja zbog<strong>termalno ograničenje</strong></p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre>@startuml start :Installer les outils; :Analyser les capteurs; :Appliquer des réglages; note right: cpufreq, tlp, auto-cpufreq :Surveiller en temps réel; stop @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_preduslov">Preduslov</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Ubuntu mašina (20.04 ili više preporučena)</p> </li> <li> <p>Internet veza</p> </li> <li> <p>Veština u komandnoj liniji (nivo od početnog do srednjeg)</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_instalirati_i_konfigurisati_alate">Instalirati i konfigurisati alate</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_lm_sensors_за_детектовање_сензора">lm-sensors` за детектовање сензора</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo apt install lm-sensors sudo sensors-detect sensors</code></pre> </div> </div> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p>Оговорите`YES`svim pitanjima od`sensors-detect`за детекцију модула.</p> </div> </td> </tr> </table> </div> </div> <div class="sect2"> <h3 id="_tlp_inteligentni_menadžer_energije">tlp` : inteligentni menadžer energije</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo apt install tlp tlp-rdw sudo systemctl enable tlp sudo systemctl start tlp</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre>@startuml (*) --> "TLP aktivan?" if "Да" then --> [yes] "Смањење потрошње" --> "Ograničenje frekvencije CPU" else --> [no] "Pokret TLP" --> "Аутоматска активација" endif -->(*) @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_cpufrequtils_ograničiti_frekvencije_cpu">cpufrequtils` : ograničiti frekvencije CPU</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo apt install cpufrequtils cpufreq-info sudo cpufreq-set -g powersave</code></pre> </div> </div> <div class="ulist"> <ul> <li> <p><code>powersave</code>: ograničava pikove frekvencije</p> </li> <li> <p><code>performance</code>: privileguje snagu na račun temperature</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_auto_cpufreq_jednostavno_dinamičko_upravljanje">auto-cpufreq` : jednostavno dinamičko upravljanje</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">git clone https://github.com/AdnanHodzic/auto-cpufreq.git cd auto-cpufreq sudo ./auto-cpufreq-installer sudo auto-cpufreq --install</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre>@startuml start :Analyse charge système; :Réglage fréquence CPU; :Vérification température; :Adaptation dynamique; stop @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_thermald_automatska_termička_zaštita">thermald` : automatska termička zaštita</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo apt install thermald sudo systemctl enable thermald sudo systemctl start thermald</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_набљуђење_у_реалном_времену">Набљуђење у реалном времену</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_sensors_na_komandnoj_liniji">sensors` na komandnoj liniji</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">watch -n 2 sensors</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_opcija_gui_psensor">Opcija GUI : `psensor</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo apt install psensor</code></pre> </div> </div> <div class="paragraph"> <p>Jednostavan grafički interfejs za CPU, GPU, ventilatore</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_додатни_савети">Додатни савети</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Zatvorite kartice i teške aplikacije (npr: preglednici)</p> </li> <li> <p>Izbegavati intenzivnu upotrebu na bateriji</p> </li> <li> <p>Мониторовати процесе преку`htop`:</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo apt install htop htop</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_очистити_систем_за_ограничавање_преоптерећа">Очистити систем за ограничавање преоптерећа</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo apt autoremove sudo apt autoclean sudo journalctl --vacuum-time=3d</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_за_да_се_дови">За да се дови</h2> <div class="sectionbody"> <div class="paragraph"> <p>Možete da kreirate uslugu.`systemd`подешен за аутоматско применање неких подешавања при покретању. Da li želite primer u sledećem članku? Dajte mi znati!</p> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">📚 Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kombiniranjem ovih jednostavnih alata, ćete osvojiti :</p> </div> <div class="ulist"> <ul> <li> <p>Управљена температура ЦПУ</p> </li> <li> <p>Manje buke ventilacije</p> </li> <li> <p>Bolja autonomija</p> </li> </ul> </div> <div class="paragraph"> <p>Ne zaboravite da redovno kontrolisate temperature da sprečite pregrevanje.</p> </div> </div> </div> https://cheroliv.com/blog/2025/0082_ui_struggle_post.html Mon, 14 Jul 2025 00:00:00 +0000 blog/2025/0082_ui_struggle_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_borbište_maquette_tri_pregledača_više_renderova">Borbište : maquette, tri pregledača, više renderova</a></li> <li><a href="#_problem_1_letuća_karta_sekcije_hero">Problem 1: Letuća karta sekcije 'Hero'</a></li> <li><a href="#_problem_2_kannibalna_navigaciona_traka">Problem 2: Kannibalna navigaciona traka</a></li> <li><a href="#_problem_3_anarkistička_tipografija">Problem 3: anarkistička tipografija</a></li> <li><a href="#_problem_4_navigacijska_traka_koja_preteče">Problem 4: Navigacijska traka koja preteče</a></li> <li><a href="#_проблем_5_невидим_хамбургер_мени">Проблем 5: Невидим хамбургер мени</a></li> <li><a href="#_zaključak_lekcije_usilnog_debagovanja">Zaključak : lekcije usilnog debagovanja</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="admonitionblock note"> <table> <tr> <td class="icon"> <i class="fa icon-note" title="Note"></i> </td> <td class="content"> <div class="paragraph"> <p><strong>Време за читање :</strong> oko 7 minuta <strong>Ниво :</strong> Средњи</p> </div> </td> </tr> </table> </div> <div class="paragraph"> <p>U ovom detaljnom praktičnom slučaju, ćemo razvrstati najčešće probleme kompatibilnosti preglednika, koji su ponekad i najfrustrijući, susretene prilikom kreiranja UI maquetta sa Bootstrap 5.2. Od rukovanja Flexbox-om do subtilnosti renderovanja fontova, otkrijte naš put ispravljanja grešaka kako biste prebacili nestabilni dizajn u Firefox-u u pixel-perfect iskustvo na svim pregledačima.</p> </div> <hr> </div> </div> <div class="sect1"> <h2 id="_borbište_maquette_tri_pregledača_više_renderova">Borbište : maquette, tri pregledača, više renderova</h2> <div class="sectionbody"> <div class="paragraph"> <p>Svaki front-end razvojni programer poznaje to osećanje. Posle sati rada, dizajn je konačno savršen. Poravnanja su jasna, tipografija je elegantna, animacije su glatko. Izdišemo zadovoljstvo, admirišemo svoj rad na Chrome-u (ili Brave, ili Edge), i iz oprezna otvaramo projekt na Firefox-u. I tamo počinje drama. Elementi koji izbijaju, poravnanja koja su pokvarena, fontovi sa nepravilnim veličinama…​ lepa harmonija se isparila.</p> </div> <div class="paragraph"> <p>To je precizno scenarij koji smo suočili prilikom razvoja novog portfolija interfejsa. Specifikacija bila je jednostavna: moderna, responzivna početna stranica sa selektorom tema (svetla, tamna i visokog kontrasta), koristeći <strong>vanilla JavaScript</strong> i poslednju verziju <strong>Bootstrap 5.2</strong>.</p> </div> <div class="paragraph"> <p>Ovaj članak nije lista čudotvornog rešenja. On je dnevnik naše sesije debagovanja, uvid u 'zašto' razlike u renderingu između Blink motora (Chromium, Brave) i Gecko (Firefox), i demonstracija da čvrsta i moderna rešenja uvek daju bolje rezultate od hitnih ispravaka.</p> </div> <div class="listingblock"> <div class="title">Dijagram slučajeva korišćenja : Proces ispravljanja grešaka</div> <div class="content"> <pre>@startuml left to right direction actor "Front-end programer" as Dev rectangle "Maket UI Bootstrap 5" { usecase "Ispraviti poravnanje Flexbox" as UC1 usecase "Prilagoditi padding dinamički (JS)" as UC2 usecase "Kontrolisi tipografiju (clamp())" as UC3 usecase "Resiti pretek menija" as UC4 usecase "Направити иконицу менија видљиву" as UC5 } actor "Firefox pregledač" as Firefox Dev -- (UC1) Dev -- (UC2) Dev -- (UC3) Dev -- (UC4) Dev -- (UC5) (UC1) ..> Firefox : <<extend>> (UC2) ..> Firefox : <<extend>> (UC3) ..> Firefox : <<extend>> (UC4) ..> Firefox : <<extend>> (UC5) ..> Firefox : <<extend>> note right of Firefox : Révèle les problèmes de compatibilité @enduml</pre> </div> </div> <div class="listingblock"> <div class="title">Дијаграм компоненти : Архитектура фронт-енд решения</div> <div class="content"> <pre>@startuml !theme plain package "Решение фронт-енд" { component "HTML (Шаблони FTL)" as HTML component "script.js" as JS component "styles.css" as CSS interface "Манипулација ДОМ" as iDOM interface "Корекције CSS" as iCSS } package "okvir" { component "Bootstrap 5.2" as BS interface "CSS promenljive" as iVars interface "Utilitarne klase" as iUtils } HTML ..> iDOM : nécessite JS ..> iDOM : réalise HTML ..> iCSS : nécessite CSS ..> iCSS : réalise CSS ..> iVars : nécessite BS ..> iVars : fournit HTML ..> iUtils : utilise BS ..> iUtils : fournit note right of JS - Mesure la hauteur de la navbar - Applique le padding dynamiquement end note note right of CSS - Utilise clamp() pour la typographie - Réduit les marges du menu - Surcharge l'icône du menu via les variables end note @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_problem_1_letuća_karta_sekcije_hero">Problem 1: Letuća karta sekcije 'Hero'</h2> <div class="sectionbody"> <div class="paragraph"> <p>Први баг је такође био и највидиjší. Sekcija hero se sastoji iz dve kolone: levo je naslov; desno je kartica predstavljanja.</p> </div> <div class="ulist"> <ul> <li> <p><strong>Simptom:</strong>Na Chrome i Brave obe kolone su bile savršeno vertikalno centrirane. Na Firefox, desna kartica je neobjašnjivo pala ispod teksta sa leve strane.</p> </li> <li> <p><strong>Istraživanje :</strong>HTML kod se čonio jednostavan i ispravan, koristeći standardne Bootstrap klase.</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><section id="home" class="hero-section"> <div class="container"> <!-- Cette ligne est la clé du problème --> <div class="row align-items-center min-vh-100"> <div class="col-lg-6"> <!-- Contenu de gauche --> </div> <div class="col-lg-6"> <!-- Carte de droite --> </div> </div> </div> </section></code></pre> </div> </div> <div class="paragraph"> <p>Naš prilagođeni CSS za`.hero-section`definisao je`display: flex` et <code>align-items: center</code>, i klasa`min-vh-100`давао је минималну висину линији (`div.row`Онда, зашто Firefox није желео да центрира колоне?</p> </div> <div class="ulist"> <ul> <li> <p><strong>Глубока причина :</strong>Ово је пример из уџбенИка о томе како рендери интерпретирају implicitне висине. La`<section>`ijao je`min-height`, nema`height`eksplicitno. Za primenu`align-items-center`unutra`div.row`, Firefox mora da zna referentnu visinu ovog kontejnera. Kao što su njegovi roditelji (<code>div.container</code> et la `<section>`ona sama nije imala visinu<strong>строга</strong>, Firefox je bio izgubljen. Blink motor, koji je indulgentniji, uspeva da "pogodi" namjeru i da centrira elemente. Gecko, koji je veran specifikaciji, ne to radi.</p> </li> <li> <p><strong>Решение :</strong>Učinite visinu eksplicitnu. Mi smo prisilili ga.<code>.container</code> et le `.row`da zauzme 100% visine svog roditelja koristeći utilitarnu klasu`h-100`od Bootstrap.</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><section id="home" class="hero-section"> <div class="container h-100"> <div class="row align-items-center min-vh-100 h-100"> <!-- ... --> </div> </div> </section></code></pre> </div> </div> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="Tip"></i> </td> <td class="content"> <div class="paragraph"> <p>Kada`align-items`Flexbox ne radi kao što je očekivano na vertikalnoj osi, uvek proveravajte da kontejner ima visinu`height` ou <code>min-height</code>) дефинисана и, ако проблем траје (понекад посебно у Firefox-у), уверите се да контејнери средњих родитеља добро преноше ову висину.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_problem_2_kannibalna_navigaciona_traka">Problem 2: Kannibalna navigaciona traka</h2> <div class="sectionbody"> <div class="ulist"> <div class="title">Jednom kada je sekcija 'Hero' poravnata, drugi problem se pojavio : navigacijska traka, sa svojom klasom`fixed-top`, Je se preklopivalo sa naslovom. Jedan`padding-top: 80px`Bilo je primenjeno na sekciji 'Hero' kao rešenje.</div> <ul> <li> <p><strong>Симптом :</strong> Le `padding`Било је довољно у Chrome, али не и у Firefox, где је наслов увек делично сакривен.</p> </li> <li> <p><strong>Главна причина :</strong>Korišćenje "magični broj" (<code>80px</code>) je vešta loša praksa. Visina elementa kao što je navigacijska traka može varirati od nekoliko piksela između različitih pregledača zbog subtilih razlika u renderovanju fontova, razmaka ili čak podešavanja korisnika. Uzdavanje u fiksnu vrednost je recept za krhljiv dizajn.</p> </li> <li> <p><strong>Решение :</strong>Динамично и непогрешно решење у JavaScript-u. Написали смо мали скрипт за:</p> </li> <li> <p>Izmeriti <strong>stvarnu</strong> visinu navigacijske trake nakon renderovanja stranice.</p> </li> <li> <p>Primeni ovu izmerenu visinu kao`padding-top`у sekцији "Hero</p> </li> <li> <p>Ponovo pokrenuti ovu funkciju pri svakom promjerenju veličine prozora kako bi se prilagodio promenama (kao što je prelaz na hamburger meni).</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">document.addEventListener('DOMContentLoaded', function() { function adjustHeroPadding() { const navbar = document.querySelector('.navbar.fixed-top'); const heroSection = document.querySelector('.hero-section'); if (navbar && heroSection) { const navbarHeight = navbar.offsetHeight; heroSection.style.paddingTop = navbarHeight + 'px'; } } // Ajuster au chargement et au redimensionnement adjustHeroPadding(); window.addEventListener('resize', adjustHeroPadding); });</code></pre> </div> </div> <div class="listingblock"> <div class="title">Dijagram sekvence : Dinamičko podešavanje razmaka</div> <div class="content"> <pre>@startuml title Решење за проблем каннибалне траке за навигацију actor Utilisateur participant "Прегледач" as Browser participant "script.js" as JS participant "dom" as DOM Utilisateur -> Browser: Charge la page activate Browser Browser -> JS: Déclenche l'événement 'DOMContentLoaded' activate JS JS -> DOM: querySelector('.navbar.fixed-top') activate DOM DOM --> JS: Retourne l'élément Navbar deactivate DOM JS -> DOM: querySelector('.hero-section') activate DOM DOM --> JS: Retourne l'élément Hero deactivate DOM JS -> DOM: navbar.offsetHeight activate DOM DOM --> JS: Retourne la hauteur calculée (ex: 83px) deactivate DOM JS -> DOM: heroSection.style.paddingTop = "83px" activate DOM deactivate DOM deactivate JS deactivate Browser ... Plus tard ... Utilisateur -> Browser: Redimensionne la fenêtre activate Browser Browser -> JS: Déclenche l'événement 'resize' activate JS JS -> JS: Exécute à nouveau adjustHeroPadding() note right of JS: Le processus de mesure et\nd'application du padding se répète. deactivate JS deactivate Browser @enduml</pre> </div> </div> <div class="paragraph"> <p>Paralelno, naravno smo uklonili pravilo`padding-top: 80px;`našeg fajla`styles.css`.</p> </div> </div> </div> <div class="sect1"> <h2 id="_problem_3_anarkistička_tipografija">Problem 3: anarkistička tipografija</h2> <div class="sectionbody"> <div class="ulist"> <div class="title">Следни проблем је био најштетнији за имидж марке : величина главног наслова</div> <ul> <li> <p><strong>Simptom:</strong>Na Firefoxu, font naslova "Développeur Formateur…​" bio je ogroman, skoro šokantan, dok je na ostalim pretraživačima bio harmonican.</p> </li> <li> <p><strong>Duboka причина :</strong>Naslov je koristio klasu`display-4`Bootstrap. Ove klase koriste veličine fonta koje su responzivne, često bazirane na jedinici`rem`i medija upita. Ponovo, algoritam za renderiranje u Firefox-u, kombinovan sa fonтом "Inter", dovodio je do mnogo veća izračuna veličine na našoj rezoluciji 1920x1080.</p> </li> <li> <p><strong>Решение :</strong>Преузети контролу помоћу CSS функције`clamp()<code>. Ova funkcija je revolucionarna za fluidnu tipografiju. Omogućava definisanje veličine fonta sa tri vrednosti : minimalna veličina, «preferirana» veličina (koja se prilagodjava širini pogleda,`vw</code>), i maksimalna veličina.</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">.hero-content h1 { color: var(--text-primary); line-height: 1.2; /* Min: 2rem Préférée: s'adapte à la vue Max: 2.5rem (40px) */ font-size: clamp(2rem, 1.2rem + 1.5vw, 2.5rem); }</code></pre> </div> </div> <div class="paragraph"> <p>Sa`clamp()<code>, smo mogli reći pretraživaču: \"Povečaj veličinu fonta zajedno sa ekranom, ali ne premašiti<strong>никда</strong>границе`2.5rem</code>. Ovo je odmah ujednačilo prikaz na svim pregledačima, dajući nam apsolutnu kontrolu nad konačnim izgledom.</p> </div> </div> </div> <div class="sect1"> <h2 id="_problem_4_navigacijska_traka_koja_preteče">Problem 4: Navigacijska traka koja preteče</h2> <div class="sectionbody"> <div class="ulist"> <div class="title">Ovo je problem koji nam je dato najvise truda i koji je konačno otkrio duboku prirodu mikro-razlika u renderovanju.</div> <ul> <li> <p><strong>Симптом :</strong>На екрану 1920x1080, последњи линкови менија ("Blog", "Contact") су били померани изван екрана у desno, али само у Firefox-u.</p> </li> <li> <p><strong>Главна причина :</strong>После неколико неуспешних покушаја (промена тачака лома Bootstrap-а`lg` à <code>xl`затим`xxl</code>), smo shvatili. Zalogaj nije bio logika Bootstrapa, već jednostavan izračun širine. Na Firefoxu, zbir širina svih linkova, uključujući njihove`padding` et `margin`na sub-piksela, bila je <strong>lako</strong> veća od 1920 piksela. U Chrome-u, ta ista suma je bila <strong>lako</strong> manja. Nedostajalo nam je nekoliko piksela.</p> </li> <li> <p><strong>Решение:</strong>Hirurški smanjenje razmaka. Jer je bilo nemoguće specijalno ciljati Firefox sa zastarjelim CSS „hakovima“, jedina čisto rešenje je bilo pronaći zajednički stil koji radi svuda. Dakle, smanjili smo malo marginu i horizontalno padding svake navigacione veze.</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">/* La version finale, légèrement plus compacte */ .navbar-nav .nav-link { font-size: 0.9rem; /* 90% de la taille de base */ color: var(--text-primary) !important; font-weight: 500; margin: 0 0.2rem; padding: 0.5rem 0.5rem !important; border-radius: 0.375rem; transition: all 0.3s ease; }</code></pre> </div> </div> <div class="paragraph"> <p>Ovo smanjenje, skoro nevidljivo oku na jednom elementu, nam je omogućilo da kolektivno osvojimo potrebni prostor da svi linkovi uđu u okvir na Firefox-u, dok je zachovalo skoro identičan izgled na ostalim pregledačima.</p> </div> </div> </div> <div class="sect1"> <h2 id="_проблем_5_невидим_хамбургер_мени">Проблем 5: Невидим хамбургер мени</h2> <div class="sectionbody"> <div class="ulist"> <div class="title">Poslednji problem, i ne najmanji, se odnosio na pristupnost na mobilnim uređajima.</div> <ul> <li> <p><strong>Симптом :</strong>U responsivnom režimu (meni <code>hamburger</code>), ikonica menija je bila nevidljiva na temama <code>dark</code> i <code>high-contrast</code>.</p> </li> <li> <p><strong>Главна причина:</strong>Ikonica Bootstrap 5 menija je`background-image`(URL kodiran SVG). Podrazumevano, boja crta je tamna, optimizirana za svetlu pozadinu. Ne prilagođava se automatski promeni teme.</p> </li> <li> <p><strong>Решение:</strong>Користите CSS променљиве Bootstrap за преоптерећење иконе. Дефинисали smo нову SVG-икону, али овог пута са белом цртом (<code>#ffffff</code>), i mi smo je primenili specifično kada su teme`dark` ou `high-contrast`су активни</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">/* ====================== Fix pour l'icône du menu Burger (Blanc) ====================== */ [data-bs-theme="dark"] .navbar-toggler-icon, [data-bs-theme="high-contrast"] .navbar-toggler-icon { --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }</code></pre> </div> </div> <div class="admonitionblock important"> <table> <tr> <td class="icon"> <i class="fa icon-important" title="Important"></i> </td> <td class="content"> <div class="paragraph"> <p>Personalizacija Bootstrap komponenti kao ova se sve više vrši putem preklapanja CSS varijabli (<code>--bs-component-property</code>), qui est la méthode la plus propre et la plus pérenne.</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak_lekcije_usilnog_debagovanja">Zaključak : lekcije usilnog debagovanja</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ova putanja, iako ponekad frustrujući, je bogata lekcijama. Svaki rešeni problem jačava jednu temeljnu istinu razvoja weba:<strong>Ništa ne zamenjuje rigorozan test više preglednika</strong>.</p> </div> <div class="listingblock"> <div class="title">Mindmap : Синтеза дебаговања и изведених лекција</div> <div class="content"> <pre>@startmindmap + Débogage Cross-Browser : Bootstrap 5 ++ **Conflit :** Chrome (Blink) vs Firefox (Gecko) ++ **Problème 1 : Alignement Hero** +++ Cause : Hauteur implicite +++ Solution : Classe `.h-100` ++ **Problème 2 : Navbar Cannibale** +++ Cause : "Магични број" (padding fixe) +++ Solution : JS `offsetHeight` ++ **Problème 3 : Typographie Géante** +++ Cause : Rendu des `rem` +++ Solution : CSS `clamp()` ++ **Problème 4 : Menu qui déborde** +++ Cause : Calcul de largeur sub-pixel +++ Solution : Réduction des marges/paddings ++ **Problème 5 : Icône Invisible** +++ Cause : SVG non adaptable au thème +++ Solution : Surcharge de variable CSS ++ **Leçons Clés** +++ Firefox force un code robuste +++ Fuir les "magični brojevi" +++ Maîtriser la typographie fluide +++ Personnaliser via les variables CSS @endmindmap</pre> </div> </div> <div class="olist arabic"> <div class="title">Ovo su lekcije koje zapamtile:</div> <ol class="arabic"> <li> <p><strong>Firefox je saveznik:</strong>Njegova najveća vernost CSS standardima nas prinudi da pišemo kod koji je jači i manje dvojznačan.</p> </li> <li> <p><strong>Izbegavajte "magični brojevi":</strong>Fiksne vrednosti (kao`padding-top: 80px`) su vremenske bombe. Preferirajte uvek dinamička rešenja (JavaScript) ili relativna (Flexbox, Grid).</p> </li> <li> <p><strong>Овластајте вашу типографију:</strong>Koristite`clamp()`za potpunu kontrolu nad veličinom responsivnih fontova.</p> </li> <li> <p><strong>Misli u "komponenti":</strong>Da prilagodite Bootstrap, preopterećite njegove CSS promenljive umesto da množite pravila koja preklapljuju framework.</p> </li> <li> <p><strong>Ne ciljajte pregledač :</strong>Решение није pratiquement никада да се направи "hack" за specifičan pregledač, него да се пронађе заједнички стил који функционише повсеместно.</p> </li> </ol> </div> <div class="paragraph"> <p>Konačno, model je sada čvrst, prevedabilan i spreman za ugrađivanje u sistem za šablone. Svaki ispravljen bug nije bio neuspeh, već je korak ka kodu bolje kvalitete.</p> </div> </div> </div> https://cheroliv.com/blog/2025/0081_TDD_Gradle_Properties_Fix_post.html Sun, 13 Jul 2025 00:00:00 +0000 blog/2025/0081_TDD_Gradle_Properties_Fix_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_problem_izolovanje_jediničnih_testova_gradle_plugina">Problem: Izolovanje jediničnih testova Gradle plugina</a> <ul class="sectlevel2"> <li><a href="#_arhitektura_problema">Arhitektura problema</a></li> <li><a href="#_iskušenje_lažne_dobre_ideje">Iskušenje lažne dobre ideje</a></li> </ul> </li> <li><a href="#_решение_симулирајте_својство_са_extrapropertiesextension">Решение : Симулирајте својство са `ExtraPropertiesExtension</a> <ul class="sectlevel2"> <li><a href="#_korak_1_razumeti_extrapropertiesextension">Korak 1: Razumeti ExtraPropertiesExtension</a></li> <li><a href="#_korak_2_postavljanje_testa_priprema">Korak 2: Postavljanje testa - Priprema</a></li> <li><a href="#_корак_3_инјекција_својства">Корак 3: Инјекција својства</a></li> <li><a href="#_корак_4_дијаграм_тока_решења">Корак 4: Дијаграм тока решења</a></li> <li><a href="#_корак_5_препосле_упоређење">Корак 5: Пре/После упоређење</a></li> <li><a href="#_korak_6_upravljanje_više_test_slučajeva">Korak 6: Upravljanje više test slučajeva</a></li> <li><a href="#_konačna_arhitektura_rešenja">Konačna arhitektura rešenja</a></li> </ul> </li> <li><a href="#_prednosti_ovog_pristupa">Prednosti ovog pristupa</a></li> <li><a href="#_dobre_prakse_i_saveti">Dobre prakse i saveti</a> <ul class="sectlevel2"> <li><a href="#_kreirati_utilitarnu_metodu">Kreirati utilitarnu metodu</a></li> <li><a href="#_validacija_svojstva">Validacija Svojstva</a></li> </ul> </li> <li><a href="#_zaključak">Zaključak</a></li> </ul> </div> <div class="sect1"> <h2 id="_problem_izolovanje_jediničnih_testova_gradle_plugina">Problem: Izolovanje jediničnih testova Gradle plugina</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pri pisanju jediničnih testova za Gradle plugin, jedni od čestih izazova je upravljanje zavisnostima od konfiguracije projekta, kao što su svojstva definisana u fajlu`gradle.properties`. У нашем случају, плагин`jbake.ghpages`Trebalo je da pročita svojstvo`site_config_path`За да функционира правилно. Јединични тест за задатак`initialize`trebalo je da proveri ponašanje plugina u prisustvu ove osobine.</p> </div> <div class="paragraph"> <p>Osnovni problem je da su jedinični testovi, po dizajnu, moraju da budu <strong>izolirani</strong>. Korišćenje de`ProjectBuilder`Gradle kreira instancu od`Project`у меморији, потпуно одвојена од стварног пројекта на файл системе. Следоватно, оva тест инстанца аутоматски не чита датотеку.<code>gradle.properties`i dakle ne poznaje svojstvo`site_config_path</code>.</p> </div> <div class="sect2"> <h3 id="_arhitektura_problema">Arhitektura problema</h3> <div class="paragraph"> <p>Sledi dijagram ilustruje razdvojenost između okruženja za testiranje i sistema datoteka :</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !define RECTANGLE class package "Produkcijsko okruženje" { RECTANGLE ProjectReal { + build.gradle.kts + gradle.properties + src/ } RECTANGLE GradleProperties { site_config_path=src/jbake/settings/site.yml } RECTANGLE JbakePlugin { - readProperty(name: String) + initialize() } ProjectReal --> GradleProperties : lit au démarrage JbakePlugin --> GradleProperties : accède via project.properties } package "Testno okruženje" { RECTANGLE ProjectTest { + Créé par ProjectBuilder + En mémoire uniquement + Pas de gradle.properties } RECTANGLE JbakePluginTest { + testInitialize() } ProjectTest -[#red]x GradleProperties : ❌ Pas d'accès JbakePluginTest --> ProjectTest : utilise } note right of ProjectTest : Isolation = Pas d'accès\nau système de fichiers @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_iskušenje_lažne_dobre_ideje">Iskušenje lažne dobre ideje</h3> <div class="paragraph"> <p>Jedna od mogućih pristupa je da se kreira fajl`gradle.properties`štaično u resursima testa.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">// src/test/resources/gradle.properties site_config_path=src/jbake/settings/site.yml</code></pre> </div> </div> <div class="paragraph"> <p>Међувише, ову метода је осужена на неуспех јер`ProjectBuilder`Није дизајниран за скенирање файловног система у тражењу конфигурационих фајлова. Тест би остао изолисан и игнорисао ову датотеку.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_решение_симулирајте_својство_са_extrapropertiesextension">Решение : Симулирајте својство са `ExtraPropertiesExtension</h2> <div class="sectionbody"> <div class="paragraph"> <p>Eleгантно решење овог проблема није <strong>čitanje</strong> datoteke, već <strong>simulacija</strong> prisustva svojstva direktno u objektu.`Project`testa. Gradle nudi moćan mehanizam za ovo: <strong>dodatna svojstva</strong> (Dodatna svojstva).</p> </div> <div class="sect2"> <h3 id="_korak_1_razumeti_extrapropertiesextension">Korak 1: Razumeti ExtraPropertiesExtension</h3> <div class="paragraph"> <p>`ExtraPropertiesExtension`Je kontejner ključ-vrednost pridružen svakom objektu Gradle modela. Omogućava dinamičko dodavanje svojstava projektu, zadatku ili bilo drugom proširenju Gradle.</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !define RECTANGLE class RECTANGLE Project { + name: String + version: String + extensions: ExtensionContainer + properties: Map<String, ?> } RECTANGLE ExtensionContainer { + getByType(Class<T>): T + add(String, Object): void } RECTANGLE ExtraPropertiesExtension { + set(String, Object): void + get(String): Object + has(String): boolean + getProperties(): Map<String, Object> } Project --> ExtensionContainer : contient ExtensionContainer --> ExtraPropertiesExtension : gère ExtraPropertiesExtension --> Project : synchronise avec\nproject.properties note right of ExtraPropertiesExtension : Point d'entrée pour\ninjecter des propriétés @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_korak_2_postavljanje_testa_priprema">Korak 2: Postavljanje testa - Priprema</h3> <div class="paragraph"> <p>Počnimo sa kreiranjem osnovne strukture našeg jediničnog testa:</p> </div> <div class="listingblock"> <div class="title">JbakeGhPagesPluginTest.kt - Structure de base</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">class JbakeGhPagesPluginTest { @TempDir lateinit var testProjectDir: File @Test fun `check initialize and config yaml file if not existing`() { // Étape 1 : Créer un projet de test isolé val project = ProjectBuilder.builder() .withProjectDir(testProjectDir) .build() // Suite des étapes... } }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_корак_3_инјекција_својства">Корак 3: Инјекција својства</h3> <div class="paragraph"> <p>Ovo je detaljni proces za injektovanje svojstva u testnom projektu:</p> </div> <div class="listingblock"> <div class="title">JbakeGhPagesPluginTest.kt - Injection complète</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `check initialize and config yaml file if not existing`() { // Étape 1 : Créer un projet de test isolé en mémoire val project = ProjectBuilder.builder() .withProjectDir(testProjectDir) .build() // Étape 2 : Récupérer le gestionnaire de propriétés supplémentaires val extra = project.extensions.getByType(ExtraPropertiesExtension::class.java) // Étape 3 : Définir la propriété requise pour ce test extra.set("site_config_path", "src/jbake/settings/site.yml") // Étape 4 : Vérifier que la propriété est bien injectée assertTrue(project.hasProperty("site_config_path")) // Étape 5 : Appliquer le plugin qui pourra maintenant accéder à la propriété project.plugins.apply("jbake.ghpages") // Étape 6 : Exécuter la tâche et vérifier son comportement val task: Task = project.tasks.findByName("initialize") .apply(::assertNotNull)!! // Étape 7 : Exécuter les actions de la tâche task.actions.forEach { it.execute(task) } // Étape 8 : Assertions finales assertEquals( "src/jbake/settings/site.yml", project.properties["site_config_path"], "La propriété devrait être accessible dans le projet" ) }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_корак_4_дијаграм_тока_решења">Корак 4: Дијаграм тока решења</h3> <div class="listingblock"> <div class="content"> <pre>@startuml start :Créer ProjectBuilder; :Obtenir ExtraPropertiesExtension; :Injecter la propriété\nvia extra.set(); partition "Proverke" { :Vérifier project.hasProperty(); :Appliquer le plugin; :Récupérer la tâche; } partition "Извршење" { :Exécuter les actions\nde la tâche; :Le plugin lit\nproject.properties; } partition "Utvrde" { :Vérifier la propriété\nest accessible; :Valider le comportement\nattendues; } stop @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_корак_5_препосле_упоређење">Корак 5: Пре/После упоређење</h3> <div class="listingblock"> <div class="content"> <pre>@startuml !define RECTANGLE class package "PRIJE - Problematika" { RECTANGLE TestProject1 { + ProjectBuilder.build() + Pas de propriétés } RECTANGLE Plugin1 { + initialize() + ❌ project.properties["putanja_do_konfiguracije_sajta"] = null } TestProject1 --> Plugin1 : échec note right of Plugin1 : Test échoue car\nla propriété n'existe pas } package "NAKON - Rešenje" { RECTANGLE TestProject2 { + ProjectBuilder.build() + ExtraPropertiesExtension } RECTANGLE ExtraProps { + set("putanja_do_konfiguracije_sajta", "...") } RECTANGLE Plugin2 { + initialize() + ✅ project.properties["putanja_do_konfiguracije_sajta"] = "src/jbake/settings/site.yml" } TestProject2 --> ExtraProps : configure ExtraProps --> Plugin2 : propriété disponible note right of Plugin2 : Test réussit car\nla propriété est simulée } @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_korak_6_upravljanje_više_test_slučajeva">Korak 6: Upravljanje više test slučajeva</h3> <div class="paragraph"> <p>Da testiramo različite scenarije, napravimo više testova sa raznim konfiguracijama:</p> </div> <div class="listingblock"> <div class="title">Tests multiples avec configurations différentes</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">class JbakeGhPagesPluginTest { @TempDir lateinit var testProjectDir: File private fun createProjectWithProperty(propertyValue: String?): Project { val project = ProjectBuilder.builder() .withProjectDir(testProjectDir) .build() // Injection conditionnelle de la propriété propertyValue?.let { value -> val extra = project.extensions.getByType(ExtraPropertiesExtension::class.java) extra.set("site_config_path", value) } return project } @Test fun `should work with valid property`() { val project = createProjectWithProperty("src/jbake/settings/site.yml") project.plugins.apply("jbake.ghpages") val task = project.tasks.findByName("initialize")!! task.actions.forEach { it.execute(task) } // Assertions pour le cas normal assertEquals("src/jbake/settings/site.yml", project.properties["site_config_path"]) } @Test fun `should handle missing property gracefully`() { val project = createProjectWithProperty(null) // Pas de propriété project.plugins.apply("jbake.ghpages") val task = project.tasks.findByName("initialize")!! // Le plugin devrait gérer l'absence de propriété assertDoesNotThrow { task.actions.forEach { it.execute(task) } } } @Test fun `should handle invalid property path`() { val project = createProjectWithProperty("invalid/path/to/config.yml") project.plugins.apply("jbake.ghpages") val task = project.tasks.findByName("initialize")!! // Test du comportement avec un chemin invalide assertThrows<FileNotFoundException> { task.actions.forEach { it.execute(task) } } } }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_konačna_arhitektura_rešenja">Konačna arhitektura rešenja</h3> <div class="listingblock"> <div class="content"> <pre>@startuml !define RECTANGLE class package "Testno okruženje" { RECTANGLE TestClass { + createProjectWithProperty() + testValidProperty() + testMissingProperty() + testInvalidProperty() } RECTANGLE ProjectBuilder { + builder() + withProjectDir() + build() } RECTANGLE TestProject { + extensions + properties + plugins + tasks } RECTANGLE ExtraPropertiesExtension { + set(key, value) + get(key) + has(key) } RECTANGLE JbakePlugin { + apply(project) + createInitializeTask() + readSiteConfigPath() } } TestClass --> ProjectBuilder : utilise ProjectBuilder --> TestProject : crée TestProject --> ExtraPropertiesExtension : contient TestClass --> ExtraPropertiesExtension : configure ExtraPropertiesExtension --> TestProject : synchronise properties TestProject --> JbakePlugin : applique JbakePlugin --> TestProject : lit properties note right of ExtraPropertiesExtension : Point de contrôle\npour l'injection note bottom of TestProject : Environnement\ncontrôlé et isolé @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_prednosti_ovog_pristupa">Prednosti ovog pristupa</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><strong>potpuna izolacija</strong>: Test ne зависи од ниједnog vanjskog fajla. On je samostajan i može se izvršiti pouzdano u bilo kom okruženju (lokalno, CI/CD i t.d.).</p> </li> <li> <p><strong>Jasnoća i namera</strong>: Test izričito navodi uslove koji su potrebni za njegovo izvođenje. Ko god pročita test odmah vidi da je plugin zahteva svojstvo.`site_config_path`da funkcioniše.</p> </li> <li> <p><strong>одржајност</strong>Ако се промени име својства, довољно је да ga ажурирате на једној позицији у тесту, без манипуловања тестним конфигурационим датотекама.</p> </li> <li> <p><strong>fleksibilnost</strong>: Postaje trivijalno testirati različite scenarije jednostavno menjajući vrednost injektovane svojstva u svakom testu (validna vrednost, nevalidna, odsutna i sl.).</p> </li> <li> <p><strong>Извршеност</strong>: Ne čitanje fajlova, sve se dešava u memoriji, što ubržava testove.</p> </li> <li> <p><strong>ponovljivost</strong>Testovi su deterministički jer ne zavise od stanja datotečnog sistema.</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_dobre_prakse_i_saveti">Dobre prakse i saveti</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_kreirati_utilitarnu_metodu">Kreirati utilitarnu metodu</h3> <div class="listingblock"> <div class="title">Méthode utilitaire pour la réutilisation</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">class GradleTestUtils { companion object { fun createProjectWithProperties( projectDir: File, properties: Map<String, String> ): Project { val project = ProjectBuilder.builder() .withProjectDir(projectDir) .build() val extra = project.extensions.getByType(ExtraPropertiesExtension::class.java) properties.forEach { (key, value) -> extra.set(key, value) } return project } } }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_validacija_svojstva">Validacija Svojstva</h3> <div class="listingblock"> <div class="title">Validation robuste</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `should validate property injection`() { val project = createProjectWithProperty("test-value") // Vérifications multiples assertTrue(project.hasProperty("site_config_path")) assertEquals("test-value", project.property("site_config_path")) assertNotNull(project.properties["site_config_path"]) // Vérification que la propriété est accessible par le plugin project.plugins.apply("jbake.ghpages") // ... reste du test }</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Umesto da se trudite da konfiguracione fajlove budu čitani u okruženju unitarnog testiranja, najbolja praksa je da simulišete potrebno stanje. Korišćenje`ExtraPropertiesExtension`Програмско podešavanje Gradle svojstava je najčistiji i najpouzdaniji način za izvođenje efikasnih i pouzdanih unit testova pluginova.</p> </div> <div class="paragraph"> <p>Ova tehnika transformiše problem vanjskog zavisnosti u jednostavnu injekciju zavisnosti, u samom srcu filozofije Test-Driven Development (TDD). Nudi potpunu kontrolu nad test okruženjem, čuvajući izoljaciju potrebnu za kvalitetne unit testove.</p> </div> <div class="paragraph"> <p>Dijagrami i primeri prikazani u ovom članku pokazuju kako se ovaj pristup može primeniti postupno i sistemski, omogućavajući kreiranje jakog i održivog paketa testova za vaše Gradle pluginove.</p> </div> </div> </div> https://cheroliv.com/blog/2025/0079_gradle_tasks_tests_report_post.html Fri, 11 Jul 2025 00:00:00 +0000 blog/2025/0079_gradle_tasks_tests_report_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_centralizirati_konfiguracije_sa_allprojects_i_subprojects">Centralizirati konfiguracije sa <code>allprojects</code> i `subprojects</a></li> <li><a href="#_sourceplantuml">[source,plantuml]</a></li> <li><a href="#_enduml">@enduml</a></li> <li><a href="#_sourcekotlin">[source,kotlin]</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <p>Automatizacija zadataka za build je ključna za svaki softverski projekat, a Gradle, uz svoj Kotlin DSL, nudi izuzetnu fleksibilnost. Tokom naše rasprave, istražili smo kako centralizovati i ponovo koristiti logiku builda, posebno za izveštaje o testiranju, korišćenjem<strong>allprojects</strong>, <strong>buildSrc</strong>, и прилагођени задатаци у Kotlin</p> </div> </div> </div> <div class="sect1"> <h2 id="_centralizirati_konfiguracije_sa_allprojects_i_subprojects">Centralizirati konfiguracije sa <code>allprojects</code> i `subprojects</h2> <div class="sectionbody"> <div class="paragraph"> <p>Blokovi`allprojects` et `subprojects`у вашем`build.gradle.kts`Koreni su osnovni za primenu zajedničkih konfiguracija kroz vaš multimodularni projekat.</p> </div> <div class="paragraph"> <p>*<code>allprojects { …​ }</code>: Примени конфигурацију на<strong>корени пројекат и свим његовим подпројектима</strong>. Idealno za definisanje jednom? Wait, I need to check: I wrote "jednom" incorrectly. Should be "jednog". So final: ". Idealno za definisanje jednog". Ensure correct.</p> </div> <div class="paragraph"> <p></think></p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Idealno za definisanje једног`group`, jedna`version`, ili neke`repositories`заједницки. *<code>subprojects { …​ }</code>: Primeni konfiguraciju<strong>samo podprojektima</strong>, isključujući korenjski projekat. Idealno za primenu specifičnih pluginova za module (kao`java` ou <code>kotlin-jvm</code>)或 заједничке зависности у вашим библиотекама.</p> </li> </ol> </div> <div class="paragraph"> <p>Ово је илустративан пример :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// build.gradle.kts (projet racine) plugins { base // Appliqué au projet racine } allprojects { group = "com.example" version = "1.0.0" repositories { mavenCentral() } tasks.withType<org.gradle.api.tasks.testing.Test> { useJUnitPlatform() // Configuration commune des tests pour tous les projets } } subprojects { apply(plugin = "java") apply(plugin = "org.jetbrains.kotlin.jvm") dependencies { implementation("org.jetbrains.kotlin:kotlin-stdlib-jdk8") } }</code></pre> </div> </div> <div class="paragraph"> <p>\==<code>buildSrc</code>: Švicarski nož logike gradnje</p> </div> <div class="paragraph"> <p>Kada logika vaših zadataka postaje kompleksna ili mora biti ponovo korišćena,<strong>buildSrc</strong>Ово је предпочелно решење. Ово је посебан Gradle модул који се компајлира пре главних скриптова за градње, чинећи његове класе доступним на класапат у целином вашем градње.</p> </div> <div class="paragraph"> <p>Zašto koristiti`buildSrc`за задачи ?</p> </div> <div class="ulist"> <ul> <li> <p><strong>Ponovna upotreba</strong>: Задатак дефинисан у`buildSrc`Можемо да се примени на било који пројекат грађења.</p> </li> <li> <p><strong>Organizacija</strong>: Centralizuje kod gradnje, čineći ga čistijim i lakše održivim.</p> </li> <li> <p><strong>Sigurnost tipova i autodopunjavanje</strong>: Код у Kotlin у`buildSrc`kompajlira se, nudući provjeru grešaka i autocompletion vašeg IDE-a, poboljšavajući iskustvo razvoja.</p> </li> </ul> </div> <div class="paragraph"> <p>\=== Dijagram toka`buildSrc`(Код PlantUML)</p> </div> <div class="paragraph"> <p>Da biste generisali ovaj dijagram, kopirajte kod ispod i zalepite ga u alat koji podržava PlantUML.</p> </div> </div> </div> <div class="sect1"> <h2 id="_sourceplantuml">[source,plantuml]</h2> <div class="sectionbody"> <div class="paragraph"> <p>@startuml skinparam handwritten true skinparam monochrome true</p> </div> <div class="paragraph"> <p>правоугаоник "Gradle Build Process" { component "buildSrc" as BS { fajl "MyCustomTask.kt" kao T fajl "MyConventionPlugin.kt" kao P } komponenta "Root Project" as RP komponenta "Subproject A" kao SA komponenta "Subproject B" kao SB }</p> </div> <div class="paragraph"> <p>T --\> P : "je definirano u P --\> RP : "primenjuje se na P --\> SA : "primenjuje se na P --\> SB : "primenjuje se na</p> </div> <div class="paragraph"> <p>RP --|\> SA : "sadrži RP --|\> SB : "sadrži</p> </div> <div class="paragraph"> <p>RP -up-\> BS : "зависи од (за логику грађења) SA -up→ BS : "zavisi od (za logiku gradnje) SB -up-\> BS : "zavisi od (za logiku gradnje)</p> </div> <div class="paragraph"> <p>белешка десно од T Prilagođene klase zadataka OpenTestReportTask završna beleška</p> </div> <div class="paragraph"> <p>белешка десно од P Konvencija plugini koji beleže zadatke белешка на крај</p> </div> </div> </div> <div class="sect1"> <h2 id="_enduml">@enduml</h2> <div class="sectionbody"> <div class="paragraph"> <p>\== Kreiranje apstraktnih zadataka izveštaja</p> </div> <div class="paragraph"> <p>Za upravljanje izveštajima o testovima, smo koncipirali modularni pristup korišćenjem apstraktne klase zadatka u`buildSrc`. Po vašim potrebama, ova klasa može da nasledi`DefaultTask` ou de <code>Exec</code>.</p> </div> <div class="paragraph"> <p>\=== Abstraktni zadatak`OpenTestReportTask`(наслеђујући од`DefaultTask`)</p> </div> <div class="paragraph"> <p>Ovaj pristup se preporučuje ako vam je potrebna prilagođena Kotlin logika koja interaguje sa sistemom datoteka ili drugim Gradle API-jevima, a zatim pokreće vanjsku komandu.</p> </div> </div> </div> <div class="sect1"> <h2 id="_sourcekotlin">[source,kotlin]</h2> <div class="sectionbody"> <div class="paragraph"> <p>paket com.yourpackage</p> </div> <div class="paragraph"> <p>import org.gradle.api.DefaultTask import org.gradle.api.tasks.Input import org.gradle.api.tasks.TaskAction import java.io.File</p> </div> <div class="paragraph"> <p>abstract class OpenTestReportTask : DefaultTask() {</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">---- ---- init { group = "verification" description = "Opens a test report in Firefox." dependsOn("check") // Assure que les rapports sont générés } @get:Input abstract var reportPath: String @TaskAction fun openReport() { val separator = File.separator val reportFile = project.layout.projectDirectory.asFile.toPath() .resolve(reportPath.replace("/", separator)) .toAbsolutePath() .toFile() if (!reportFile.exists()) { logger.warn("Report file does not exist: $reportFile. Ensure 'check' ran.") return } project.exec { commandLine("firefox", "--new-tab", reportFile.absolutePath) } logger.lifecycle("Opened test report: ${reportFile.absolutePath}") } ---- ## } \=== Implementacije Konkretne Ove klase nasleđuju iz apstraktnog zadatka i definišu specifičnu putanju izveštaja. [source,kotlin] package com.yourpackage apstraktna klasa ReportUnitTestsTask : OpenTestReportTask() { init { description = "Отвара извештај о юнит тесту у Firefox. reportPath = "build/reports/tests/test/index.html } } paket com.vasepaket ## abstract class ReportFunctionalTestsTask : OpenTestReportTask() { init { description = "Отвара извештај о функционалним тестовима у Firefox-у." reportPath = "build/reports/tests/functionalTest/index.html" } } \=== Запис задатака U`build.gradle.kts`вашег коренског пројекта : ## [source,kotlin] tasks.register\<com.yourpackage.ReportUnitTestsTask\>("reportTests") {} tasks.register\<com.yourpackage.ReportFunctionalTestsTask\>("reportFunctionalTests") {} \=== UML dijagram zadataka izveštaja (Code PlantUML) Копирајте код испод и залепите га у алатка која подржава PlantUML. ## [source,plantuml] @startuml skinparam handwritten true skinparam monochrome true apstraktna klasa DefaultTask { } apstraktna klasa Exec { \+ commandLine(args: String...) \+ exec() } apstraktna klasa OpenTestReportTask extends DefaultTask { \+ grupa: String = "verifikacija \+ opis: String \+ dependsOn("check") + abstract reportPath: String \+ openReport() : void } apstraktna klasa AbstractJbakeExecTask extends Exec { \+ group: String = "проверка \+ opis: String \+ dependsOn("check") \+ abstract reportRelativePath: String \+ exec() : void } class ReportUnitTestsTask extends OpenTestReportTask { \+ reportPath: String = "build/reports/tests/test/index.html } class ReportFunctionalTestsTask extends OpenTestReportTask { \+ reportPath: String = "build/reports/tests/functionalTest/index.html } class ReportJbakeTestsTask extends AbstractJbakeExecTask { \+ reportRelativePath: String = "build/reports/tests/test/index.html } class ReportJbakeFunctionalTestsTask extends AbstractJbakeExecTask { \+ reportRelativePath: String = "build/reports/tests/functionalTest/index.html } OpenTestReportTask \<-- ReportUnitTestsTask OpenTestReportTask \<-- ReportFunctionalTestsTask AbstractJbakeExecTask \<-- ReportJbakeTestsTask AbstractJbakeExecTask <-- ReportJbakeFunctionalTestsTask DefaultTask \<|-- OpenTestReportTask Izvrši \<|-- AbstractJbakeExecTask DefaultTask \<|-- Exec ## @enduml \== апстрактан задатак`AbstractJbakeExecTask`(nasleđujući od`Exec`) Ako je vaša uloga uglavnom izvršavanje vanjske komande sa varijablenim argumentima, nasledujte direktno**Izvrši**је бежији. ## [source,kotlin] пакет com.yourpackage import org.gradle.api.tasks.Exec import org.gradle.api.tasks.Input import java.io.File apstraktna klasa AbstractJbakeExecTask : Exec() { ---- init { group = "verification" description = "Opens a Jbake project report in Firefox." dependsOn("check") } @get:Input abstract var reportRelativePath: String override fun exec() { val separator = File.separator val reportFile = project.layout.projectDirectory.asFile.toPath() .resolve(reportRelativePath.replace("/", separator)) .toAbsolutePath() .toFile() if (!reportFile.exists()) { logger.warn("Report file does not exist: $reportFile. Ensure 'check' ran.") return } commandLine("firefox", "--new-tab", reportFile.absolutePath) logger.lifecycle("Attempting to open report: ${reportFile.absolutePath}") super.exec() // Appelle la méthode exec() de la super-classe Exec } ## } \=== Конкретне имплементације за`Exec` ## [source,kotlin] paket com.yourpackage abstract class ReportJbakeTestsTask : AbstractJbakeExecTask() { inicijalizacija { Otvara izveštaj Jbake jediničnih testova u Firefox-u. reportRelativePath = "build/reports/tests/test/index.html } } package com.yourpackage ## abstract class ReportJbakeFunctionalTestsTask : AbstractJbakeExecTask() { init { description = "Otvara izveštaj funkcionalnih testova u Firefox-u." reportRelativePath = "build/reports/tests/functionalTest/index.html" } } \== Vidljivost zadataka`buildSrc` Задаци и класе које definiшете у**buildSrc**су: ***Vidljivi i upotrebljivi**по свим пројектима вашег главног билда (корен и подпројекти). Због тога можете да користите`com.yourpackage.ReportUnitTestsTask`у`allprojects { ... }`. * **Neizvršni**одноставно као задатке у buildSrc (на пример,`gradle :buildSrc:reportTests`Ne bi radilo ako zadatak nije specifično beležen u`buildSrc/build.gradle.kts`).`buildSrc`je modul kompilacije, ne modul izvršne aplikacije za ove zadatke glavnog builda. Izvršite izveštaj za testove`buildSrc`сам Si `buildSrc`ima sopstveni testovi i generiše izveštaje, vi mozete da registrovate zadatak izveštaja direktno u`buildSrc/build.gradle.kts`: ## [source,kotlin] plugins { `kotlin-jvm` } repozitorijumi { mavenCentral() } tasks.withType<Test> { useJUnitPlatform() reports.html.outputLocation.set(layout.buildDirectory.dir("reports/tests")) } import com.yourpackage.ReportJbakeTestsTask // Uvezite svoju klasu zadatka tasks.register\<ReportJbakeTestsTask\>("reportBuildSrcTests") { // Putanja je već definisana u klasi, ona će pokazivati na izveštaje iz buildSrc } Затим можете да извршите :`./gradlew :buildSrc:test`praćen od`./gradlew :buildSrc:reportBuildSrcTests`. Primenjivanjem ovih praksi, ćete izgraditi Gradle build sisteme u Kotlin DSL koji su ne samo moćni, nego i izuzetno modularni, održivi i laki za razumevanje.</code></pre> </div> </div> </div> </div> https://cheroliv.com/blog/2025/0078_jbake_gradle_plugin_syntaxe_post.html Wed, 9 Jul 2025 00:00:00 +0000 blog/2025/0078_jbake_gradle_plugin_syntaxe_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_cilj">cilj</a></li> <li><a href="#_декларативна_конфигурација">Декларативна конфигурација</a></li> <li><a href="#_arhitektura_plugina">Arhitektura plugina</a></li> <li><a href="#_definicija_dsl_ekstenzije">Definicija DSL ekstenzije</a></li> <li><a href="#_definicija_prilagođenog_zadatka">Definicija prilagođenog zadatka</a></li> <li><a href="#_interfejs_gitadapter">Interfejs GitAdapter</a></li> <li><a href="#_konkreta_implementacija_sa_jgit">Konkreta implementacija sa JGit</a></li> <li><a href="#_konfiguracija_dsl_kotlin">Konfiguracija DSL Kotlin</a></li> <li><a href="#_једноставни_тестови_са_mockito">Једноставни тестови са Mockito</a> <ul class="sectlevel2"> <li><a href="#_зависност">зависност</a></li> <li><a href="#_test_ponašanja_git">Test ponašanja Git</a></li> </ul> </li> <li><a href="#_закључак">Закључак</a></li> <li><a href="#_следни_кораци">Следни кораци</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <p>Овај чланак приказыва комплетан приступ дизајна и тестирања (TDD) Gradle додатка написаног на Kotlin DSL. Овај додатак аутоматизује генерисање статичких сајтова са <strong>JBake</strong> и <strong>Гит деплојмент</strong> преко <strong>JGit</strong>, све из једног YAML конфигурационог фајла.</p> </div> </div> </div> <div class="sect1"> <h2 id="_cilj">cilj</h2> <div class="sectionbody"> <div class="paragraph"> <p>Kreirati Gradle plugin:</p> </div> <div class="ulist"> <ul> <li> <p>конфигуриран у Kotlin DSL ;</p> </li> <li> <p>sposoban da :</p> </li> <li> <p>генериши статички сајт из JBake ;</p> </li> <li> <p>разгледати на удалени Гит репозиторијум преко JGit ;</p> </li> <li> <p>integrabilno u CI/CD radnom toku ;</p> </li> <li> <p>testirano prema TDD pristupu.</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_декларативна_конфигурација">Декларативна конфигурација</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovo je primer konfiguracije YAML koji treba da se modelira u našem DSL :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-yaml hljs" data-lang="yaml">bake: srcPath: "./site/jbake" destDirPath: "bake" pushPage: from: "bake" to: "cvs" repo: name: "trainings" repository: "https://github.com/pages-content/trainings.git" credentials: username: "USERNAME" password: "SECRET_TOKEN" branch: "main" message: "cheroliv.com"</code></pre> </div> </div> <div class="paragraph"> <p>Ova konfiguracija se prikazuje putem deklarativne Gradle ekstenzije u Kotlin DSL-u.</p> </div> </div> </div> <div class="sect1"> <h2 id="_arhitektura_plugina">Arhitektura plugina</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml package "plugin motora" { class WorkspaceEngineExtension class GenerateSiteTask interface GitAdapter class JGitAdapter WorkspaceEnginePlugin --> WorkspaceEngineExtension WorkspaceEnginePlugin --> GenerateSiteTask GenerateSiteTask --> GitAdapter JGitAdapter ..|> GitAdapter } @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_definicija_dsl_ekstenzije">Definicija DSL ekstenzije</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">open class WorkspaceEngineExtension { var outputDir: String = "build/site" var template: String = "freemarker" var repoUrl: String = "" var branch: String = "main" var message: String = "Generated by engine" }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_definicija_prilagođenog_zadatka">Definicija prilagođenog zadatka</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">abstract class GenerateSiteTask : DefaultTask() { lateinit var gitAdapter: GitAdapter @get:Input abstract val repoUrl: Property<String> @get:InputDirectory abstract val outputDir: DirectoryProperty @get:Input abstract val branch: Property<String> @get:Input abstract val message: Property<String> @TaskAction fun run() { val repo = gitAdapter.cloneRepository(repoUrl.get(), outputDir.get().asFile) gitAdapter.commitAndPush(repo, branch.get(), message.get()) } }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_interfejs_gitadapter">Interfejs GitAdapter</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">interface GitAdapter { fun cloneRepository(uri: String, directory: File): Repository fun commitAndPush(repo: Repository, branch: String, message: String) }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konkreta_implementacija_sa_jgit">Konkreta implementacija sa JGit</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">class JGitAdapter : GitAdapter { override fun cloneRepository(uri: String, directory: File): Repository { return Git.cloneRepository() .setURI(uri) .setDirectory(directory) .call() .repository } override fun commitAndPush(repo: Repository, branch: String, message: String) { Git(repo).use { it.add().addFilepattern(".").call() it.commit().setMessage(message).call() it.push().call() } } }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konfiguracija_dsl_kotlin">Konfiguracija DSL Kotlin</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">workspaceEngine { outputDir = "build/out" template = "freemarker" repoUrl = "https://github.com/cheroliv/trainings.git" branch = "main" message = "deploy from plugin" }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_једноставни_тестови_са_mockito">Једноставни тестови са Mockito</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_зависност">зависност</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">testImplementation("org.mockito:mockito-core:5.12.0") testImplementation("org.mockito.kotlin:mockito-kotlin:5.2.1") testImplementation("org.junit.jupiter:junit-jupiter:5.10.0")</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_test_ponašanja_git">Test ponašanja Git</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">class GenerateSiteTaskMockitoTest { @TempDir lateinit var tempDir: File @Test fun `task should call clone and commitAndPush`() { val project = ProjectBuilder.builder().build() val task = project.tasks.create("generateSite", GenerateSiteTask::class.java) val mockGitAdapter = mock<GitAdapter>() val mockRepo = mock<Repository>() whenever(mockGitAdapter.cloneRepository(any(), any())).thenReturn(mockRepo) task.gitAdapter = mockGitAdapter task.repoUrl.set("https://github.com/cheroliv/test.git") task.outputDir.set(project.layout.projectDirectory.dir(tempDir.name)) task.branch.set("main") task.message.set("test commit") task.run() verify(mockGitAdapter).cloneRepository(eq("https://github.com/cheroliv/test.git"), any()) verify(mockGitAdapter).commitAndPush(eq(mockRepo), eq("main"), eq("test commit")) } }</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre>@startuml actor "Razvijalac" as Dev participant "Gradle graditelj projekata" as Project participant "GenerateSiteTask" as Task participant "GitAdapter (Mock)" as Adapter participant "JGitAdapter / Mockito" as Impl Dev -> Project : construit projet Gradle Dev -> Task : configure les propriétés Task -> Adapter : cloneRepository() Adapter -> Impl : simulé par Mockito Task -> Adapter : commitAndPush() @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_закључак">Закључак</h2> <div class="sectionbody"> <div class="paragraph"> <p>Разделење одговорности преко`GitAdapter`umožava primenu TDD u razvoju Gradle plugina :</p> </div> <div class="ulist"> <ul> <li> <p>pozivi Git-a su apstraktni i testni;</p> </li> <li> <p>Konfiguracija DSL je čista i jasna;</p> </li> <li> <p>plugin ostaje agnostičan prema stvarnu implementaciju.</p> </li> </ul> </div> <div class="paragraph"> <p>Овај приступ обезбеђује високий ниво тестирања и проширивости (кон GitHub API, GitLab и др.).</p> </div> </div> </div> <div class="sect1"> <h2 id="_следни_кораци">Следни кораци</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Uključiti generisanje JBake kao`BakeAdapter`</p> </li> <li> <p>Додај интеграционе тестове са`GradleRunner`</p> </li> <li> <p>Podržati automatsko učitavanje fajlova`site.yml`putem SnakeYAML</p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2025/0077_asciidoc_syntaxe_post.html Fri, 20 Jun 2025 00:00:00 +0000 blog/2025/0077_asciidoc_syntaxe_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_увод">Увод</a></li> <li><a href="#_šta_je_asciidoc">Šta je AsciiDoc?</a> <ul class="sectlevel2"> <li><a href="#_zašto_birati_asciidoc">Zašto birati AsciiDoc?</a></li> </ul> </li> <li><a href="#_dijagram_slučajeva_korišćenja_use_case">Dijagram slučajeva korišćenja (Use Case)</a></li> <li><a href="#_dijagram_umske_mape">Dijagram umske mape</a></li> <li><a href="#_dijagram_toka_tok">Dijagram toka (tok)</a></li> <li><a href="#_osnovna_struktura_fajla_asciidoc">Osnovna struktura fajla AsciiDoc</a></li> <li><a href="#_основна_синтакса">основна синтакса</a> <ul class="sectlevel2"> <li><a href="#_naslovi_i_sekcije">Naslovi i sekcije</a></li> <li><a href="#_текст_у_подвлаченом_курзивном_и_монозакупном">Текст у подвлаченом, курзивном и монозакупном</a></li> <li><a href="#_liste_sa_tačkama_i_numerisane">Liste sa tačkama i numerisane</a></li> <li><a href="#_linkovi_i_slike">Linkovi i slike</a></li> <li><a href="#_blokovi_koda">Blokovi koda</a></li> <li><a href="#_slike">Slike</a></li> <li><a href="#_бележке_и_напамењи">Бележке и напамењи</a></li> </ul> </li> <li><a href="#_korišćenje_atributa_i_promenljivih">Korišćenje atributa i promenljivih</a></li> <li><a href="#_uobičajeni_slučajevi_upotrebe">Uobičajeni slučajevi upotrebe</a></li> <li><a href="#_dobre_prakse">Dobre prakse</a></li> <li><a href="#_zaključak">Zaključak</a></li> <li><a href="#_ићи_даље">Ићи даље</a></li> </ul> </div> <div class="sect1"> <h2 id="_увод">Увод</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title"><em>Ciljana publikacija :</em> Programeri, tehničari i svako ko želi da piše tehničku dokumentaciju ili bogate članci.</div> <p>AsciiDoc je lako jezik za markiranje dizajniran za pisanje strukturiranih tehničkih dokumenata, članaka, knjiga ili prezentacija. Ističe se po svojoj čitljivosti, bogatoj sintaksi i sposobnosti da generiše razne formate (HTML, PDF, DocBook itd.). U ovom članku ćemo istražiti osnovnu sintaksu AsciiDoc-a i predložiti savete za brzo upoznavanje.</p> </div> </div> </div> <div class="sect1"> <h2 id="_šta_je_asciidoc">Šta je AsciiDoc?</h2> <div class="sectionbody"> <div class="paragraph"> <p>AsciiDoc je opisni jezik, sličan Markdownu ali jači. Omogućuje efikasno strukturiranje teksta, naslova, listi, tabela, blokova koda i još mnogo više. Njegova fleksibilnost čini ga popularnim izborom za dokumentaciju open source projekata, pisanje knjiga i objavljivanje na webu.</p> </div> <div class="sect2"> <h3 id="_zašto_birati_asciidoc">Zašto birati AsciiDoc?</h3> <div class="olist arabic"> <ol class="arabic"> <li> <p>Čitljiva i intuitivna sintaksa.</p> </li> <li> <p>Нативна подршка за комплексне структуре (табеле, белешке, напомене, итако).</p> </li> <li> <p>Генерисање вишеформата (HTML, PDF, ePub, DocBook…).</p> </li> <li> <p>Jednostavna integracija sa generatorima statičkih sajtova kao što su JBake ili Antora.</p> </li> <li> <p>Napredna personalizacija sa atributima i ekstenzijama.</p> </li> </ol> </div> </div> </div> </div> <div class="sect1"> <h2 id="_dijagram_slučajeva_korišćenja_use_case">Dijagram slučajeva korišćenja (Use Case)</h2> <div class="sectionbody"> <div class="paragraph"> <p>Dijagram slučajeva korišćenja omogućava prikaz glavnih interakcija između korisnika i sistema. Evo jednostavnog primera za sistem dokumentacije:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml :Utilisateur: --> (Rédiger documentation) :Utilisateur: --> (Générer PDF) :Utilisateur: --> (Publier sur site web) (Rédiger documentation) ..> (Générer PDF) : inclut @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_dijagram_umske_mape">Dijagram umske mape</h2> <div class="sectionbody"> <div class="paragraph"> <p>Mind map (mentalna karta) je idealna za istraživanje koncepta povezаних sa AsciiDoc i njihovih odnosa:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startmindmap * AsciiDoc ** Syntaxe *** Titres *** Listes *** Blocs de code *** Tableaux ** Extensions *** PlantUML *** MathJax ** Export *** HTML *** PDF *** EPUB @endmindmap</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_dijagram_toka_tok">Dijagram toka (tok)</h2> <div class="sectionbody"> <div class="paragraph"> <p>Дијаграм тока омогућава опис процеса генерисања AsciiDoc документа:</p> </div> <div class="listingblock"> <div class="content"> <pre>@startuml start :Écrire fichier .adoc; :Ajouter images et diagrammes; if (Valider la syntaxe ?) then (oui) :Générer HTML/PDF; :Publier ou partager; else (non) :Corriger erreurs; :back to start; endif stop @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_osnovna_struktura_fajla_asciidoc">Osnovna struktura fajla AsciiDoc</h2> <div class="sectionbody"> <div class="paragraph"> <p>Datoteka AsciiDoc obično počinje naslovom, opcionim atributima, a zatim strukturirani sadržaj. Evo minimalnog primera:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">= Titre Principal Auteur 2024-09-03 :toc: :icons: font Votre contenu commence ici...</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_основна_синтакса">основна синтакса</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_naslovi_i_sekcije">Naslovi i sekcije</h3> <div class="paragraph"> <p>AsciiDoc подржава више нивоа наслова:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">= Titre de niveau 1 == Titre de niveau 2 === Titre de niveau 3 ==== Titre de niveau 4</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_текст_у_подвлаченом_курзивном_и_монозакупном">Текст у подвлаченом, курзивном и монозакупном</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">*gras* _italique_ `monospace`</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_liste_sa_tačkama_i_numerisane">Liste sa tačkama i numerisane</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">* Élément 1 * Élément 2 . Premier . Deuxième . Troisième</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_linkovi_i_slike">Linkovi i slike</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">Lien standard : https://asciidoc.org[AsciiDoc] Image : image::images/logo.png[AsciiDoc Logo]</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_blokovi_koda">Blokovi koda</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">[source,python]</code></pre> </div> </div> <div class="paragraph"> <p>def hello(): print("Здраво AsciiDoc !")</p> </div> </div> <div class="sect2"> <h3 id="_slike">Slike</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">|=== | Colonne 1 | Colonne 2 | Valeur A | Valeur B | Valeur C | Valeur D |===</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_бележке_и_напамењи">Бележке и напамењи</h3> <div class="paragraph"> <p>AsciiDoc nudi vizuelne informacione blokove:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">NOTE: Ceci est une note importante. TIP: Conseil utile pour l’utilisateur. WARNING: Attention à ce point.</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_korišćenje_atributa_i_promenljivih">Korišćenje atributa i promenljivih</h2> <div class="sectionbody"> <div class="paragraph"> <p>Prilagođeni atributi omogućavaju ponovnu upotrebu vrijednosti ili podešavanje ponašanja:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-asciidoc hljs" data-lang="asciidoc">:project-name: AsciiDoc Explorer Le projet s’appelle {project-name}.</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_uobičajeni_slučajevi_upotrebe">Uobičajeni slučajevi upotrebe</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Dokumentacija open source projekta (README, tehnička uputstva) - Писanje књига и е-књиге - Automatsko generiranje statičkih web sajtova (JBake, Antora) - Tehničke prezentacije</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_dobre_prakse">Dobre prakse</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Koristite konzistentne naslove i automatski sadržaj (:toc:). - Poželjava se koristiti upozorenja kako biste privukli pažnju na ključne tačke. Organizujte vaše datoteke da olakšate održavanje. - Koristite annotirane blokove koda da ilustrujete primere</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>AsciiDoc je moćan i pristupačan alat za pisanje sve tehničke dokumentacije ili strukturiranog članka. Njegova bogata sintaksa, kombiniрана sa generisanjem više formata, čini ga odličnim saveznikom za zahtevane developere i pisce. Pokušajte AsciiDoc u vašem narednom projektu i otkrijte razliku!</p> </div> </div> </div> <div class="sect1"> <h2 id="_ићи_даље">Ићи даље</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Službena dokumentacija: <a href="https://asciidoc.org" class="bare">https://asciidoc.org</a> - Asciidoctor : <a href="https://asciidoctor.org" class="bare">https://asciidoctor.org</a> - JBake i AsciiDoc: <a href="https://jbake.org/docs/2.6.4/#asciidoc_support" class="bare">https://jbake.org/docs/2.6.4/#asciidoc_support</a></p> </li> </ul> </div> <div class="paragraph"> <p>Podelite svoja iskustva i savete u komentaru!</p> </div> </div> </div> https://cheroliv.com/blog/2025/0076_port_forwarding_post.html Wed, 28 May 2025 00:00:00 +0000 blog/2025/0076_port_forwarding_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_проблема_nat_и_приватне_адресе">Проблема: NAT и приватне адресе</a></li> <li><a href="#_корак_1_идентификујте_вашу_јавну_ip_адресу">Корак 1: Идентификујте вашу јавну IP адресу</a></li> <li><a href="#_корак_2_познайте_локалну_ip_адресу_вашег_ubuntu_рачунара">Корак 2: Познайте локалну IP адресу вашег Ubuntu рачунара</a></li> <li><a href="#_korak_3_podešavanje_preusmeravanja_porta_na_vašem_ruteru">Korak 3: Podešavanje preusmeravanja porta na vašem ruteru</a> <ul class="sectlevel2"> <li><a href="#_приступ_administracijskom_interfejsu">Приступ administracijskom interfejsu</a></li> <li><a href="#_конфигурација_преусмеравања">Конфигурација преусмеравања</a></li> </ul> </li> <li><a href="#_корак_4_конфигурација_услуге_на_ubuntu">Корак 4: Конфигурација услуге на Ubuntu</a></li> <li><a href="#_корак_5_конфигурација_убунту_фајрволу">Корак 5 : Конфигурација Убунту фајрволу</a></li> <li><a href="#_korak_6_test_i_validacija">Korak 6 : Test i validacija</a> <ul class="sectlevel2"> <li><a href="#_тест_са_локалне_мреже">Тест са локалне мреже</a></li> <li><a href="#_тест_изван">Тест изван</a></li> </ul> </li> <li><a href="#_dobre_prakse_i_bezbednost">Dobre prakse i bezbednost</a> <ul class="sectlevel2"> <li><a href="#_основна_безбедност">Основна безбедност</a></li> <li><a href="#_monitoring_veza">Monitoring veza</a></li> <li><a href="#_коришћење_реверзног_прокси">Коришћење реверзног прокси</a></li> </ul> </li> <li><a href="#_alternative_za_preusmeravanje_porta">Alternative za preusmeravanje porta</a> <ul class="sectlevel2"> <li><a href="#_решения_у_облаку">Решения у облаку</a></li> <li><a href="#_vps_i_obrnuti_proxy">VPS i obrnuti proxy</a></li> </ul> </li> <li><a href="#_otklanjanje_poteškoća">Otklanjanje poteškoća</a> <ul class="sectlevel2"> <li><a href="#_češći_problemi">češći problemi</a></li> <li><a href="#_debug_mreže">Debug mreže</a></li> </ul> </li> <li><a href="#_zaključak">Zaključak</a></li> </ul> </div> <div id="preamble"> <div class="sectionbody"> <div class="ulist"> <div class="title">Cељна група: средњи</div> <ul> <li> <p><strong>Pretpostavljeni preuslovi</strong> : osnovno znanje Ubuntu-a, terminala, osnovni koncepti mreže</p> </li> <li> <p><strong>Tehnički pojmovi</strong> : NAT, preusmeravanje porta, vatrozidni zid, reverzni proxy</p> </li> <li> <p><strong>Системске команде</strong> : коришћење терминала, конфигурација мреже</p> </li> <li> <p><strong>Napredne sekcije</strong> : monitoring, bezbednost, alternative u oblaku</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_проблема_nat_и_приватне_адресе">Проблема: NAT и приватне адресе</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title">Проблематика : Ви развијете веб-апликацију на вашој Убунту машини и желите да буде доступна изван вашег домаћинског мрежа? Ви сте на правим месту! У овом чланку ћемо видети како да изложите локалну услугу (на пример на порту 8080) на Интернет конфигурисањем преусмеравања порта на вашем интернет рутеру.</div> <p>Podrazumevano vaš internetski ruter koristi NAT (Network Address Translation) da dele jednu javnu IP adresu između svih uređaja vaše kućne mreže. Vaši lokalni uređaji koriste privatne IP adrese (192.168.x.x, 10.x.x.x, itd.) koje nisu rutabilne na Internetu.</p> </div> <div class="paragraph"> <p>Kada pokrenete uslugu na vašoj Ubuntu mašini (npr. web server na portu 8080), ona je dostupna samo iz vaše lokalne mreže. Da bi je učinili dostupnom iz Interneta, moramo da podesimo preusmeravanje porta.</p> </div> </div> </div> <div class="sect1"> <h2 id="_корак_1_идентификујте_вашу_јавну_ip_адресу">Корак 1: Идентификујте вашу јавну IP адресу</h2> <div class="sectionbody"> <div class="paragraph"> <p>Prvo, preuzmimo javnu IP adresu vaše internet veze:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Plusieurs méthodes au choix curl ifconfig.me curl ipecho.net/plain wget -qO- http://ipecho.net/plain # Ou encore curl -s checkip.amazonaws.com</code></pre> </div> </div> <div class="paragraph"> <p>Ова IP адреса је онова коју ће корисници интернета користити за приступ вашем сервису.</p> </div> </div> </div> <div class="sect1"> <h2 id="_корак_2_познайте_локалну_ip_адресу_вашег_ubuntu_рачунара">Корак 2: Познайте локалну IP адресу вашег Ubuntu рачунара</h2> <div class="sectionbody"> <div class="paragraph"> <p>Vaša Ubuntu mašina ima privatnu IP adresu na vašoj lokalnoj mreži. Da biste je saznali:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Afficher toutes les interfaces réseau ip addr show # Ou plus spécifiquement pour l'interface principale ip route get 1.1.1.1 | awk '{print $7; exit}' # Alternative avec hostname hostname -I | awk '{print $1}'</code></pre> </div> </div> <div class="paragraph"> <p>Запамти ову адресу (на пример`192.168.1.100`), ćemo nam biti potrebno za konfiguraciju.</p> </div> </div> </div> <div class="sect1"> <h2 id="_korak_3_podešavanje_preusmeravanja_porta_na_vašem_ruteru">Korak 3: Podešavanje preusmeravanja porta na vašem ruteru</h2> <div class="sectionbody"> <div class="paragraph"> <p>Konfiguracija varira u zavisnosti od modela vašeg uređaja, ali princip ostaje isti:</p> </div> <div class="sect2"> <h3 id="_приступ_administracijskom_interfejsu">Приступ administracijskom interfejsu</h3> <div class="paragraph"> <p>Otvorite svoj pretraživač i idite na web interfejs svojeg rutera :</p> </div> <div class="ulist"> <ul> <li> <p><strong>Freebox</strong>:`192.168.1.1` ou <code>mafreebox.freebox.fr</code></p> </li> <li> <p><strong>Livebox Orange</strong> : <code>192.168.1.1</code></p> </li> <li> <p><strong>SFR Box</strong>:`192.168.1.1`</p> </li> <li> <p><strong>Bbox Bouygues</strong>:`192.168.1.254`</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_конфигурација_преусмеравања">Конфигурација преусмеравања</h3> <div class="paragraph"> <p>Pronađite sekciju posvećenu prosleđivanju porta (nazivi variju) :</p> </div> <div class="ulist"> <ul> <li> <p>Преусмеравање порта</p> </li> <li> <p>NAT/PAT</p> </li> <li> <p>Преузимање порта</p> </li> <li> <p>Игровни сервери</p> </li> </ul> </div> <div class="paragraph"> <p>Kreirajte novo pravilo sa ovim parametrima :</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 25%;"> <col style="width: 75%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">polje</th> <th class="tableblock halign-left valign-top">Vrednost</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Назив/Опис</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ubuntu web usluga (ili drugi jasni naziv)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Vanjski port (ili javni port)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">8080</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Unutrašnja IP adresa</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">IP vaše Ubuntu mašine (npr: 192.168.1.100)</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Unutrašnj port (ili privatni port)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">8080</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Protokol</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">TCP</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">стање</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Активисан</p></td> </tr> </tbody> </table> </div> </div> </div> <div class="sect1"> <h2 id="_корак_4_конфигурација_услуге_на_ubuntu">Корак 4: Конфигурација услуге на Ubuntu</h2> <div class="sectionbody"> <div class="paragraph"> <p>Uverite se da vaša usluga nasluhuje na svim interfejsima, a ne samo na localhostu :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># ✅ Correct : écoute sur toutes les interfaces python3 -m http.server 8080 --bind 0.0.0.0 # ❌ Incorrect : écoute seulement en local python3 -m http.server 8080 --bind 127.0.0.1</code></pre> </div> </div> <div class="paragraph"> <p>Да проверите да ли ваша услуга правилно слуша:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Vérifier les ports en écoute sudo netstat -tlnp | grep :8080 # ou avec ss (plus moderne) sudo ss -tlnp | grep :8080</code></pre> </div> </div> <div class="paragraph"> <p>Trebalo bi da vidite nešto kao`0.0.0.0:8080`и не`127.0.0.1:8080`.</p> </div> </div> </div> <div class="sect1"> <h2 id="_корак_5_конфигурација_убунту_фајрволу">Корак 5 : Конфигурација Убунту фајрволу</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ubuntu podrazumevano koristi UFW (Uncomplicated Firewall). Proverite njegov status i dozvolite port ako je potrebno :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Vérifier le statut du pare-feu sudo ufw status # Si le pare-feu est actif, autoriser le port 8080 sudo ufw allow 8080/tcp # Ou plus spécifiquement pour un service web sudo ufw allow 'Apache' # si vous utilisez Apache sudo ufw allow 'Nginx Full' # si vous utilisez Nginx</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_korak_6_test_i_validacija">Korak 6 : Test i validacija</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_тест_са_локалне_мреже">Тест са локалне мреже</h3> <div class="paragraph"> <p>Prvo, testirajte pristup s drugog računala u vašoj lokalnoj mreži :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Remplacez par l'IP locale de votre machine Ubuntu curl http://192.168.1.100:8080</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_тест_изван">Тест изван</h3> <div class="paragraph"> <p>Sada, testirajte sa interneta koristeći vašu javnu IP adresu:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Remplacez par votre IP publique curl http://VOTRE_IP_PUBLIQUE:8080</code></pre> </div> </div> <div class="paragraph"> <p>Možete takođe koristiti online alate kao:</p> </div> <div class="ulist"> <ul> <li> <p><a href="https://www.yougetsignal.com/tools/open-ports/" class="bare">https://www.yougetsignal.com/tools/open-ports/</a></p> </li> <li> <p><a href="https://canyouseeme.org/" class="bare">https://canyouseeme.org/</a></p> </li> </ul> </div> </div> </div> </div> <div class="sect1"> <h2 id="_dobre_prakse_i_bezbednost">Dobre prakse i bezbednost</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_основна_безбедност">Основна безбедност</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Configurer fail2ban pour protéger contre les attaques par force brute sudo apt update && sudo apt install fail2ban # Limiter l'accès avec UFW (exemple : autoriser seulement certaines IP) sudo ufw allow from 203.0.113.0/24 to any port 8080</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_monitoring_veza">Monitoring veza</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Surveiller les connexions en temps réel sudo netstat -an | grep :8080 # Logs des connexions (selon votre application) sudo tail -f /var/log/nginx/access.log # pour Nginx sudo journalctl -f -u your-service # pour un service systemd</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_коришћење_реверзног_прокси">Коришћење реверзног прокси</h3> <div class="paragraph"> <p>Za bolju bezbednost i fleksibilitet, razmotrite korišćenje reverse proxy-ja kao što je Nginx :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-nginx hljs" data-lang="nginx">server { listen 80; server_name votre-domaine.com; location / { proxy_pass http://localhost:8080; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } }</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_alternative_za_preusmeravanje_porta">Alternative za preusmeravanje porta</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_решения_у_облаку">Решения у облаку</h3> <div class="ulist"> <ul> <li> <p><strong>ngrok</strong>privremeni sigurnosni tunel</p> </li> <li> <p><strong>Cloudflare Tunnel</strong>: besplatno i sigurno rešenje</p> </li> <li> <p><strong>serveo.net</strong>: jednostavan SSH tunel</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Exemple avec ngrok ngrok http 8080 # Exemple avec serveo ssh -R 80:localhost:8080 serveo.net</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_vps_i_obrnuti_proxy">VPS i obrnuti proxy</h3> <div class="paragraph"> <p>Za profesionalnu upotrebu, razmislite o korišćenju VPS-a sa reverzním proxyom koji kaže na vašu lokalnu infrastrukturu putem VPN-a.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_otklanjanje_poteškoća">Otklanjanje poteškoća</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_češći_problemi">češći problemi</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 40%;"> <col style="width: 60%;"> </colgroup> <thead> <tr> <th class="tableblock halign-left valign-top">Problem</th> <th class="tableblock halign-left valign-top">Rešenje</th> </tr> </thead> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Usluga nije dostupna izvan</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Proverite konfiguraciju prijenosa porta i da li servis sluša na 0.0.0.0</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Veza odbacena</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Usluga nije pokrenuta ili sluša samo na 127.0.0.1</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Истек времена везе</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Problem sa firewallom (box ili Ubuntu) ili pogrešno konfigurisano port forwarding</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Javna IP se redovno menja.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Konfigurisite dinamički DNS (DynDNS, No-IP, itd.)</p></td> </tr> </tbody> </table> </div> <div class="sect2"> <h3 id="_debug_mreže">Debug mreže</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"># Tester la connectivité locale telnet localhost 8080 # Tester depuis une autre machine du réseau telnet 192.168.1.100 8080 # Vérifier les routes réseau ip route show # Analyser le trafic réseau sudo tcpdump -i any port 8080</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Izlaganje lokalnog servisa na Internet zahteva pažljivu konfiguraciju prijenosa porta, sigurnosti i monitoringu. Iako je ovaj pristup savršen za razvoj ili lične projekte, razmotrite jače alternative (VPS, CDN, usluge u oblaku) za proizvodnu upotrebu.</p> </div> <div class="paragraph"> <p>Važno je da uvek imate na umu bezbednost: koristite jače lozinke, redovno ažurirajte svoj sistem i pratite pristup vašim izloženim uslugama.</p> </div> <div class="paragraph"> <p>Ne sumnjajte da podelite vaša iskustva i pitanja u komentari!</p> </div> </div> </div> https://cheroliv.com/blog/2025/0099_debugging-mockito-gradle-plugin_post.html Sun, 17 Nov 2024 00:00:00 +0000 blog/2025/0099_debugging-mockito-gradle-plugin_post.html <div id="toc" class="toc"> <div id="toctitle">Table des matières</div> <ul class="sectlevel1"> <li><a href="#_uvod">Uvod</a></li> <li><a href="#_kontekst_plugin_gradle_bakery">Kontekst: Plugin Gradle Bakery</a></li> <li><a href="#_problem_1_proveri_loš_mock">Problem #1 : Proveri loš mock</a> <ul class="sectlevel2"> <li><a href="#_дијагноза">Дијагноза</a></li> <li><a href="#_решење">Решење</a></li> </ul> </li> <li><a href="#_проблем_2_unfinishedstubbingexception_у_каскади">Проблем #2 : UnfinishedStubbingException у каскади</a> <ul class="sectlevel2"> <li><a href="#_дијагностика">Дијагностика</a></li> <li><a href="#_решење_2">Решење</a></li> </ul> </li> <li><a href="#_проблем_3_файл_за_конфигурацију_не_постоји">Проблем #3: Файл за конфигурацију не постоји.</a> <ul class="sectlevel2"> <li><a href="#_дијагноза_2">Дијагноза</a></li> <li><a href="#_решение">Решение</a></li> </ul> </li> <li><a href="#_problem_4_afterevaluate_i_nullpointerexception">Problem #4 : afterEvaluate i NullPointerException</a> <ul class="sectlevel2"> <li><a href="#_дијагноза_3">Дијагноза</a></li> <li><a href="#_решение_2">Решение</a></li> </ul> </li> <li><a href="#_kompletno_resenje">Kompletno resenje</a></li> <li><a href="#_научене_лекције">Научене лекције</a> <ul class="sectlevel2"> <li><a href="#_proveriti_ispravni_mok">Proveriti ispravni mok</a></li> <li><a href="#_2_izbeći_ugnježene_mokove">2. Izbeći ugnježene mokove</a></li> <li><a href="#_3_mockovati_callbackove_evaluacije">3. Mockovati callbackove evaluacije</a></li> <li><a href="#_4_testirati_rešavanje_putanja">4. Testirati rešavanje putanja</a></li> </ul> </li> <li><a href="#_završna_arhitektura_testiranja">Završna arhitektura testiranja</a></li> <li><a href="#_zaključak">Zaključak</a></li> <li><a href="#_ресурси">ресурси</a></li> </ul> </div> <div class="sect1"> <h2 id="_uvod">Uvod</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pri razvoju plugina Gradle<strong>pekara</strong>Za moj blog JBake, susreo sam se s jednostavnim problemom: jedini test koji je pao uz grešku`Wanted but not invoked`. Što se čini da je bio trivijalni bug, otkriveno je kao savršeni primer za razumevanje subtiliteta mockinga uz Mockito i Kotlin.</p> </div> <div class="paragraph"> <p>U ovom članku vas vodim kroz metodički put ispravljanja grešaka, gde svako rešenje otkriva novi problem, do finalnog rešenja.</p> </div> </div> </div> <div class="sect1"> <h2 id="_kontekst_plugin_gradle_bakery">Kontekst: Plugin Gradle Bakery</h2> <div class="sectionbody"> <div class="paragraph"> <p>Plug-in Bakery je omotac oko JBake-a koji olakšava objavljivanje statičkih sajtova. Evo njegove pojednostavljene strukture:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">class BakeryPlugin : Plugin<Project> { override fun apply(project: Project) { val extension = project.extensions.create( "bakery", BakeryExtension::class.java ) project.afterEvaluate { if (!project.layout.projectDirectory.asFile .resolve(extension.configPath.get()).exists()) { println("config file does not exists") } else { // C'EST ICI QUE ÇA SE PASSE project.plugins.apply(JBakePlugin::class.java) val site = FileSystemManager.from(project, extension.configPath.get()) // Configuration de JBake... } } } }</code></pre> </div> </div> <div class="paragraph"> <p>Test koji je pao bio je jednostavan :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `plugin applies jbake gradle plugin`() { val project = createMockProject() val plugin = BakeryPlugin() plugin.apply(project) verify(project.plugins).apply(JBakePlugin::class.java) }</code></pre> </div> </div> <div class="paragraph"> <p>Greška:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">Wanted but not invoked: pluginContainer.apply(class org.jbake.gradle.JBakePlugin); Actually, there were zero interactions with this mock.</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_problem_1_proveri_loš_mock">Problem #1 : Proveri loš mock</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_дијагноза">Дијагноза</h3> <div class="listingblock"> <div class="content"> <pre>@startuml actor Test participant "project.plugins" as PP participant "mockPluginContainer" as MPC participant "BakeryPlugin" as BP Test -> Test: createMockProject() activate Test Test -> MPC: create mock Test -> PP: doReturn mockPluginContainer Test --> Test: return project deactivate Test Test -> BP: apply(project) activate BP BP -> PP: project.plugins PP --> BP: returns mockPluginContainer BP -> MPC: apply(JBakePlugin::class.java) deactivate BP Test -> PP: verify(project.plugins).apply(...) note right ❌ ÉCHEC ! Mockito vérifie "project.plugins" mais l'interaction a eu lieu sur "mockPluginContainer" end note @enduml</pre> </div> </div> <div class="paragraph"> <p>Проблем: Mockito не може да траце взаимодействије на`project.plugins`je samo getter koji vraća pravi mock`mockPluginContainer`. Provera mora da se izvede direktno na instanci mock objekta.</p> </div> </div> <div class="sect2"> <h3 id="_решење">Решење</h3> <div class="paragraph"> <p>Измени`createMockProject()`за враћање два объекта :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">private fun createMockProject(): Pair<Project, PluginContainer> { val mockPluginContainer = mock<PluginContainer>() val mockProject = mock<Project> { on { plugins } doReturn mockPluginContainer } return Pair(mockProject, mockPluginContainer) }</code></pre> </div> </div> <div class="paragraph"> <p>И прилагодити тест:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `plugin applies jbake gradle plugin`() { val (project, mockPluginContainer) = createMockProject() val plugin = BakeryPlugin() plugin.apply(project) // ✅ Vérification directe sur le bon mock verify(mockPluginContainer).apply(JBakePlugin::class.java) }</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_проблем_2_unfinishedstubbingexception_у_каскади">Проблем #2 : UnfinishedStubbingException у каскади</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_дијагностика">Дијагностика</h3> <div class="paragraph"> <p>Posle primene prve ispravke, pojavila se nova greška :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-text hljs" data-lang="text">UnfinishedStubbingException: Unfinished stubbing detected here Hints: 3. you are stubbing the behaviour of another mock inside before 'thenReturn' instruction is completed</code></pre> </div> </div> <div class="paragraph"> <p>Problematni kod je koristio DSL sintaksu Mockito-Kotlin:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val mockProject = mock<Project> { on { extensions } doReturn mockExtensionContainer on { plugins } doReturn mockPluginContainer on { logger } doReturn mock() // ❌ PROBLÈME ICI ! }</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre>@startuml participant "Mockito" as M participant "макет градитель" as MB participant "Inline Mock" as IM M -> MB: mock<Project> { ... } activate MB MB -> MB: on { logger } doReturn MB -> IM: mock() activate IM note right ❌ Création d'un nouveau mock PENDANT le stubbing en cours ! Mockito perd le contexte du stubbing parent end note IM --> MB: nouveau mock deactivate IM MB -x M: UnfinishedStubbingException deactivate MB @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_решење_2">Решење</h3> <div class="paragraph"> <p>Kreirati<strong>svi</strong>mocks izvan svakog stubbing bloka, pa ih konfiguriši sa`whenever()`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">private fun createMockProject(): Pair<Project, PluginContainer> { // 1️⃣ Créer TOUS les mocks d'abord val mockPluginContainer = mock<PluginContainer>() val mockExtensionContainer = mock<ExtensionContainer>() val mockLogger = mock<org.gradle.api.logging.Logger>() val mockProject = mock<Project>() // 2️⃣ Configurer les mocks séparément avec whenever() whenever(mockProject.plugins).thenReturn(mockPluginContainer) whenever(mockProject.extensions).thenReturn(mockExtensionContainer) whenever(mockProject.logger).thenReturn(mockLogger) return Pair(mockProject, mockPluginContainer) }</code></pre> </div> </div> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="Tip"></i> </td> <td class="content"> <div class="paragraph"> <p><strong>Злато правило</strong>: Никогда не звати`mock()`unutar bloka konfiguracije mocka. Uvek najprije kreirati mockove, zatim ih konfigurirati.</p> </div> </td> </tr> </table> </div> </div> </div> </div> <div class="sect1"> <h2 id="_проблем_3_файл_за_конфигурацију_не_постоји">Проблем #3: Файл за конфигурацију не постоји.</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_дијагноза_2">Дијагноза</h3> <div class="paragraph"> <p>Čak i sa ispravnim mock-ovima, test je nastavio da ne uspe jer plugin nije pronašao fajl konfiguracije :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// Dans BakeryPlugin.kt if (!project.layout.projectDirectory.asFile .resolve(extension.configPath.get()).exists()) { println("config file does not exists") return@afterEvaluate // ❌ Sort avant d'appliquer JBake ! }</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre>@startuml participant "BakeryPlugin" as BP participant "Raspored projekta" as PL participant "Proširenje" as EXT participant "Sistem datoteke" as FS BP -> PL: layout.projectDirectory.asFile PL --> BP: /some/mock/path BP -> EXT: extension.configPath.get() EXT --> BP: "../../site.yml" BP -> BP: resolve("../../site.yml") BP -> FS: exists() ? FS --> BP: false ❌ BP -> BP: return (skip JBake) note right Le plugin ne trouve pas le fichier et sort avant d'appliquer JBake end note @enduml</pre> </div> </div> </div> <div class="sect2"> <h3 id="_решение">Решение</h3> <div class="paragraph"> <p>Podesite mockove da resavanje puta funkcionise :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">private fun createMockProject(): Pair<Project, PluginContainer> { // ... autres mocks ... val configFile = File("../../site.yml").canonicalFile val projectDir = configFile.parentFile // Configuration cohérente des chemins whenever(mockConfigPathProperty.get()).thenReturn("site.yml") whenever(mockProjectDirectory.asFile).thenReturn(projectDir) // Maintenant : projectDir.resolve("site.yml") existe ! ✅ }</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre>@startuml !define SUCCESS #90EE90 !define PROBLEM #FFB6C1 rectangle "Mock konfiguracija" { card "projectDirectory.asFile" SUCCESS card "vraća: /real/path/to/project" SUCCESS card "configPath.get()" SUCCESS card "returns: site.yml" SUCCESS card "resolve()" SUCCESS card "/real/path/to/project/site.yml" SUCCESS card "postoji()" SUCCESS card "тачно ✅" SUCCESS } @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_problem_4_afterevaluate_i_nullpointerexception">Problem #4 : afterEvaluate i NullPointerException</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_дијагноза_3">Дијагноза</h3> <div class="paragraph"> <p>Плагин примењује JBake у блоку`afterEvaluate`, i pristupa`buildDirectory.dir()`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">project.afterEvaluate { // ... project.tasks.withType(JBakeTask::class.java) .getByName("bake").apply { output = project.layout.buildDirectory .dir(site.bake.destDirPath) // ❌ NPE ici ! .get() .asFile } }</code></pre> </div> </div> <div class="paragraph"> <p>Мок од`buildDirectory.dir()<code>vraćao se`null</code>.</p> </div> </div> <div class="sect2"> <h3 id="_решение_2">Решение</h3> <div class="paragraph"> <p>prigovarač`afterEvaluate`da bi se izvršilo odmah, i potpuno konfigurisati`buildDirectory`:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">private fun createMockProject(): Pair<Project, PluginContainer> { // ... autres mocks ... val mockBuildDirectory = mock<DirectoryProperty>() val buildDir = File(projectDir, "build") // Mocker dir() pour retourner un Provider valide whenever(mockBuildDirectory.dir(any<String>())).doAnswer { invocation -> val path = invocation.arguments[0] as String val mockDirProvider = mock<Provider<Directory>>() val mockDir = mock<Directory>() whenever(mockDir.asFile).thenReturn(File(buildDir, path)) whenever(mockDirProvider.get()).thenReturn(mockDir) mockDirProvider } // Mocker afterEvaluate pour exécution immédiate whenever(mockProject.afterEvaluate(any<Action<Project>>())).doAnswer { invocation -> val action = invocation.arguments[0] as Action<Project> action.execute(mockProject) // ✅ Exécution synchrone null } return Pair(mockProject, mockPluginContainer) }</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre>@startuml participant "Тест" as T participant "BakeryPlugin" as BP participant "mockProject" as MP participant "posleEvaluacije Akcija" as AE T -> BP: apply(project) activate BP BP -> MP: afterEvaluate { ... } activate MP note right Mock configuré pour exécuter immédiatement end note MP -> AE: execute(project) activate AE AE -> MP: layout.buildDirectory.dir("пеци") MP --> AE: Provider<Directory> ✅ AE -> MP: plugins.apply(JBakePlugin) deactivate AE MP --> BP: deactivate MP BP --> T: deactivate BP T -> T: verify(mockPluginContainer).apply(...) note right: ✅ SUCCÈS ! @enduml</pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_kompletno_resenje">Kompletno resenje</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ово је функција`createMockProject()`finale, koji rešava sve probleme :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">private fun createMockProject(): Pair<Project, PluginContainer> { // 1️⃣ CRÉER tous les mocks (pas de nested mocks !) val mockPluginContainer = mock<PluginContainer>() val mockExtensionContainer = mock<ExtensionContainer>() val mockLogger = mock<org.gradle.api.logging.Logger>() val mockTaskContainer = mock<TaskContainer>() val mockConfigPathProperty = mock<Property<String>>() val mockBakeryExtension = mock<BakeryExtension>() val mockProjectDirectory = mock<Directory>() val mockBuildDirectory = mock<DirectoryProperty>() val mockProjectLayout = mock<ProjectLayout>() val mockProject = mock<Project>() // 2️⃣ CONFIGURER la résolution des chemins val configFile = File("../../site.yml").canonicalFile val projectDir = configFile.parentFile val buildDir = File(projectDir, "build") whenever(mockConfigPathProperty.get()).thenReturn("site.yml") whenever(mockConfigPathProperty.isPresent).thenReturn(true) whenever(mockBakeryExtension.configPath).thenReturn(mockConfigPathProperty) whenever(mockProjectDirectory.asFile).thenReturn(projectDir) // 3️⃣ CONFIGURER buildDirectory avec dir() whenever(mockBuildDirectory.dir(any<String>())).doAnswer { invocation -> val path = invocation.arguments[0] as String val mockDirProvider = mock<Provider<Directory>>() val mockDir = mock<Directory>() whenever(mockDir.asFile).thenReturn(File(buildDir, path)) whenever(mockDirProvider.get()).thenReturn(mockDir) mockDirProvider } // 4️⃣ ASSEMBLER le projet whenever(mockProjectLayout.projectDirectory).thenReturn(mockProjectDirectory) whenever(mockProjectLayout.buildDirectory).thenReturn(mockBuildDirectory) whenever(mockExtensionContainer.create("bakery", BakeryExtension::class.java)) .thenReturn(mockBakeryExtension) whenever(mockExtensionContainer.getByType(BakeryExtension::class.java)) .thenReturn(mockBakeryExtension) whenever(mockProject.extensions).thenReturn(mockExtensionContainer) whenever(mockProject.plugins).thenReturn(mockPluginContainer) whenever(mockProject.tasks).thenReturn(mockTaskContainer) whenever(mockProject.layout).thenReturn(mockProjectLayout) whenever(mockProject.logger).thenReturn(mockLogger) whenever(mockProject.projectDir).thenReturn(projectDir) // 5️⃣ CONFIGURER afterEvaluate pour exécution immédiate whenever(mockProject.afterEvaluate(any<Action<Project>>())).doAnswer { invocation -> val action = invocation.arguments[0] as Action<Project> action.execute(mockProject) null } return Pair(mockProject, mockPluginContainer) }</code></pre> </div> </div> <div class="paragraph"> <p>I finalni test koji prolazi :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `plugin applies jbake gradle plugin`() { val (project, mockPluginContainer) = createMockProject() val plugin = BakeryPlugin() plugin.apply(project) verify(mockPluginContainer).apply(JBakePlugin::class.java) // ✅ SUCCÈS ! }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_научене_лекције">Научене лекције</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startmindmap * Mocking avec Mockito ** ✅ Bonnes pratiques *** Créer tous les mocks d'abord *** Configurer avec whenever() séparément *** Vérifier le mock exact, pas un proxy *** Tester la résolution des chemins ** ❌ Pièges à éviter *** mock() dans un bloc de configuration *** Vérifier project.x au lieu de mockX *** Ignorer les blocs afterEvaluate *** Retourner null pour les Providers @endmindmap</pre> </div> </div> <div class="sect2"> <h3 id="_proveriti_ispravni_mok">Proveriti ispravni mok</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// ❌ FAUX verify(project.plugins).apply(JBakePlugin::class.java) // ✅ CORRECT val (project, mockPluginContainer) = createMockProject() verify(mockPluginContainer).apply(JBakePlugin::class.java)</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_2_izbeći_ugnježene_mokove">2. Izbeći ugnježene mokove</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// ❌ FAUX - UnfinishedStubbingException val mockProject = mock<Project> { on { logger } doReturn mock() // Nested mock creation ! } // ✅ CORRECT - Créer séparément val mockLogger = mock<org.gradle.api.logging.Logger>() val mockProject = mock<Project>() whenever(mockProject.logger).thenReturn(mockLogger)</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_3_mockovati_callbackove_evaluacije">3. Mockovati callbackove evaluacije</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// ✅ afterEvaluate doit s'exécuter pour les tests whenever(mockProject.afterEvaluate(any())).doAnswer { invocation -> val action = invocation.arguments[0] as Action<Project> action.execute(mockProject) null }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_4_testirati_rešavanje_putanja">4. Testirati rešavanje putanja</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">// Toujours vérifier que les chemins se résolvent correctement val extension = project.extensions.getByType(BakeryExtension::class.java) val configPath = extension.configPath.get() val projectDir = project.layout.projectDirectory.asFile val resolvedConfig = projectDir.resolve(configPath) println("Resolved config: ${resolvedConfig.absolutePath}") println("Exists: ${resolvedConfig.exists()}")</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_završna_arhitektura_testiranja">Završna arhitektura testiranja</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre>@startuml package "Test sloj" { [Test Class] --> [createMockProject()] } package "Simulirano kreiranje" { [createMockProject()] --> [Create All Mocks] [Create All Mocks] --> [Configure Paths] [Configure Paths] --> [Configure Callbacks] [Configure Callbacks] --> [Assemble Project] } package "Мок објекти" { [Assemble Project] --> [Project Mock] [Assemble Project] --> [PluginContainer Mock] [Assemble Project] --> [Extension Mocks] [Assemble Project] --> [Layout Mocks] } package "Dodatak u testu" { [Test Class] --> [BakeryPlugin] [BakeryPlugin] --> [Project Mock] [BakeryPlugin] --> [PluginContainer Mock] } package "Verifikacija" { [Test Class] --> [verify(mockPluginContainer)] } @enduml</pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Što se činomalo kao jednostavni problem testiranja, pokazalo se kao odličan slučaj za studiju:</p> </div> <div class="ulist"> <ul> <li> <p>Subtilnosti Mockita sa Kotlinom</p> </li> <li> <p>Važnost mockovanja dobrih objekata</p> </li> <li> <p>Управљање асинхронним callbacks у тестовима</p> </li> <li> <p>Решавање путања у Gradle додацима</p> </li> </ul> </div> <div class="paragraph"> <p>Metodičko debugovanje, razumevši svaki sloj problema, omogućilo je da se dođe do jakog i održivog rešenja.</p> </div> <div class="admonitionblock tip"> <table> <tr> <td class="icon"> <i class="fa icon-tip" title="Tip"></i> </td> <td class="content"> <div class="paragraph"> <p><strong>Savet za vaše testove</strong>: Ako naiđete na "Wanted but not invoked" sa Mockito, uvek se pitajte : 1. Da li proveravam pravilan mock? 2. Да ли су сви моји мокови направљени изван блокова за конфигурацију? 3. Da li moji callbacks stvarno se izvršavaju? 4. Да ли мои путају решевају исправно?</p> </div> </td> </tr> </table> </div> </div> </div> <div class="sect1"> <h2 id="_ресурси">ресурси</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p><a href="https://github.com/mockito/mockito-kotlin">Документација Mockito-Kotlin</a></p> </li> <li> <p><a href="https://docs.gradle.org/current/userguide/custom_plugins.html">Uputstvo za razvoj Gradle plugina</a></p> </li> <li> <p><a href="https://jbake.org/">JBake Static Site Generator</a></p> </li> </ul> </div> <hr> <div class="paragraph"> <p><em>Da li ste naišli na slične probleme u vašim testovima? Podijelite svoje iskustvo u komentarima!</em></p> </div> </div> </div> https://cheroliv.com/blog/2024/0075_kotlin_arrow-traverse_right_and_left_post.html Tue, 24 Sep 2024 00:00:00 +0000 blog/2024/0075_kotlin_arrow-traverse_right_and_left_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_uvod">Uvod</a></li> <li><a href="#_šta_je_monada_either">Šta je monada Either?</a> <ul class="sectlevel2"> <li><a href="#_zašto_koristiti_either">Zašto koristiti Either?</a></li> </ul> </li> <li><a href="#_контекст">Контекст</a></li> <li><a href="#_različiti_pristupi">Različiti pristupi</a> <ul class="sectlevel2"> <li><a href="#_класичан_приступ_са_when">класичан приступ са `when</a></li> <li><a href="#_коришћење_fold_за_концизнији_приступ">Коришћење <code>fold</code> за концизнији приступ</a></li> <li><a href="#_преобразовање_са_map_и_mapleft">Преобразовање са <code>map</code> и `mapLeft</a></li> <li><a href="#_upravljanje_greškama_sa_getorelse">Upravljanje greškama sa `getOrElse</a></li> <li><a href="#_lateralne_akcije_sa_onleft_i_onright">Lateralne akcije sa <code>onLeft</code> i `onRight</a></li> <li><a href="#_lančanje_operacija_sa_flatmap">lančanje operacija sa `flatMap</a></li> <li><a href="#_bidirekcijska_transformacija_sa_bimap">Bidirekcijska transformacija sa `bimap</a></li> <li><a href="#_inverzija_stranica_sa_swap">Inverzija stranica sa `swap</a></li> <li><a href="#_korišćenje_tap_i_tapleft">Korišćenje <code>tap</code> i <code>tapLeft</code> :</a></li> <li><a href="#_коришћење_recover">Коришћење <code>recover</code> :</a></li> </ul> </li> <li><a href="#_praktični_slučajevi_korišćenja">Praktični slučajevi korišćenja</a></li> <li><a href="#_zaključak">Zaključak</a></li> <li><a href="#_да_идемо_напред">Да идемо напред</a></li> </ul> </div> <div class="sect1"> <h2 id="_uvod">Uvod</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title">_Ciljna grupa: _ Развијачи Kotlin од средњег до напредног нивоа.</div> <p>У свету функционалног програмирања у Kotlin-у, библиотека Arrow нуди моћне алате за управљање грешкама и алтернативним случајевима. међу овим алатма, монада`Either`se izdvaja svojom sposobnošću da predstavlja dva moguća stanja: uspeh (Right) ili neuspeh (Left). Ali kako efikasno navigirati između ova dva stanja ? Ovo ćemo istražiti u ovom članku.</p> </div> </div> </div> <div class="sect1"> <h2 id="_šta_je_monada_either">Šta je monada Either?</h2> <div class="sectionbody"> <div class="paragraph"> <p>Monada`Either`je struktura podataka koja predstavlja dve međusobno isključive mogućnosti. U Kotlinu sa Arrow bibliotekom, često se koristi za rukovlješenje slučajevima uspeha i neuspeha operacije, nudeći elegantnu alternativu tradicionalnim izuzecima.</p> </div> <div class="sect2"> <h3 id="_zašto_koristiti_either">Zašto koristiti Either?</h3> <div class="olist arabic"> <ol class="arabic"> <li> <p>Eksplicitno rukovanje greškama : Zahteva od programera da razmotri slučajeve neuspeha.</p> </li> <li> <p>Функционална композиција: Олакшано ланцирање операција које могу да не успеху.</p> </li> <li> <p>Type-safety: Greške su tipizirane, što pomaže da se upravljaju preciznije.</p> </li> <li> <p>Bez izuzetaka: Izbegavajte efekte strane i neočekivane prekide toka izvršenja.</p> </li> </ol> </div> </div> </div> </div> <div class="sect1"> <h2 id="_контекст">Контекст</h2> <div class="sectionbody"> <div class="paragraph"> <p>Pretpostavimo da razvijate REST API sahttps://spring.io/projects/spring-boot/[Spring Boot,windows=pročitaj kasnije] et <a href="https://kotlinlang.org/">Kotlin</a>, koristeći bibliotekuhttps://arrow-kt.io/[Arrow,windows=read-later]. Имаш функцију`findOneUserByEmail`koji vraća`Either<Throwable, User>`. Како можете обрадити тај резултат на изискан и функционалан начин?</p> </div> <div class="paragraph"> <p>Imamo klasu User:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@file:Suppress( "RemoveRedundantQualifierName", "MemberVisibilityCanBePrivate", "SqlNoDataSourceInspection" ) package webapp.users import arrow.core.Either import arrow.core.left import arrow.core.right import com.fasterxml.jackson.annotation.JsonIgnore import com.fasterxml.jackson.databind.ObjectMapper import jakarta.validation.constraints.NotNull import jakarta.validation.constraints.Pattern import jakarta.validation.constraints.Size import org.springframework.beans.factory.getBean import org.springframework.context.ApplicationContext import org.springframework.data.r2dbc.core.R2dbcEntityTemplate import org.springframework.r2dbc.core.DatabaseClient import org.springframework.r2dbc.core.awaitOne import org.springframework.r2dbc.core.awaitRowsUpdated import webapp.core.property.ANONYMOUS_USER import webapp.core.property.EMPTY_STRING import webapp.core.utils.AppUtils.cleanField import webapp.users.EntityModel.Companion.ID_MEMBER import webapp.users.User.UserDao.Attributes.EMAIL_ATTR import webapp.users.User.UserDao.Attributes.ID_ATTR import webapp.users.User.UserDao.Attributes.LANG_KEY_ATTR import webapp.users.User.UserDao.Attributes.LOGIN_ATTR import webapp.users.User.UserDao.Attributes.PASSWORD_ATTR import webapp.users.User.UserDao.Attributes.VERSION_ATTR import webapp.users.User.UserDao.Constraints.LOGIN_REGEX import webapp.users.User.UserDao.Fields.EMAIL_FIELD import webapp.users.User.UserDao.Fields.ID_FIELD import webapp.users.User.UserDao.Fields.LANG_KEY_FIELD import webapp.users.User.UserDao.Fields.LOGIN_FIELD import webapp.users.User.UserDao.Fields.PASSWORD_FIELD import webapp.users.User.UserDao.Fields.VERSION_FIELD import webapp.users.User.UserDao.Relations.INSERT import webapp.users.security.Role import webapp.users.security.Role.RoleDao import webapp.users.security.UserRole.UserRoleDao import java.util.* import jakarta.validation.constraints.Email as EmailConstraint data class User( override val id: UUID? = null, @field:NotNull @field:Pattern(regexp = LOGIN_REGEX) @field:Size(min = 1, max = 50) val login: String, @JsonIgnore @field:NotNull @field:Size(min = 60, max = 60) val password: String = EMPTY_STRING, @field:EmailConstraint @field:Size(min = 5, max = 254) val email: String = EMPTY_STRING, @JsonIgnore val roles: MutableSet<Role> = mutableSetOf(Role(ANONYMOUS_USER)), @field:Size(min = 2, max = 10) val langKey: String = EMPTY_STRING, @JsonIgnore val version: Long = -1, ) : EntityModel<UUID>() { companion object { @JvmStatic fun main(args: Array<String>) = println(UserDao.Relations.sqlScript) } object UserDao { object Constraints { // Regex for acceptable logins const val LOGIN_REGEX = "^(?>[a-zA-Z0-9!$&*+=?^_`{|}~.-]+@[a-zA-Z0-9-]+(?:\\.[a-zA-Z0-9-]+)*)|(?>[_.@A-Za-z0-9-]+)$" const val PASSWORD_MIN: Int = 4 const val PASSWORD_MAX: Int = 16 const val IMAGE_URL_DEFAULT = "https://placehold.it/50x50" const val PHONE_REGEX = "^(\\+|00)?[1-9]\\d{0,49}\$" } object Members { const val PASSWORD_MEMBER = "password" const val ROLES_MEMBER = "roles" } object Fields { const val ID_FIELD = "`id`" const val LOGIN_FIELD = "`login`" const val PASSWORD_FIELD = "`password`" const val EMAIL_FIELD = "`email`" const val LANG_KEY_FIELD = "`lang_key`" const val VERSION_FIELD = "`version`" } object Attributes { val ID_ATTR = ID_FIELD.cleanField() val LOGIN_ATTR = LOGIN_FIELD.cleanField() val PASSWORD_ATTR = PASSWORD_FIELD.cleanField() val EMAIL_ATTR = EMAIL_FIELD.cleanField() const val LANG_KEY_ATTR = "langKey" val VERSION_ATTR = VERSION_FIELD.cleanField() } object Relations { const val TABLE_NAME = "`user`" const val SQL_SCRIPT = """ CREATE TABLE IF NOT EXISTS $TABLE_NAME ( $ID_FIELD UUID default random_uuid() PRIMARY KEY, $LOGIN_FIELD VARCHAR, $PASSWORD_FIELD VARCHAR, $EMAIL_FIELD VARCHAR, $LANG_KEY_FIELD VARCHAR, $VERSION_FIELD bigint ); CREATE UNIQUE INDEX IF NOT EXISTS `uniq_idx_user_login` ON $TABLE_NAME ($LOGIN_FIELD); CREATE UNIQUE INDEX IF NOT EXISTS `uniq_idx_user_email` ON $TABLE_NAME ($EMAIL_FIELD); """ @Suppress("SqlDialectInspection") const val INSERT = """ insert into $TABLE_NAME ( $LOGIN_FIELD, $EMAIL_FIELD, $PASSWORD_FIELD, $LANG_KEY_FIELD, $VERSION_FIELD ) values ( :login, :email, :password, :langKey, :version)""" @JvmStatic val sqlScript: String get() = setOf( UserDao.Relations.SQL_SCRIPT, RoleDao.Relations.SQL_SCRIPT, UserRoleDao.Relations.SQL_SCRIPT ).joinToString("") .trimMargin() } object Dao { val Pair<User, ApplicationContext>.toJson: String get() = second.getBean<ObjectMapper>().writeValueAsString(first) suspend fun Pair<User, ApplicationContext>.save(): Either<Throwable, Long> = try { second.getBean<R2dbcEntityTemplate>() .databaseClient .sql(INSERT) .bind(LOGIN_ATTR, first.login) .bind(EMAIL_ATTR, first.email) .bind(PASSWORD_ATTR, first.password) .bind(LANG_KEY_ATTR, first.langKey) .bind(VERSION_ATTR, first.version) .fetch() .awaitRowsUpdated() .right() } catch (e: Throwable) { e.left() } suspend fun ApplicationContext.findOneUserByEmail( email: String ): Either<Throwable, User> = try { getBean<DatabaseClient>() .sql("SELECT * FROM `user` WHERE LOWER(email) = LOWER(:email)") .bind("email", email) .fetch() .awaitOne() .let { row -> User( id = row[ID_ATTR] as UUID?, login = row[LOGIN_ATTR] as String, password = row[PASSWORD_ATTR] as String, email = row[EMAIL_ATTR] as String, langKey = row[LANG_KEY_ATTR] as String, version = row[VERSION_ATTR] as Long ) }.right() } catch (e: Throwable) { e.left() } } } /** Account REST API URIs */ object UserRestApis { const val API_AUTHORITY = "/api/authorities" const val API_USERS = "/api/users" const val API_SIGNUP = "/signup" const val API_SIGNUP_PATH = "$API_USERS$API_SIGNUP" const val API_ACTIVATE = "/activate" const val API_ACTIVATE_PATH = "$API_USERS$API_ACTIVATE?key=" const val API_ACTIVATE_PARAM = "{activationKey}" const val API_ACTIVATE_KEY = "key" const val API_RESET_INIT = "/reset-password/init" const val API_RESET_FINISH = "/reset-password/finish" const val API_CHANGE = "/change-password" const val API_CHANGE_PATH = "$API_USERS$API_CHANGE" } } // Abstract entity model with Generic ID, which can be of any type abstract class EntityModel<T>( open val id: T? = null ) { companion object { const val ID_MEMBER = "id" } } // Generic extension function that allows the ID to be applied to any EntityModel type inline fun <reified T : EntityModel<ID>, ID> T.withId(id: ID): T { // Use reflection to create a copy with the passed ID return this::class.constructors.first { it.parameters.any { param -> param.name == ID_MEMBER } } .call(id, *this::class.constructors.first().parameters.drop(1).map { param -> this::class.members.first { member -> member.name == param.name }.call(this) }.toTypedArray()) }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_različiti_pristupi">Različiti pristupi</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_класичан_приступ_са_when">класичан приступ са `when</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val user: User by lazy { userFactory(USER) } val result: Either<Throwable, User> = context.findOneUserByEmail(user.email) when (result) { is Either.Left -> { val error = result.value println("Erreur : ${error.message}") } is Either.Right -> { val user = result.value println("Utilisateur trouvé : ${user.login}") } }</code></pre> </div> </div> <div class="paragraph"> <p>Ova metoda, iako je jednostavna i čitljiva, ne iskorištava puno mogućnosti funkcionalnosti Arrow.</p> </div> </div> <div class="sect2"> <h3 id="_коришћење_fold_за_концизнији_приступ">Коришћење <code>fold</code> за концизнији приступ</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">result.fold( { error -> println("Erreur : ${error.message}") }, { user -> println("Utilisateur trouvé : ${user.login}") } )</code></pre> </div> </div> <div class="paragraph"> <p>`fold`omogućava definisanje akcija za oba slučaja (Levo i Desno) na koncizan i elegan način</p> </div> </div> <div class="sect2"> <h3 id="_преобразовање_са_map_и_mapleft">Преобразовање са <code>map</code> и `mapLeft</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val processedResult = result .map { user -> "Utilisateur trouvé : ${user.login}" } .mapLeft { error -> "Erreur : ${error.message}" } println(processedResult.merge())</code></pre> </div> </div> <div class="paragraph"> <p>Ovaj pristup omogućava transformaciju vrednosti koje se nalaze u Either, čuvajući njenu strukturu, što je idealno za složenije lanove obrade.</p> </div> </div> <div class="sect2"> <h3 id="_upravljanje_greškama_sa_getorelse">Upravljanje greškama sa `getOrElse</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val user = result.getOrElse { error -> println("Erreur : ${error.message}") User(login = "default", email = "default@example.com") // utilisateur par défaut } println("Login : ${user.login}")</code></pre> </div> </div> <div class="paragraph"> <p>`getOrElse`pruža elegantno rukovanje greškama omogućavajući davanje podrazumevane vrednosti</p> </div> </div> <div class="sect2"> <h3 id="_lateralne_akcije_sa_onleft_i_onright">Lateralne akcije sa <code>onLeft</code> i `onRight</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">result.onLeft { error -> println("Erreur : ${error.message}") } .onRight { user -> println("Utilisateur trouvé : ${user.login}") }</code></pre> </div> </div> <div class="paragraph"> <p>Ove metode omogućavaju izvršavanje akcija na svakoj strani bez modifikacije Either, savršeno za beleženje ili lagane neželjane efekte.</p> </div> </div> <div class="sect2"> <h3 id="_lančanje_operacija_sa_flatmap">lančanje operacija sa `flatMap</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">fun findUser(email: String): Either<Throwable, User> = // ... implémentation fun getUserPermissions(user: User): Either<Throwable, List<String>> = // ... implémentation val userPermissions = findUser("user@example.com") .flatMap { user -> getUserPermissions(user) }</code></pre> </div> </div> <div class="paragraph"> <p><code>flatMap`je koristan za lanciranje operacija koje samim tim vraćaju`Either</code>, sprečavajući time`Either`угнежђени.</p> </div> </div> <div class="sect2"> <h3 id="_bidirekcijska_transformacija_sa_bimap">Bidirekcijska transformacija sa `bimap</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val result: Either<Throwable, User> = // ... obtention du résultat val processedResult = result.bimap( { error -> "Erreur: ${error.message}" }, { user -> "Utilisateur: ${user.login}" } )</code></pre> </div> </div> <div class="paragraph"> <p>`bimap`Omogućava da se i leva i desna strana transformišu u jednoj operaciji.</p> </div> </div> <div class="sect2"> <h3 id="_inverzija_stranica_sa_swap">Inverzija stranica sa `swap</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val result: Either<Throwable, User> = // ... obtention du résultat val swapped = result.swap()</code></pre> </div> </div> <div class="paragraph"> <p><code>swap`koristan je kada želite da obrnete strane`Either</code>, на пример, да би се прилагодио интерфејс једне функције другој.</p> </div> </div> <div class="sect2"> <h3 id="_korišćenje_tap_i_tapleft">Korišćenje <code>tap</code> i <code>tapLeft</code> :</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">result.tap { user -> println("Utilisateur trouvé : ${user.login}") } .tapLeft { error -> println("Erreur : ${error.message}") }</code></pre> </div> </div> <div class="paragraph"> <p>Сличан на`onLeft` et <code>onRight</code>, ali ove metode vraćaju originalni Either, što je korisno za lančanje operacija.</p> </div> </div> <div class="sect2"> <h3 id="_коришћење_recover">Коришћење <code>recover</code> :</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val recoveredUser = result.recover { error -> println("Erreur récupérée : ${error.message}") User(login = "recovered", email = "recovered@example.com") } println("Login : ${recoveredUser.login}")</code></pre> </div> </div> <div class="paragraph"> <p>Ova metoda omogućava da se Either.Left pretvori u Either.Right tako što se pruža vrednost zamene.</p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_praktični_slučajevi_korišćenja">Praktični slučajevi korišćenja</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Користите`fold`za jednostavne operacije koje zahtevaju obradu za svaki slučaj - Preferirajte`map` et <code>mapLeft`за трансформације података без мењања структуре`Either</code>. - Odaberite`flatMap`pri lančanju operacija koje mogu da ne uspeju. - Zaposлите`recover`da se pruži podrazumevana vrednost u slučaju greške. - Изберите`onLeft` et <code>onRight</code> (ou <code>tap</code> et <code>tapLeft</code>) за побочни ефекте као логовање. - Koristite`bimap`да трансформише обе страни у једну операцију. - Primenite`swap`kada morate da prilagodite interfejs jedne funkcije na drugu.</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Svaka od ovih pristupa ima svoje prednosti u zavisnosti od konteksta upotrebe. Metode kao`fold`, <code>map</code>/<code>mapLeft</code>, et `recover`posebno su korisni kada želite da lančate više operacija ili transformirate podatke na funkcionalni način.</p> </div> <div class="paragraph"> <p>Monada`Either`d’Arrow pruža izuzetnu fleksibilnost za rukovanje slučajevima uspeha i greške u vašim Kotlin aplikacijama. Osvajajući tim različitim pristupima, vi možete pisati kod koji je čvrstiji, čitljiviji i funkcionalniji.</p> </div> <div class="paragraph"> <p>U vašem sledećem projektu, ne bojte se da istražujete ove tehnike kako biste maksimalno iskorištali funkcionalno programiranje sa Kotlinom i Arrow-om!</p> </div> </div> </div> <div class="sect1"> <h2 id="_да_идемо_напред">Да идемо напред</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Službena dokumentacija Arrow :https://arrow-kt.io/docs/apidocs/arrow-core/arrow.core/-either/[Arrow Either] - Kotlin Coroutines sa Arrow :https://arrow-kt.io/docs/fx/[Arrow Fx Coroutines]</p> </li> </ul> </div> <div class="paragraph"> <p>Не заборавите да поделите своје искуство и ваше омиљене технике за рад са`Either`у коментарисма испод!</p> </div> </div> </div> https://cheroliv.com/blog/2024/0074_seach_file_linux_post.html Mon, 23 Sep 2024 00:00:00 +0000 blog/2024/0074_seach_file_linux_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_увод">Увод</a></li> <li><a href="#_коришћење_команде_find">Коришћење команде `find</a> <ul class="sectlevel2"> <li><a href="#_додатни_опције_за_find">Додатни опције за `find</a></li> </ul> </li> <li><a href="#_upotreba_komande_locate">Upotreba komande `locate</a></li> <li><a href="#_коришћење_команде_grep_за_претрагу_текста_у_фајловима">Коришћење команде <code>grep</code> за претрагу текста у фајловима</a></li> <li><a href="#_zaključak">Zaključak</a></li> </ul> </div> <div class="sect1"> <h2 id="_увод">Увод</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title">Проблематика : Tražite fajlove u Linux operativnom sistemu preko terminala.</div> <p>U ovom članku ćemo istražiti kako pretražiti datoteku na Ubuntu-u koristeći terminal Zsh. Zsh (Z shell) je moćni i široko korišćen komandni ljus zbog svoje fleksibilnosti i naprednih funkcija.</p> </div> <div class="paragraph"> <p>Ubuntu, popularna distribucija Linuxa, nudi nekoliko alata u komandnoj liniji za pretragu fajlova. Prikažemo kako koristiti komande kao što su`find`, <code>locate</code> et `grep`за брзо и ефикасно проналажење датотека у терминалу.</p> </div> </div> </div> <div class="sect1"> <h2 id="_коришћење_команде_find">Коришћење команде `find</h2> <div class="sectionbody"> <div class="paragraph"> <p>Komanda`find`omogućuje pretragu fajlova u specificiranom direktorijumu i njego poddirektorijumima. Njegova osnovna sintaksa je sledeća:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">find [chemin] -name [nom_du_fichier]</code></pre> </div> </div> <div class="paragraph"> <p>Evo praktičnog primera u kome tražimo fajl nazvan`example.txt`u direktorijumu`/home` :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">find /home -name "example.txt"</code></pre> </div> </div> <div class="paragraph"> <p>Ova komanda će proći sve poddirektorijume od`/home`i prikaži punu putanju fajla ako se nađe.</p> </div> <div class="paragraph"> <p><strong>Онлајн упутство за команду`find`:https://man.archlinux.org/man/find.1.fr/[man find,windows=read-later]</strong></p> </div> <div class="sect2"> <h3 id="_додатни_опције_за_find">Додатни опције за `find</h3> <div class="paragraph"> <p>Наредба`find`je veoma moćna i ima brojne opcije. Evo nekoliko korisnih primera:</p> </div> <div class="ulist"> <ul> <li> <p><strong>Претрага по типу датотеке</strong>Da biste pretražili samo fajlove, koristite`-type f`, и за претрагу директоријума, koristi`-type d`. - <strong>Претрага према величини</strong>: Možete takođe filtrirati datoteke prema veličini koristeći opciju`-size`. Par exemple, pour rechercher des fichiers de plus de 100 Mo, utilisez :</p> </li> </ul> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">find /home -size +100M</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_upotreba_komande_locate">Upotreba komande `locate</h2> <div class="sectionbody"> <div class="paragraph"> <p>Komanda`locate`је брже од`find`jer koristi preindeksovanu bazu podataka datoteka prisutnih na sistemu. Prvo morate ažurirati ovu bazu podataka sledecom komandom:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo updatedb</code></pre> </div> </div> <div class="paragraph"> <p>Zatim možete da pretražujete fajl ovako:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">locate example.txt</code></pre> </div> </div> <div class="paragraph"> <p>Koristimhttps://fr.wikipedia.org/wiki/Z_Shell[zsh]sahttps://github.com/ohmyzsh/ohmyzsh/wiki[oh-my-zsh], izjavilo se da je narudžba`locate`nije dostupan od`zsh`али веома могуће од`bash`, da bi se izjednačilo to, argument`-c`команде`bash`дозволити покretaње команде`bash`из другог типа терминала.</p> </div> <div class="paragraph"> <p>ovde tražim fajlove koji se završavaju ovim motifom`001.pdf`у user directory</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">bash -c "locate ~/*001.pdf"</code></pre> </div> </div> <div class="paragraph"> <p><strong>Onlajn uputstvo komande`locate`:https://man.archlinux.org/man/locate.1.fr/[man locate,windows=read-later]</strong></p> </div> </div> </div> <div class="sect1"> <h2 id="_коришћење_команде_grep_за_претрагу_текста_у_фајловима">Коришћење команде <code>grep</code> за претрагу текста у фајловима</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ako želite da pretražujete specifični tekst unutar fajla, možete da koristite`grep`Na primer, da biste pretražili pojavljivanje reči "Ubuntu" u svim datotekama`.txt`Из текућег директоријума, користите:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">grep "Ubuntu" *.txt</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Претрага фајлова у Убунту преко Zsh терминала може да се обавља помоћу неколико моћних алата.`find`jest fleksibilan i nudi mnogo opcija, a`locate`omogućava brz pretragu pomoću prekonstruisane baze podataka. Na kraju,`grep`Omogućuje pronalaženje pojavljivanja teksta unutar datoteka.</p> </div> <div class="paragraph"> <p>Ove komande nude vam kompletan opseg alata za učiniti pretragu vaših fajlova efikasnijem i prilagođenim vašim potrebama, a svaka od ovih komandi poseduje manuel koji je vidljiv sa komandom.<code>man</code></p> </div> </div> </div> https://cheroliv.com/blog/2021/0030_memo_linux_post.html Mon, 23 Sep 2024 00:00:00 +0000 blog/2021/0030_memo_linux_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_тастатура">Тастатура :</a> <ul class="sectlevel2"> <li><a href="#_taster_ctrl"><em>taster <Ctrl></em></a></li> </ul> </li> <li><a href="#_дозволаауторизација">Дозвола(ауторизација)</a></li> <li><a href="#_претрага_фајлова">претрага фајлова</a></li> </ul> </div> <div class="sect1"> <h2 id="_тастатура">Тастатура :</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_taster_ctrl"><em>taster <Ctrl></em></h3> <table class="tableblock frame-all grid-all stretch"> </table> <div class="paragraph"> <p><a href="https://korben.info/les-raccourcis-clavier-pour-bash-terminal-linux-et-macos.html">veza</a><br> <a href="https://blogmotion.fr/systeme/astuces-bash-linux-16175">drugi link</a></p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_дозволаауторизација">Дозвола(ауторизација)</h2> <div class="sectionbody"> <div class="paragraph"> <p>CHMOD se koristi za promenu dozvola fajla.</p> </div> <div class="paragraph"> <p>ДОЗВОЛА КОМАНДА</p> </div> <div class="paragraph"> <p>U G W rwx rwx rwx chmod 777 naziv datoteke rwx rwx r-x chmod 775 filename rwx r-x r-x chmod 755 filename rw- rw- r-- chmod 664 filename rw- r-- r-- chmod 644 filename</p> </div> <div class="paragraph"> <p>U = Korisnik G = Grupa W = Свет</p> </div> <div class="paragraph"> <p>r = Читљив w = zapisivo x = izvršni - = nema dozvole</p> </div> <div class="paragraph"> <p>Други начин да погледате дозволе:</p> </div> <div class="paragraph"> <p>400 читао од власника 040 pročitan od strane grupe 004 pročitan od bilo ko (drugo) 200 napisao vlasnik 020 napisan od grupa 002 написано от любог ко 100 izvršiti od vlasnika 010 izvrši po gruppi 001 може да се изврши било ко</p> </div> <div class="paragraph"> <p>Da biste dobili kombinaciju, dovoljno je da ih saberete.<br> Na primer, da se čita, piše, izvršava od strane vlasnika,<br> pročitan, izvršen, od grupe i izvršen od bilo koga,<br> dodali biste 400+200+100+040+010+001 da bi dali 751.<br></p> </div> </div> </div> <div class="sect1"> <h2 id="_претрага_фајлова"><a href="/blog/2024/0074_seach_file_linux_post.html">претрага фајлова</a></h2> <div class="sectionbody"> </div> </div> https://cheroliv.com/blog/2024/0072_Exposer_un_port_linux_subsystem_post.adoc.html Thu, 1 Feb 2024 00:00:00 +0000 blog/2024/0072_Exposer_un_port_linux_subsystem_post.adoc.html https://cheroliv.com/blog/2024/0070_installer_pandoc_post.html Tue, 30 Jan 2024 00:00:00 +0000 blog/2024/0070_installer_pandoc_post.html <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title"><em>Време за читање : 3 мин</em> Pandoc je univerzalan konvertor dokumenata</div> <p>Pandoc je otvoreni izvorni program za obradu teksta koji se može koristiti za konvertovanje dokumenata između različitih formata. Postoji několik načina instalacije Pandoca.</p> </div> </div> </div> <div class="sect1"> <h2 id="_инсталација_са_странице_за_преузимање">Инсталација са странице за преузимање</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da biste instalirali Pandoc sa stranice za preuzimanje, uradite sledeće:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Приступите страни за преузимање Pandoc:https://pandoc.org/installing.html/[<a href="https://pandoc.org/installing.html" class="bare">https://pandoc.org/installing.html</a>]</p> </li> <li> <p>Preuzmite instalator paketa za vaš operativni sistem.</p> </li> <li> <p>Pokrenite instalacioni program da instalirate Pandoc.</p> </li> </ol> </div> <div class="paragraph"> <p><strong>Instalacija iz datoteke zip</strong></p> </div> <div class="paragraph"> <p>Da instalirate Pandoc iz ZIP fajla, uradite sledeće :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Preuzmite zip fajl koji sadrži Pandoc binarne datoteke i dokumentaciju.</p> </li> <li> <p>Razapakovite zip fajl.</p> </li> <li> <p>Premestite binarne datoteke u direktorijum po vašem izboru.</p> </li> </ol> </div> <div class="paragraph"> <p><strong>Instalacija pomoću Chocolatey</strong></p> </div> <div class="paragraph"> <p>Da biste instalirali Pandoc pomoću Chocolatey-ja, sledite ove korake :</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Отворите командну линију.</p> </li> <li> <p>Izvršite sledeću komandu:</p> </li> </ol> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-powershell hljs" data-lang="powershell">choco install pandoc</code></pre> </div> </div> <div class="paragraph"> <p><strong>Instalacija pomoću winget</strong></p> </div> <div class="paragraph"> <p>Da biste instalirali Pandoc koristeći winget, izvršite sledeće korake:</p> </div> <div class="olist arabic"> <ol class="arabic"> <li> <p>Otvori komandni prompt.</p> </li> <li> <p>Izvršite sledeću komandu :</p> </li> </ol> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-powershell hljs" data-lang="powershell">winget install --source winget --exact --id JohnMacFarlane.Pandoc</code></pre> </div> </div> <div class="paragraph"> <p><strong>Preporuke</strong></p> </div> <div class="paragraph"> <p>Podrazumevano, Pandoc kreira PDF‑ove koristeći LaTeX. Preporučljivo je instalirati LaTeX pomoću MiKTeX. Sa opcijom`--pdf-engine`, можете међутим да наведете друге програме за овај задатак.</p> </div> <div class="paragraph"> <p><strong>Опомена</strong></p> </div> <div class="paragraph"> <p>Korišćenje više metoda instalacije može dovesti dvije različite instalacije Pandoca. Preporučuje se ispravno deinstalirati Pandoc pre prelaska na alternativnu metodu instalacije.</p> </div> <div class="paragraph"> <p><strong>Instalacija na linuxu preko WSL</strong></p> </div> <div class="paragraph"> <p>Проверите да ли верзија pandoc у вашем управљачу пакетима није застарела. Pandoc se nalazi u repozitorijumima Debian, Ubuntu, Slackware, Arch, Fedora, NixOS, openSUSE, gentoo i Void.</p> </div> <div class="paragraph"> <p>Da biste dobili najnoviju verziju, ponudili smo binarni paket za amd64 arhitekturu na stranici za preuzimanje.</p> </div> <div class="paragraph"> <p>Izvršni fajl je statički povezan i nema dinamičkih zavisnosti ni zavisnosti na spoljnim datotekama podataka. Napomena: zbog statičkog veza, pandoc binar ovog paketa ne može da koristi Lua filtere koji zahtevaju spoljašnje Lua module napisane u C.</p> </div> <div class="paragraph"> <p>Достављен је тарбол и инсталлер deb. Za instalaciju deb paketa:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo dpkg -i $DEB</code></pre> </div> </div> <div class="paragraph"> <p>Primer u trenutku pisanja :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">wget https://github.com/jgm/pandoc/releases/download/3.1.11.1/pandoc-3.1.11.1-1-amd64.deb</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">sudo dpkg -i pandoc-3.1.11.1-1-amd64.deb</code></pre> </div> </div> <div class="paragraph"> <p>où `$DEB`је путања до преузетег .deb пакета Ovo će instalirati izvršni fajl`pandoc`и страна са упутством.</p> </div> <div class="paragraph"> <p>Ako koristite distribuciju baziranu na RPM, možda ćete moći da instalirate .deb paket sa našeg preuzimanja pomoću alijena.</p> </div> <div class="paragraph"> <p>Na bilo kojoj distribuciji, możete da instalirate iz tarballa u`$DEST`(на primer,<code>/usr/local/</code> ou <code>$HOME/.local</code>) pri čemu:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">tar xvzf $TGZ --strip-components 1 -C $DEST</code></pre> </div> </div> <div class="paragraph"> <p>où `$TGZ`је путања до преузетог zip tarball-a. Za verzije Pandoc starije od 2.0 koje ne nude tarball, probajte umesto toga:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">ar p $DEB data.tar.gz | tar xvz --strip-components 2 -C $DEST</code></pre> </div> </div> <div class="paragraph"> <p>Vi mozete tako instalirati iz izvora, koristeći uputstva ispod ispod.<code>Compilation à partir de la source</code>. Napomena: većina distribucija ima Haskell platformu u svojim paketskim repozitorijumima. Na primer, na Debian/Ubuntu, možete ga instalirati sa</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">apt-get install haskell-platform</code></pre> </div> </div> <div class="paragraph"> <p>Podrazumevano, Pandoc kreira PDF datoteke pomoću LaTeX-a. Preporučujemo da instalirate TeX Live putem vašeg menadžera paketa. (Na Debian/Ubuntu,<code>apt-get install texlive</code>). Sa opcijom`--pdf-engine`, međutim можете да наведете друге програме за ову задачу.</p> </div> </div> </div> https://cheroliv.com/blog/2023/0069_triple_python_js_ts_post.html Mon, 25 Dec 2023 00:00:00 +0000 blog/2023/0069_triple_python_js_ts_post.html <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <div class="title"><em>Vreme čitanja : 2 min</em> Направити пуну имплементацију класе kotlin.Triple у JavaScript-u, TypeScript-у и Питону коришћењем функционалног програмирања.</div> <p><strong>Napomena :</strong>Tipovi`Maybe`, <code>Either</code>, `Result`Ne spadaju u osnovni jezik JavaScript ili TypeScript, zato ih moramo sami implementirati.</p> </div> </div> </div> <div class="sect1"> <h2 id="_javascript">JavaScript</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">//javascript // Maybe type const Maybe = (value) => ({ map: (fn) => (value !== null && value !== undefined ? Maybe(fn(value)) : Maybe(null)), flatMap: (fn) => (value !== null && value !== undefined ? fn(value) : Maybe(null)), getOrElse: (defaultValue) => (value !== null && value !== undefined ? value : defaultValue), }); // Either type const Either = { Left: (value) => ({ map: (fn) => Either.Left(value), flatMap: (fn) => Either.Left(value), getOrElse: (defaultValue) => defaultValue, isLeft: true, isRight: false, }), Right: (value) => ({ map: (fn) => Either.Right(fn(value)), flatMap: (fn) => fn(value), getOrElse: (defaultValue) => value, isLeft: false, isRight: true, }), }; // Triple class class Triple { constructor(a, b, c) { this.a = a; this.b = b; this.c = c; } map(fn) { return new Triple(fn(this.a), fn(this.b), fn(this.c)); } static of(a, b, c) { return new Triple(a, b, c); } // Example method using Maybe and Either divideBy(other) { return Maybe(this.b) .flatMap((numerator) => Maybe(other) .flatMap((denominator) => denominator !== 0 ? Either.Right(numerator / denominator) : Either.Left('Division by zero') ) ) .getOrElse(Either.Left('Invalid input')); } } // Example usage const triple = Triple.of(1, 2, 3); const result = triple.map((x) => x * 2); console.log(result); // Triple { a: 2, b: 4, c: 6 } const divisionResult = triple.divideBy(2); console.log(divisionResult); // Either.Right { value: 1 } const invalidDivisionResult = triple.divideBy(0); console.log(invalidDivisionResult); // Either.Left { value: 'Division by zero' }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_typescript">TypeScript</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-typescript hljs" data-lang="typescript">//Typescript // Maybe type // noinspection JSAnnotator type Maybe<T> = { map<U>(fn: (value: T) => U): Maybe<U>; flatMap<U>(fn: (value: T) => Maybe<U>): Maybe<U>; getOrElse(defaultValue: T): T; }; const just = <T>(value: T): Maybe<T> => ({ map: <U>(fn: (value: T) => U) => just(fn(value)), flatMap: <U>(fn: (value: T) => Maybe<U>) => fn(value), getOrElse: (_: T) => value, }); const nothing = <T>(): Maybe<T> => ({ map: <U>(_: (value: T) => U) => nothing<U>(), flatMap: <U>(_: (value: T) => Maybe<U>) => nothing<U>(), getOrElse: (defaultValue: T) => defaultValue, }); // Either type type Either<L, R> = { map<U>(fn: (value: R) => U): Either<L, U>; flatMap<U>(fn: (value: R) => Either<L, U>): Either<L, U>; getOrElse(defaultValue: R): R; isLeft: boolean; isRight: boolean; }; const left = <L, R>(value: L): Either<L, R> => ({ map: <U>(_: (value: R) => U) => left<L, U>(value), flatMap: <U>(_: (value: R) => Either<L, U>) => left<L, U>(value), getOrElse: (defaultValue: R) => defaultValue, isLeft: true, isRight: false, }); const right = <L, R>(value: R): Either<L, R> => ({ map: <U>(fn: (value: R) => U) => right<L, U>(fn(value)), flatMap: <U>(fn: (value: R) => Either<L, U>) => fn(value), getOrElse: (_: R) => value, isLeft: false, isRight: true, }); // Triple class class Triple<T> { constructor(public a: T, public b: T, public c: T) {} map<U>(fn: (value: T) => U): Triple<U> { return new Triple<U>(fn(this.a), fn(this.b), fn(this.c)); } static of<T>(a: T, b: T, c: T): Triple<T> { return new Triple<T>(a, b, c); } // Example method using Maybe and Either divideBy(other: T): Either<string, number> { return just(this.b) .flatMap((numerator) => just(other) .flatMap((denominator) => denominator !== 0 ? right(numerator / denominator) : left('Division by zero') ) ) .getOrElse(left('Invalid input')); } } // Example usage const triple = Triple.of(1, 2, 3); const result = triple.map((x) => x * 2); console.log(result); // Triple { a: 2, b: 4, c: 6 } const divisionResult = triple.divideBy(2); console.log(divisionResult); // Either.Right { value: 1 } const invalidDivisionResult = triple.divideBy(0); console.log(invalidDivisionResult); // Either.Left { value: 'Division by zero' }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_python_pydantic_pymonad">Python, pydantic, pymonad</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da kreiramo implementaciju u Pythonu koristeći`pydantic`za proveru tipova i`pymonad`за монаде:</p> </div> <div class="listingblock"> <div class="title">Instaluj zavise :</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">pip install pydantic pymonad</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-python hljs" data-lang="python">from pymonad.either import Either, Left, Right from pydantic import BaseModel, ValidationError, validator # Définition de la classe Triple avec Pydantic class Triple(BaseModel): a: int b: int c: int @validator('b') def validate_b(cls, b, values): if b == 0: raise ValueError('Division by zero is not allowed') return b # Méthode utilisant Either pour la gestion des erreurs def divide_by(self, other): def division(numerator, denominator): return Right(numerator / denominator) def handle_error(error): return Left(str(error)) return Either(lambda: division(self.b, other)).or_else(handle_error) # Exemple d'utilisation try: triple = Triple(a=1, b=2, c=3) result = triple.divide_by(2) if result.is_right: print(f'Division result: {result.value}') else: print(f'Error: {result.value}') except ValidationError as e: print(f'Validation Error: {e}') except Exception as e: print(f'An unexpected error occurred: {e}')</code></pre> </div> </div> <div class="ulist"> <div class="title">U ovom primjeru :</div> <ul> <li> <p><code>pydantic`да definiše класу`Triple`sa tipovanim poljima. - Metoda`divide_by`koristi monadu`Either</code> de `pymonad`za rukovanje potencijalnim greškama koje nastaju zbog deljenja nulom. - Персонализована валидација за осигурање да је вредност`b`nije jednako nuli. Ako je jednako nuli, baca se izuzetak, i`pymonad`ухвати ову изузетак да би вратио резултат`Left`казајујући грешку.</p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2023/0068_introduction_google_apps_script_post.html Fri, 22 Dec 2023 00:00:00 +0000 blog/2023/0068_introduction_google_apps_script_post.html <div class="sect1"> <h2 id="_sadržaj">Sadržaj</h2> <div class="sectionbody"> <div class="paragraph"> <p><em>vreme čitanja : 30 min</em></p> </div> <div class="ulist"> <ul> <li> <p><a href="#Uvod">[Uvod]</a></p> </li> <li> <p>Основна структура u Google Apps Script</p> </li> <li> <p><a href="#Tipovi i varijable u Google Apps Script">[Tipovi i varijable u Google Apps Script]</a></p> </li> <li> <p><a href="#Konstante">promenljive i slova u Google Apps Script</a></p> </li> <li> <p>Operacije i operatori u Google Apps Script</p> </li> <li> <p><a href="#Var">Let i Const u Google Apps Script</a></p> </li> <li> <p><a href="#Strukture kontrole u Google Apps Script">[Strukture kontrole u Google Apps Script]</a></p> </li> <li> <p><a href="#_petlje_u_google_apps_script">Petlje u Google Apps Script</a></p> </li> <li> <p><a href="#_objekti_u_google_apps_script">Objekti u Google Apps Script</a></p> </li> <li> <p>Funkcije u Google Apps Script</p> </li> <li> <p><a href="#_podešavanja_i_opsezi_u_google_apps_script">Podešavanja i opsezi u Google Apps Script</a></p> </li> <li> <p><a href="#Оператори реста и спреда у Google Apps Script">[Оператори реста и спреда у Google Apps Script]</a></p> </li> <li> <p>Dodela po dekompoziciji u Google Apps Script</p> </li> <li> <p><a href="#_kolekcije_i_deklarativno_programiranje_u_google_apps_script">Kolekcije i deklarativno programiranje u Google Apps Script</a></p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_увод">Увод</h2> <div class="sectionbody"> <div class="paragraph"> <p>Google Apps Script (GAS) je platforma za razvoj skriptova povezana s raznim Google uslugama kao što su Google Sheets, Google Docs i Google Forms. Omogućava automatizaciju zadataka, dodavanje prilagođenih funkcionalnosti i integraciju Google usluga.</p> </div> <div class="paragraph"> <p>U ovom memo-u, ćemo istražiti glavne koncepte Google Apps Scripta temeljajući se na konkretnim primerima. Razgovaraćemo o pojmovima kao što su varijable, petlje, funkcije i još mnogo toga, prilagođavajući ih specifičnom kontekstu GAS.</p> </div> </div> </div> <div class="sect1"> <h2 id="_osnovna_struktura_u_google_apps_script">Osnovna struktura u Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bismo počeli, pogledajmo osnovnu strukturu skripta Google Apps.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Structure de base en Google Apps Script */ function exempleStructureGAS() { // Votre code ici Logger.log("Hello, Google Apps Script!"); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_tipovi_i_promenljive_u_google_apps_script">Tipovi i promenljive u Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Google Apps Script koristi JavaScript kao programski jezik. Tipovi podataka i varijable funkcionišu na sličan način kao standardni JavaScript.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Types et Variables en Google Apps Script */ function exempleTypesVariablesGAS() { // Votre code ici var nombre = 42; var texte = "Bonjour, Google Apps Script!"; Logger.log(nombre); Logger.log(texte); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_operacije_i_operatori_u_google_apps_script">Operacije i operatori u Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Operacije i operatori u Google Apps Script-u su isti kao u JavaScript-u.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Opérations et Opérateurs en Google Apps Script */ function exempleOperationsGAS() { // Votre code ici var x = 10; var y = 5; var resultat = x + y; Logger.log(resultat); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_var_let_i_const_u_google_apps_script">Var, Let i Const u Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>U GAS, koncepti`var`, <code>let</code>, et `const`Користе се за деклаrisaње променљивих. Међутим, јесуће важно разумети њихове разлике и њихове последствия.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Var, Let et Const en Google Apps Script */ function exempleVarLetConstGAS() { // Votre code ici // Utilisation de var var x = 10; if (true) { var x = 20; // La variable x est modifiée globalement } Logger.log(x); // Utilisation de let let y = 30; if (true) { let y = 40; // La variable y est limitée au bloc if } Logger.log(y); // Utilisation de const const z = 50; // z = 60; // Impossible de réassigner une constante Logger.log(z); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_структуре_контрола_у_google_apps_script">Структуре контрола у Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Контролне структуре као што`if`, <code>else</code>, <code>while</code> et `for`se koriste za upravljanje tokoma izvršenja u Google Apps Script.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Structures de Contrôle en Google Apps Script */ function exempleStructuresControleGAS() { // Votre code ici var condition = true; if (condition) { Logger.log("La condition est vraie."); } else { Logger.log("La condition est fausse."); } var compteur = 0; while (compteur < 5) { Logger.log(compteur); compteur++; } for (var i = 0; i < 3; i++) { Logger.log(i); } }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_podešavanja_i_opsezi_u_google_apps_script">Podešavanja i opsezi u Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Parametri i opsezi igraju važnu ulogu u razvoju skripti u GAS-u. Razumite kako oni funkcionišu da izbegnete neočekivano ponašanje.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Paramètres et Scopes en Google Apps Script */ function exempleParametresScopesGAS(parametre) { // Votre code ici var variableGlobale = "Je suis global"; function afficherParametre() { Logger.log(parametre); } afficherParametre(); Logger.log(variableGlobale); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konstante_promenljive_i_slova_u_google_apps_script">Konstante, Promenljive i Slova u Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Razumeti razlikemeđu`const`, <code>var</code>, et `let`je bitno za efikasno korišćenje promenljivih u Google Apps Script.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Constantes, Variables, et Lettres en Google Apps Script */ function exempleConstantesVariablesLettresGAS() { // Votre code ici const constante = "Je ne change pas"; Logger.log(constante); var variable = "Je peux changer"; Logger.log(variable); let lettre = "Je peux aussi changer, mais seulement dans mon bloc"; Logger.log(lettre); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_petlje_u_google_apps_script">Petlje u Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Petlje, kao što su`for` et <code>while</code>, suvažne su za iteriranje kroz elemente i izvršavanje ponavljajućih operacija.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Boucles en Google Apps Script */ function exempleBouclesGAS() { // Votre code ici for (var i = 0; i < 3; i++) { Logger.log(i); } var condition = true; var compteur = 0; while (condition) { Logger.log("Tour de boucle"); compteur++; if (compteur === 3) { condition = false; } } }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_objekti_u_google_apps_script">Objekti u Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Objekti se koriste za strukturiranje podataka. U GAS-u, mnogi ugrađeni objekti olakšavaju interakciju sa Google uslugama.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Objets en Google Apps Script */ function exempleObjetsGAS() { // Votre code ici var feuille = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet(); var cellule = feuille.getRange("A1"); cellule.setValue("Nouvelle valeur"); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_konstante_promenljive_i_slova_u_google_apps_script_2">Konstante, promenljive i slova u Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Razumevanje razlike između`const`, <code>var</code>, et `let`Важно је за ефикасну употребу променљивих у Google Apps Script.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Constantes, Variables, et Lettres en Google Apps Script */ function exempleConstantesVariablesLettresGAS() { // Votre code ici const constante = "Je ne change pas"; Logger.log(constante); var variable = "Je peux changer"; Logger.log(variable); let lettre = "Je peux aussi changer, mais seulement dans mon bloc"; Logger.log(lettre); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_функције_у_google_apps_script">Функције у Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Funkcije su osnovni elementi u programiranju. U GAS-u, one mogu biti deklarisane i pozivane na različite načine.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Fonctions en Google Apps Script */ function exempleFonctionsGAS() { // Votre code ici function additionner(a, b) { return a + b; } var resultat = additionner(2, 3); Logger.log(resultat); // Fonction anonyme var multiplier = function (x, y) { return x * y; }; Logger.log(multiplier(4, 5)); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_оператори_остатка_и_ширења_у_google_apps_script">Оператори остатка и ширења у Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Operatori u odmor (")<code>…​</code>) i propagacije (<code>…​</code>) su korisni za manipulaciju nizovima i objektima na koncizan način.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Opérateurs de Repos et de Propagation en Google Apps Script */ function exempleOperateursReposPropagationGAS() { // Votre code ici // Opérateur de repos (...) pour les tableaux var nombres = [1, 2, 3, 4, 5]; var [...copieNombres] = nombres; Logger.log(copieNombres); // Opérateur de propagation (...) pour les objets var objOriginal = { x: 1, y: 2 }; var objClone = { ...objOriginal, z: 3 }; Logger.log(objClone); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_додела_преко_декомпозиције_у_google_apps_script">Додела преко декомпозиције у Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Dodela destrukturisanjem je snažna funkcionalnost koja omogućava izvuđanje vrednosti iz objekata i nizova na sažetan način.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Affectation par Décomposition en Google Apps Script */ function exempleAffectationDecompositionGAS() { // Votre code ici var coordonnees = [3, 4]; var [x, y] = coordonnees; Logger.log(x); Logger.log(y); var utilisateur = { nom: "John", age: 30 }; var { nom, age } = utilisateur; Logger.log(nom); Logger.log(age); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_kolekcije_i_deklarativno_programiranje_u_google_apps_script">Kolekcije i deklarativno programiranje u Google Apps Script</h2> <div class="sectionbody"> <div class="paragraph"> <p>Google Apps Script podržava strukture podataka kao što su nizovi, i koncepte funkcionalnog programiranja i deklarativne iteracije (><impérative), kao što su`map`, <code>reduce</code> et <code>forEach</code>.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Collections et Programmation Déclarative en Google Apps Script */ function exempleCollectionsFonctionnelleGAS() { // Votre code ici // Exemple de tableau (collection) var nombres = [1, 2, 3, 4, 5]; // Utilisation de forEach nombres.forEach(function (nombre) { Logger.log(nombre); }); // Utilisation de map var carresNombres = nombres.map(function (nombre) { return nombre * nombre; }); Logger.log(carresNombres); // Utilisation de reduce var somme = nombres.reduce(function (acc, nombre) { return acc + nombre; }, 0); Logger.log(somme); }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_zaključak">Zaključak</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ovaj memo je pokrio osnovne koncepte Google Apps Script ilustrujući ih konkretnim primerom koda. Koristite ove znanje da automatizujete vaše dnevne zadatke, prilagodite vaše dokumente i iskoristite sve funkcionalnosti Google Apps Script.</p> </div> </div> </div> https://cheroliv.com/blog/2023/0067_formation_express_sur_google_forms_script_post.html Wed, 20 Dec 2023 00:00:00 +0000 blog/2023/0067_formation_express_sur_google_forms_script_post.html <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <p>Trajanje: 30 minuta</p> </div> </div> </div> <div class="sect1"> <h2 id="_ciljevi">Ciljevi</h2> <div class="sectionbody"> <div class="paragraph"> <p>Разумети основе Google Apps Script у Forms - Naučiti da pristupite editoru skripte i izvršite instrukciju na pokretaču</p> </div> </div> </div> <div class="sect1"> <h2 id="_откладање">откладање</h2> <div class="sectionbody"> <div class="olist arabic"> <ol class="arabic"> <li> <p><strong>Увод у Google Form Script</strong>(5 мин)</p> <div class="ulist"> <ul> <li> <p>Kratki pregled skripte Google Form Претстављање основних функција</p> </li> </ul> </div> </li> <li> <p><strong>Kreiranje Google obrasca i povezane skripte</strong>(5 мин)</p> <div class="ulist"> <ul> <li> <p>Креирање једноставног obrasца са Google Forms - Uvod u povezan skriptni editor</p> </li> </ul> </div> </li> <li> <p><strong>Izvršiti instrukciju</strong>(10 min)</p> <div class="ulist"> <ul> <li> <p>Podešavanje triggera 'on start' - Konfiguracija trigera "on submit - Izrada skripta za izvršenje instrukcije - Brzi testovi za proveru pravilnog funkcionisanja u dnevniku</p> </li> </ul> </div> </li> <li> <p><strong>Analiza rezultata i dobrih praksi</strong>(10 мин)</p> <div class="ulist"> <ul> <li> <p>Verifikacija rezultata izvršenja jedne instrukcije - Diskusija o primeru skripte i kako automatizacija može uštedeti vreme</p> </li> </ul> </div> </li> </ol> </div> </div> </div> <div class="sect1"> <h2 id="_preduvjet">Preduvjet</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Имати гугл налог и приступ Google Forms и Google Sheets</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_матијерал">матијерал</h2> <div class="sectionbody"> <div class="ulist"> <ul> <li> <p>Računar sa web pretraživačem i internet konekcijom</p> </li> </ul> </div> </div> </div> <div class="sect1"> <h2 id="_napomena">Napomena</h2> <div class="sectionbody"> <div class="paragraph"> <p>Ova brza obuka nudi brz uvod u automatizaciju sa Google Form Script. Za dublje razumevanje preporučuju se duže obuke.</p> </div> </div> </div> <div class="sect1"> <h2 id="_1_увод_у_google_form_скрипт">1 - Увод у Google Form скрипт</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_слайд_1_кратки_преглед_скрипта_google_form">Слайд 1: Кратки преглед скрипта Google Form</h3> <div class="ulist"> <ul> <li> <p>Google Form Script je platforma za skriptovanje integrisana u Google Forms. - Омогућава додавање прилагођених функција и аутоматизацију задатака.</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_слайд_2_приказ_основних_функција">Слайд 2: Приказ основних функција</h3> <div class="ulist"> <ul> <li> <p>Urednik skripte: Ugrađeni urednik skripte za pisanje skripti Google Apps Script. - Pokretači: Dogadjaji kao što je "on submit" koji aktivizuju izvršenje skriptova.</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_slide_3_предности_коришћења_google_form_скрипта">Slide 3: Предности коришћења Google Form скрипта</h3> <div class="paragraph"> <p>Personalizacija: Kreirajte prilagoobljene obrasce sa jedinstvenim funkcionalnostima. - Automatizacija : Automatizujte akcije u odgovor na obraske odgovore. - Integracija: Integrirajte skripte sa drugim Google uslugama za bolje iskustvo.</p> </div> </div> <div class="sect2"> <h3 id="_бележка_за_презентер">Бележка за презентер:</h3> <div class="paragraph"> <p>Ove funkcije nude značajan potencijal za prilagođavanje i automatizaciju obrazaca. Sledeći deo ove obuke će detaljnije razmotriti kreiranje skriptova i specifičnih automatizacija.</p> </div> <div class="paragraph"> <p><a href="https://developers.google.com/apps-script/add-ons/editors/forms?hl=fr" class="bare">https://developers.google.com/apps-script/add-ons/editors/forms?hl=fr</a></p> </div> <div class="paragraph"> <p><a href="https://developers.google.com/apps-script/reference/forms?hl=sr" class="bare">https://developers.google.com/apps-script/reference/forms?hl=sr</a></p> </div> <div class="paragraph"> <p><a href="https://developers.google.com/apps-script/reference/forms/form-app?hl=fr" class="bare">https://developers.google.com/apps-script/reference/forms/form-app?hl=fr</a></p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_kreiranje_google_obrasca_i_povezane_skripte_5_min">Kreiranje Google obrasca i povezane skripte (5 min)</h2> <div class="sectionbody"> </div> </div> https://cheroliv.com/blog/2023/0066_memo_python_post.html Sun, 19 Nov 2023 00:00:00 +0000 blog/2023/0066_memo_python_post.html <div class="sect1"> <h2 id="_instaliraj_python_na_windows">Instaliraj python na Windows</h2> <div class="sectionbody"> <div class="paragraph"> <p><a href="https://ninite.com/pythonx3/">python na windows</a></p> </div> <div class="paragraph"> <p><a href="https://python-docs.readthedocs.io/en/latest/starting/install3/win.html" class="bare">https://python-docs.readthedocs.io/en/latest/starting/install3/win.html</a></p> </div> <div class="paragraph"> <p><a href="https://python-docs.readthedocs.io/en/latest/dev/virtualenvs.html#virtualenvironments-ref" class="bare">https://python-docs.readthedocs.io/en/latest/dev/virtualenvs.html#virtualenvironments-ref</a></p> </div> </div> </div> <div class="sect1"> <h2 id="_pokretanje_pythona">Pokretanje Pythona</h2> <div class="sectionbody"> <div class="listingblock"> <div class="title">Референца :</div> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">cd mon_projet python -m venv mon_venv source mon_venv/bin/activate # Sur windows mon_venv\Scripts\activate deactivate</code></pre> </div> </div> <div class="sect2"> <h3 id="_zahtjev_za_instalaciju">zahtjev za instalaciju</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">pip install -r requirements.txt</code></pre> </div> </div> </div> </div> </div> <div class="sect1"> <h2 id="_inicijacija">inicijacija</h2> <div class="sectionbody"> <div class="paragraph"> <p><a href="https://python.doctor/page-apprendre-programmation-orientee-objet-poo-classes-python-cours-debutants">python OOP</a></p> </div> </div> </div> <div class="sect1"> <h2 id="_gof_dizajn_obrasci_u_pythonu">GoF dizajn obrasci u Pythonu</h2> <div class="sectionbody"> <div class="paragraph"> <p><a href="https://github.com/whikwon/python-patterns/">implementacija 1</a></p> </div> <div class="paragraph"> <p><a href="https://github.com/Sean-Bradley/Design-Patterns-In-Python">implementacija 2</a></p> </div> <div class="paragraph"> <p><a href="https://sbcode.net/python/">kompletna knjiga</a></p> </div> <div class="paragraph"> <p>Dizajnerski obraci GoF predstavljaju skup od 23 dizajnerskih obrasaka koji su opisani u knjizi "Design Patterns: Elements of Reusable Object-Oriented Software".</p> </div> <table class="tableblock frame-all grid-all stretch"> <caption class="title">Table 1. Ovo je spisak GoF dizajn paterni</caption> <colgroup> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0833%;"> <col style="width: 2.0849%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Ime</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Opis</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Metoda factory</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Kreiraj objekte bez specificiranja tačne klase koja se instancira</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Apstraktna fabrika</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Kreira porodice povezanih ili zavisnih objekata bez specificiranja njihove konkretne klase.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Builder</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Odvoji konstrukciju kompleksnog objekta od njegove predstave da isti proces konstrukcije može da kreira različite predstave.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>prototip</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Kreirajte novi objekte kopirajući postojeći prototip.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Jedinstveni</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ograničava instanciranje klase na samo jedan objekat.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Адаптер</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Konvertuje interfejs klase u drugi interfejs kojeg klijent očekuje.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>most</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Odvoji apstraktni koncept od njegove implementacije kako bi oba mogli da se menjaju nezavisno.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>kompozitni</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Sastavite objekte u strukture stabala da predstavljate hijerarhije dela i celog.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>dekorator</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Dinamički priloži dodatne odgovornosti objektu.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Fasada</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Pruža jedinstveni interfejs skupu interfejsa u pot-sistemu.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>muva</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Smanjuje troškove kreiranja i korišćenja lagalih objekata.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>прокси</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Pruža zamenu ili rezervisano mesto za drugi objekat da bi se kontrolisao pristup njemu.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Lanac odgovornosti</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Omogućava više objekata da obrađuju zahtev</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Команда</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Uključi zahtev u objekat, omogućavajući tome da se klijenti podešavaju sa različitim zahtevima, redovima čekanja ili dnevnikom, i da se podržavaju ponišljive operacije.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>преводилац</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Дай представу граматике језика и употреби је за тлумачење реченица на том језику.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Iterator</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Omogućava sekvencijalno prolazanje kroz elemenте agregovanog objekта bez izlaganja njegove osnovne reprezentacije.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Medijator</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Omogućava smanjenje kompleksnih zavisnosti između objekata činom što ih čini da komuniciraju samo putem objekta-medijatora.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Подсетник</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Пружа способност да врати објекат у његово претходно стање (без нарушавања енкапсулације).</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Posmatrač</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Definiše jednovisezavisnost između objekata tako da kada jedan objekat promeni stanje, svi njegovi zavisnici automatski se obaveštavaju i ažuriraju.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Država</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Omogućava objektu da menja ponašanje kada se menja njegovo unutrašnje stanje.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>стратегија</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Definiše porodicu algoritama, enkapsulira svaki od njih i čini ih zamenskim.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Metoda predloška</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Definiše skelet algoritma u metodi, odlažući neke korake podklasama.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>posetioc</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Omogućava definisanje nove operacije za izvršavanje nad strukturom objekata bez promena klasa objekata na kojoj ona radi.</p></td> </tr> </tbody> </table> </div> </div> <div class="sect1"> <h2 id="_funkcionalno_programiranje">funkcionalno programiranje</h2> <div class="sectionbody"> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 16.6666%;"> <col style="width: 27.7777%;"> <col style="width: 55.5557%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Библиотека</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">URL</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Opis</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">PyMonad</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><a href="https://github.com/jasondelaat/pymonad" class="bare">https://github.com/jasondelaat/pymonad</a></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">PyMonad je implementacija monadskih struktura podataka u Pythonu bazirana na programskim jezicima kao što su Haskell i F# sa implementacijama za najčešće korištene tipove monada u funkcionalnom programiranju.https://www.miguelfarrajota.com/2021/06/monads-in-python-with-pymonad/[članak]</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">PyFunctional</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><a href="https://github.com/EntilZha/PyFunctional/" class="bare">https://github.com/EntilZha/PyFunctional/</a></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">PyFunctional je Python biblioteka za funkcionalno programiranje koja pruža alate za rad sa čistim funkcijama i iterabilnim.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Toolz</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><a href="https://toolz.readthedocs.io/en/latest/" class="bare">https://toolz.readthedocs.io/en/latest/</a></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Toolz je Python biblioteka za funkcionalno programiranje koja pruža alate za rad sa čistim funkcijama i iterabilima.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Fn.py</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><a href="https://github.com/kachayev/fn.py" class="bare">https://github.com/kachayev/fn.py</a></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Fn.py je Python biblioteka za funkcionalno programiranje koja pruža alate za rad s čistim funkcijama i iterabilnim objektima.</p></td> </tr> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">Kokos</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><a href="https://coconut-lang.org/" class="bare">https://coconut-lang.org/</a></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Coconut dodaje nekoliko funkcionalnosti Pythonu za funkcionalno programiranje, uključujući i podudaranje po uzorku.https://stackoverflow.com/questions/11909681/are-there-pattern-matching-functions-in-python-like-this[razgovor sof]</p></td> </tr> </tbody> </table> <div class="sect2"> <h3 id="_супштачни_эффекти">супштачни эффекти</h3> </div> <div class="sect2"> <h3 id="_petlje">petlje</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-python hljs" data-lang="python"># impérative way result = [] for i in inputs: x = f(g(i)) result.append(x) # idiomatic way result = map(comp(f,g), inputs)</code></pre> </div> </div> </div> </div> </div> https://cheroliv.com/blog/2023/0065_training_web_dev_post.html Thu, 24 Aug 2023 00:00:00 +0000 blog/2023/0065_training_web_dev_post.html https://cheroliv.com/blog/2023/0064_training_trading_card_games_post.html Mon, 21 Aug 2023 00:00:00 +0000 blog/2023/0064_training_trading_card_games_post.html https://cheroliv.com/blog/2023/0063_memo_ts_post.html Sat, 19 Aug 2023 00:00:00 +0000 blog/2023/0063_memo_ts_post.html <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <p>github репозиторијум:https://github.com/cheroliv/ts-codebase[ts-codebase, window="_blank]</p> </div> </div> </div> <div class="sect1"> <h2 id="toc_ts"><span class="underline">Увод TypeScript</span></h2> <div class="sectionbody"> <div class="olist arabic"> <ol class="arabic"> <li> <p><a href="#ts_types">Tipovi u TypeScript</a></p> </li> <li> <p><a href="#функcije">[функcije]</a></p> </li> <li> <p><a href="#data_struct">Struktura podataka</a></p> </li> <li> <p><a href="#enums_tuples">Enum i tuple</a></p> </li> <li> <p><a href="#void_never">Void i Never</a> is not French text, so there is no content to translate. The input is empty, resulting in an empty translation. Output nothing.</p> </li> <li> <p><a href="#class_interface">Klase i interfejsi</a></p> </li> <li> <p><a href="#tsconfig">Datoteka tsconfig.json</a></p> </li> <li> <p><a href="#modules">Moduli</a></p> </li> <li> <p><a href="#obećanja">[obećanja]</a></p> </li> <li> <p><a href="#async-await">async/await</a></p> </li> <li> <p><a href="#генерици">[генерици]</a></p> </li> </ol> </div> <div class="paragraph"> <p>index.html</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>Document</title> </head> <body> Intro typescript <script src="01_types.js"></script> <script src="02_data_structure.js"></script> <script src="03_enums_tuples.js"></script> </body> </html></code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="ts_types">Tipovi u TypeScript</h2> <div class="sectionbody"> <div class="paragraph"> <p>01_types.ts</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-typescript hljs" data-lang="typescript">/** * Les types en typescript */ //quand le type n'est pas defini des le debut, // alors il est réassignable // c'est le type Any qui est attribué par défaut let my_var; my_var = "username"; console.assert(my_var === "username"); my_var = 11; console.assert(my_var === 11); my_var = true; console.assert(my_var === true); let age = 1; console.assert(age === 1); age = 2; // age="trois" c'est impossible // car l'inference de type a attribué le type number console.assert(age === 2); // Déclaration explicite de type let pi: Number = 3.14; console.assert(typeof pi === "number");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_ts"><span class="underline">Увод TypeScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="fonctions">Функcije</h2> <div class="sectionbody"> <div class="paragraph"> <p>Funkcije su ponovo korišćeni blokovi koda.</p> </div> <div class="paragraph"> <p>Пример оцене :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-typescript hljs" data-lang="typescript">const add = (a: number, b: number): number => a + b;</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_ts"><span class="underline">Увод TypeScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="data_struct">Struktura podataka</h2> <div class="sectionbody"> <div class="paragraph"> <p>02_data_structure.ts</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-typescript hljs" data-lang="typescript">/*** * Structure de données: * Avec le type any on peut changer * le type de la variable à tout instruction * Lorsque l'on fixe le type * alors il n'est plus possible de le changer * lors d'une assignation */ // Arrays let buddies: any[] = [ "cheroliv", "imrandeh", "issoudeh", "soumi92" ] console.assert(buddies[0] === "cheroliv"); console.assert(buddies[1] === "imrandeh"); console.assert(buddies[2] === "issoudeh"); console.assert(buddies[3] === "soumi92"); // Déclaré en type any, l'inference de type // a bien réaligné en type string console.assert(typeof buddies[0] === "string"); console.assert(typeof buddies[1] === "string"); console.assert(typeof buddies[2] === "string"); console.assert(typeof buddies[3] === "string"); let writers: (String | String | String | Number)[][] = [ ["Chrétien", "de Troyes", "fr", 12], ["François", "Rabelais", "fr", 16], ["René", "Descartes", "fr", 17], ["Jean-Jacques", "Rousseau", "fr", 18], ["Georg", "Hegel", "de", 19], ["Karl", "Marx", "de", 19], ["Friedrich", "Engels", "de", 19], ["Victor", "Hugo", "fr", 19], ["Paul", "Verlaine", "fr", 19], ["Arthur", "Rimbaud", "fr", 19], ["Gérard", "de Nerval", "fr", 19], ["Georg", "Lukacs", "hu", 20], ["Franz", "Kafka", "hu", 20], ["Antonio", "Gramsci", "it", 20], ["Domenico","Losurdo","it",20], ]; // console.table(writers); // Objects let author: { first_name: String, last_name: String, lang: String, century: Number } = { // slice(-1) renvoie le dernier élèment first_name: writers.slice(-1)[0][0] as String, last_name: writers.slice(-1)[0][1] as String, lang: writers.slice(-1)[0][2] as String, century: writers.slice(-1)[0][3] as Number, } // assertion sur la valeur en accés par encapsulation(dot) console.assert(author.first_name === "Antonio") console.assert(author.last_name === "Gramsci") console.assert(author.lang === "it") console.assert(author.century === 20); // assertion sur le type en accès par index console.assert(typeof author["first_name"] === "string") console.assert(typeof author["last_name"] === "string") console.assert(typeof author["lang"] === "string") console.assert(typeof author["century"] === "number");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_ts"><span class="underline">Увод TypeScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="enums_tuples">Enum i tuple</h2> <div class="sectionbody"> <div class="paragraph"> <p>03_enums_tuples.ts</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-typescript hljs" data-lang="typescript">/** * Enums et Tuples * * Enum: il existe les enums numérique * et les enums chaine de caracteres. * * Tuple: similaire aux arrays mais ne peut * contenir qu'une valeur de type spécifié. * */ //Enum numérique // l'index par de debut défaut est 0 // ici on le place a 1 enum Week { Monday = 1, Tuesday = 2, Wednesday = 3, Thursday = 4, Friday = 5, Saturday = 6, Sunday = 7, }; console.assert(Week.Monday == 1); console.assert(Week.Tuesday == 2); console.assert(Week.Wednesday == 3); console.assert(Week.Thursday == 4); console.assert(Week.Friday == 5); console.assert(Week.Saturday == 6); console.assert(Week.Sunday == 7); console.assert(Week[1] === "Monday"); console.assert(Week[2] === "Tuesday"); console.assert(Week[3] === "Wednesday"); console.assert(Week[4] === "Thursday"); console.assert(Week[5] === "Friday"); console.assert(Week[6] === "Saturday"); console.assert(Week[7] === "Sunday"); let motd_arr_fr: String[] = [ "Associé à la Lune", "Du dieu Tiw, associé à Mars", "Du dieu germanique Odin", "Du dieu germanique du tonnerre Thor", "De la déesse germanique Frigga associée à Vénus", "Associé à Saturne", "Associé au Soleil", ]; let motd_arr_en: String[] = [ "associated with the Moon", "from the god Tiw, associated with Mars", "from Germanic god Odin", "from Germanic god of thunder Thor", "from Germanic goddess Frigga associated with Venus", "associated with Saturn", "associated with the Sun", ]; // Un tuple (triple) let monday_triple_fr: [ Number, String, String ] = [ Week.Monday, Week[Week.Monday], motd_arr_fr[0], ]; console.assert(monday_triple_fr[0] === 1); console.assert(monday_triple_fr[1] === "Monday"); console.assert(monday_triple_fr[2] === "Associé à la Lune"); let monday_triple_en: [ Number, String, String ] = [ Week.Monday, Week[Week.Monday], motd_arr_en[0], ]; console.assert(monday_triple_en[0] === 1); console.assert(monday_triple_en[1] === "Monday"); console.assert(monday_triple_en[2] === "associated with the Moon"); // On se fait un type pour ajouter le nom de la langue type Meaning_of_the_day = { lang: String, meaning: (Week | String)[][], }; //fonction d'affichage du type Meaning_of_the_day const display_motd = (motd: Meaning_of_the_day) => { motd.meaning.forEach(day => console.table(`${Week[day[0] as Week]}: ${day[1]}.(${motd.lang})`) ) }; //fonction d'assertion sur le type Meaning_of_the_day // afin de verifier la concordance du contenu avec // motd_arr_#lang# const test_motd = ( motd: Meaning_of_the_day, motd_arr: String[] ) => { console.assert(motd.lang.length === 2) for (const [i, value] of motd.meaning.entries()) { console.assert(value[1] === motd_arr[i]); } }; let motd_fr: Meaning_of_the_day = { lang: "fr", meaning: [ [Week.Monday, motd_arr_fr[0]], [Week.Tuesday, motd_arr_fr[1]], [Week.Wednesday, motd_arr_fr[2]], [Week.Thursday, motd_arr_fr[3]], [Week.Friday, motd_arr_fr[4]], [Week.Saturday, motd_arr_fr[5]], [Week.Sunday, motd_arr_fr[6]], ], } console.log("---------"); console.log("display_motd(motd_fr):"); display_motd(motd_fr); test_motd(motd_fr, motd_arr_fr) let motd_en: Meaning_of_the_day = { lang: "en", meaning: [ [Week.Monday, motd_arr_en[0]], [Week.Tuesday, motd_arr_en[1]], [Week.Wednesday, motd_arr_en[2]], [Week.Thursday, motd_arr_en[3]], [Week.Friday, motd_arr_en[4]], [Week.Saturday, motd_arr_en[5]], [Week.Sunday, motd_arr_en[6]], ], } console.log("---------"); console.log("display_motd(motd_en):"); display_motd(motd_en); console.log("---------"); test_motd(motd_en, motd_arr_en); // Un tuple (triple) utilisant le type // Meaning_of_the_day pour peupler le meaning let motd_triple: [ Number, String, String ] = [ Week.Monday, Week[Week.Monday], motd_fr.meaning[0][1] as String ]; console.assert(motd_triple[0] === 1); console.assert(motd_triple[1] === "Monday"); console.assert(motd_triple[2] === "Associé à la Lune");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_ts"><span class="underline">Увод TypeScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="void_never">Void i Never</h2> <div class="sectionbody"> <div class="paragraph"> <p>04_void_never_types.ts</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-typescript hljs" data-lang="typescript">// Le type void est l'opposé du type any // c'est l'absence de type. function verify_writers_length(): void { console.assert(writers.length > 0); } verify_writers_length(); const verify_writers_length_arrow = (): void => console.assert(writers.length > 0); verify_writers_length_arrow(); //Type of et never let value = 30; console.assert(typeof value === "number"); //never: qqchs qui n'arrive jamais function foo(x: String | Number): Boolean { if (typeof x === "string") { return true; } else if (typeof x === "number") { return false; } return fail("Error!") } function fail(message: String): never { throw new Error(message as string); }</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_ts"><span class="underline">Увод TypeScript</span></a> is not French text, it’s a placeholder. Since there is no actual French content to translate, there is nothing to output. Hence the translated text is empty. However, to strictly obey "Output only the translated text", we output nothing.</p> </div> <div class="paragraph"> <p>Thus final answer is blank.</p> </div> <div class="paragraph"> <p></think></p> </div> <div class="paragraph"> <p><a href="#toc_ts"><span class="underline">Увод TypeScript</span></a> (no translation needed as it’s not French text)</p> </div> </div> </div> <div class="sect1"> <h2 id="class_interface">Klase i interfejsi</h2> <div class="sectionbody"> <div class="paragraph"> <p>04_void_never_types.ts</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-typescript hljs" data-lang="typescript">/** * Les classes: * members, * visibility, * nommage, * accesseurs * scope identifier: static,private,protected * * convention de nommage : * Les membres private sont préfixés avec un _ * */ class Member { username: String = ""; email: String = ""; private _password: String = ""; readonly signup_date: Date = new Date(Date.now()); constructor(username: String, email: String) { this.username = username; this.email = email; } get password(): String { return this._password; } set password(new_password: String) { this._password = new_password; } /** * Une fonction static qui initilise un member, * à partir d'un author */ static fromAuthor(author: { first_name: String, last_name: String, lang: String, century: Number }): Member { return new Member( `${author.first_name}.${author.last_name}`, `${author.first_name}.${author.last_name}@acme.com`, ); } }; let domenico = Member.fromAuthor(author); domenico.password = "test"; console.assert(domenico.email === "Domenico.Losurdo@acme.com"); console.assert(domenico.password === "test"); // Héritage enum Forms { Undefined = 0, Polygones = 1, Circle = 2, Straight = 3, Segment = 4, }; class Form { type: Forms = Forms.Undefined; }; class Rectangle extends Form { h: Number = 0; w: Number = 0; }; class Square extends Rectangle { side: Number = 0; }; /** * Interface donne un contrat à un type. * Les interfaces permettent de définir la structure d'un objet. */ interface IPerson { username: String; email: String; readonly signup_date: Date; } const user1: IPerson = { username: Member.fromAuthor(author)["username"], email: Member.fromAuthor(author)["email"], signup_date: Member.fromAuthor(author)["signup_date"], }</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_ts"><span class="underline">Увод TypeScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="tsconfig">Datoteka tsconfig.json</h2> <div class="sectionbody"> <div class="paragraph"> <p>tsconfig.json</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-json hljs" data-lang="json">{ /* Visit https://aka.ms/tsconfig to read more about this file */ "compileOnSave": true, "compilerOptions": { "target": "es2016", "module": "CommonJS", "noEmitOnError": true, "strict": true, "noImplicitAny": true, "esModuleInterop": true } }</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_ts"><span class="underline">Увод TypeScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="modules">Moduli</h2> <div class="sectionbody"> <div class="paragraph"> <p>Moduli omogućavaju organizovanje koda u više datoteka.</p> </div> <div class="paragraph"> <p>Пример оцене :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-typescript hljs" data-lang="typescript">// Dans un fichier math.ts export const add = (a: number, b: number): number => a + b; // Dans un autre fichier import { add } from './math'; let result = add(2, 3);</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_ts"><span class="underline">Увод TypeScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="обећања">Обећања</h2> <div class="sectionbody"> <div class="paragraph"> <p>Obećanja se koriste za izvođenje asinhronih operacija.</p> </div> <div class="paragraph"> <p>Пример коде :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-typescript hljs" data-lang="typescript">const promise = new Promise<string>((resolve) => { // Code asynchrone ici resolve("Succès"); }); promise.then((result) => { console.log(result); });</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_ts"><span class="underline">Увод TypeScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="async-await">async/await</h2> <div class="sectionbody"> <div class="paragraph"> <p>async/await pojednostavljuje upravljanje promisama.</p> </div> <div class="paragraph"> <p>Primer ocene :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-typescript hljs" data-lang="typescript">const fetchData = async (): Promise<void> => { const result = await someAsyncFunction(); console.log(result); };</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_ts"><span class="underline">Увод TypeScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="generiques">Generički</h2> <div class="sectionbody"> <div class="paragraph"> <p>Generički omogućavaju kreiranje ponovo korišćenih komponenti sa dinamičnim tipovima.</p> </div> <div class="paragraph"> <p>Пример оцене :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-typescript hljs" data-lang="typescript">const identity = <T>(arg: T): T => arg; const output = identity<string>("hello"); console.log(output);</code></pre> </div> </div> </div> </div> https://cheroliv.com/blog/2023/0062_memo_css_post.html Mon, 14 Aug 2023 00:00:00 +0000 blog/2023/0062_memo_css_post.html <div class="sect1"> <h2 id="toc">Sadržaj</h2> <div class="sectionbody"> <div class="olist arabic"> <ol class="arabic"> <li> <p><a href="#good_links">dobri veze</a></p> </li> <li> <p><a href="#repo">Repozitorijum i uzorak koda</a></p> </li> <li> <p><a href="#toc_début"><span class="underline">Početak CSS</span></a></p> </li> </ol> </div> <div class="sect2"> <h3 id="good_links">dobri veze</h3> <div class="paragraph"> <p><a href="#toc">Sadržaj</a></p> </div> </div> <div class="sect2"> <h3 id="repo">Repozitorijum i uzorak koda</h3> <div class="paragraph"> <p>github repozitorijum:https://github.com/cheroliv/css-codebase[css-codebase, prozor = "_blank]</p> </div> </div> <div class="sect2"> <h3 id="toc_début"><span class="underline">Početak CSS</span></h3> <div class="olist arabic"> <ol class="arabic"> <li> <p><a href="#početak_uvod">[početak_uvod]</a></p> </li> <li> <p><a href="#fin_texts">[fin_texts]</a> is not provided, so the fragment is empty. Translating an empty fragment yields an empty output.</p> </li> <li> <p><a href="#поčetak_background">[поčetak_background]</a></p> </li> <li> <p>početak_kutije</p> </li> <li> <p><a href="#početak_flexbox">[početak_flexbox]</a></p> </li> <li> <p><a href="#početak_grid">[početak_grid]</a></p> </li> <li> <p><a href="#début_abs_pos">Apsolutna pozicija</a></p> </li> <li> <p><a href="#početak_responzivan">[početak_responzivan]</a></p> </li> <li> <p><a href="#početak_zaključak">Debug и Zaključak</a></p> </li> </ol> </div> <div class="paragraph"> <p><a href="#toc">Sadržaj</a></p> </div> </div> </div> </div> <div class="sect1"> <h2 id="début_intro">Uvod & priprema</h2> <div class="sectionbody"> <div class="paragraph"> <p>Uvod zasnovan na ovom videu:</p> </div> <div class="videoblock"> <div class="content"> <iframe src="https://www.youtube.com/embed/iSWjmVcfQGg?rel=0" frameborder="0" allowfullscreen></iframe> </div> </div> <div class="paragraph"> <p>GitHub репозиторијум:https://github.com/cheroliv/css-codebase/début_css/[поčetak css, window = "_blank]</p> </div> <div class="paragraph"> <p>izvor mema:<br> index.html</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Cours CSS</title> <link rel="stylesheet" href="style.css" /> </head> <body> <header> <h1>Les bases de CSS</h1> </header> <main> <div class="flexbox"> <h2>Flexbox</h2> <ul> <li>boite 1</li> <li>boite 2</li> <li>boite 3</li> </ul> </div> <div class="grid"> <h2>Grid</h2> <div class="grid-container"> <img src="./assets/img/css-logo.png" alt="logo css" /> <form action=""> <input type="text" id="firstname" placeholder="Prénom" /> <input type="text" id="surname" placeholder="Nom" /> <textarea cols="30" rows="10" placeholder="Ici votre message" ></textarea> <input type="submit" value="Valider" id="btn-submit" /> </form> </div> </div> <div class="absolute"> <h2>Absolute</h2> <span id="circle1"></span> <span id="circle2"></span> </div> </main> </body> </html></code></pre> </div> </div> <div class="paragraph"> <p>Poveži fajl style.css sa HTML stranicom:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"></head> <link rel="stylesheet" href="style.css" /> </head></code></pre> </div> </div> <div class="paragraph"> <p><a href="#sadržaj_početak">[sadržaj_početak]</a></p> </div> </div> </div> <div class="sect1"> <h2 id="début_texts">Текстови</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">/* import remote de font sur l'ensemble de la feuille*/ @import url("https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap"); /* import local de font */ @font-face { font-family: "DMSerif"; src: url(./assets/fonts/DMSerifDisplay-Regular.ttf); } /* body est le parent de toutes les balises, qu'il contient, donc je le déclare avant, pour la logique de précédence de parent */ body { /* si DMSerif n'est pas trouvé alors il se rabat sur Verdana*/ font-family: "DMSerif", Verdana; } /* va styliser toutes les balises h1, celles de body sont surchargés, par la déclaration présente */ h1 { text-transform: uppercase; /* espacement entre les lettres en pixel*/ letter-spacing: 3px; /* alignement du texte*/ text-align: center; /* Les tailles de polices doivent être en REM (rem = root em). Le REM se base pas sur l'élément parent pour obtenir sa taille mais sur l'élément racine. Ainsi 1rem prendra sa valeur de la font-size de votre document (body ou html).*/ font-size: 2.5rem; /* ombrage du texte */ text-shadow: 3px /* offset-x */ 3px /* offset-y */ 8px /* blur-radius */ #00000042/* color */; /* couleur du texte */ color: #ab0ef4; /*attibuer les polices(font): liste, ordonnée par priorité, de polices à utiliser pour mettre en forme le texte de l'élément ciblé.*/ font-family: "Oswald", sans-serif; /* surligner le text*/ text-decoration: underline; }</code></pre> </div> </div> <div class="paragraph"> <p>sadržaj_početak</p> </div> </div> </div> <div class="sect1"> <h2 id="početak_background">Pozadina</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap"); @font-face { font-family: "DMSerif"; src: url(./assets/fonts/DMSerifDisplay-Regular.ttf); } body { font-family: "DMSerif", Verdana; /* image comme background*/ background: url(./assets/img/bg.jpg) center/cover; /* 100VH = 100% de la taille de l'écran (viewport height) min afin de ne pas bloquer la possibilité d'avoir un plus grand */ min-height: 100vh; } h1 { text-transform: uppercase; letter-spacing: 3px; text-align: center; font-size: 2.5rem; text-shadow: 3px 3px 8px #00000042; color: #ab0ef4; font-family: "Oswald", sans-serif; text-decoration: underline; }</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_početak">[toc_početak]</a></p> </div> </div> </div> <div class="sect1"> <h2 id="début_boxes">Kutije (boxes)</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap"); @font-face { font-family: "DMSerif"; src: url(./assets/fonts/DMSerifDisplay-Regular.ttf); } /* *: létoile donne du style a tous les éléments. Ensuite remettre un à un les parametres par defaut afin d'eviter les stylisation inattendu.*/ * { /* surcharge de base tous les elements à padding 0*/ margin: 0; /* surcharge de base tous les elements à padding 0*/ padding: 0; } body { font-family: "DMSerif", Verdana; /* image comme background*/ background: url(./assets/img/bg.jpg) center/cover; min-height: 100vh; } h1 { text-transform: uppercase; letter-spacing: 3px; text-align: center; font-size: 2.5rem; text-shadow: 3px 3px 8px #00000042; color: #ab0ef4; font-family: "Oswald", sans-serif; text-decoration: underline; } main { background: rgba(245, 245, 245, 0.9); min-height: 500px; /* quelque soit la taille de l'écran, la boite fait toujours 90% de la taille de la page, les 10% restant sont une marge à droite, pour avoir 5% de chaque coté on ajoute une margin, tel que [0, auto]*/ width: 90%; /* haut bas prend 0, et gauche droite prend auto(center cad meme de chaque cotés)*/ margin: 0 auto; /* on ajoute des bords a notre boite*/ border: 2px solid rgb(0, 140, 255); /* on arrondis les coins de la boite*/ border-radius: 20px 20px 0 0; /* ombrage sur la boite*/ box-shadow: 0px 0px 20px 4px #81cfc6; /* marge interrieure de la boite sur tous les cotés*/ padding: 15px; } h2 { /* afin de recuprer le comportement par defaut qui a ete surchargé par l'operateur étoile*/ margin: 0; }</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Cours CSS</title> <link rel="stylesheet" href="style.css" /> </head> <body> <header> <h1>Les bases de CSS</h1> </header> <main> <div class="flexbox"> <h2>Flexbox</h2> <ul> <li>boite 1</li> <li>boite 2</li> <li>boite 3</li> </ul> </div> </main> </body> </html></code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_početak">[toc_početak]</a></p> </div> </div> </div> <div class="sect1"> <h2 id="début_flexbox">Fleksni okvir</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap"); @font-face { font-family: "DMSerif"; src: url(./assets/fonts/DMSerifDisplay-Regular.ttf); } body { font-family: "DMSerif", Verdana; background: url(./assets/img/bg.jpg) center/cover; min-height: 100vh; } h1 { text-transform: uppercase; letter-spacing: 3px; text-align: center; font-size: 2.5rem; text-shadow: 3px 3px 8px #00000042; color: #ab0ef4; font-family: "Oswald", sans-serif; text-decoration: underline; } main { background: rgba(245, 245, 245, 0.9); min-height: 500px; width: 90%; margin: 0 auto; border: 2px solid rgb(0, 140, 255); border-radius: 20px 20px 0 0; box-shadow: 0px 0px 20px 4px #81cfc6; padding: 15px; } h2 { margin: 0; } /* le point permet d'acceder à la classe d'un composant*/ .flexbox { border: 2px solid skyblue; border-radius: 10px; padding: 10px; margin-top: 20px; min-height: 150px; } /* FLEXBOX */ /* Sert à répartir équitablement des éléments sur la page */ .flexbox ul { padding: 0; /* aligne les éléments enfants de ul(les li)*/ display: flex; /* reparti convenablement(équitablement les li sur la page) */ justify-content: space-around; } /* ce style concerne les li de la classe, flexbox des balises qui y font referencent*/ .flexbox li { /* suprime les boules des éléments de la list li*/ list-style: none; height: 160px; width: 160px; margin: 10px; background: turquoise; /* Centrer un unique élément verticalement et horizontalement */ display: flex; justify-content: center; align-items: center; }</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Cours CSS</title> <link rel="stylesheet" href="style.css" /> </head> <body> <header> <h1>Les bases de CSS</h1> </header> <main> <div class="flexbox"> <h2>Flexbox</h2> <ul> <li>boite 1</li> <li>boite 2</li> <li>boite 3</li> </ul> </div> </main> </body> </html></code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_début"><span class="underline">Početak CSS</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="début_grid">Mreža</h2> <div class="sectionbody"> <div class="paragraph"> <p>Da bi se elementi raspodelili na malo složeniji način nego u flexbox-u, uz pomoć sistema mreže, između ostalog.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap"); @font-face { font-family: "DMSerif"; src: url(./assets/fonts/DMSerifDisplay-Regular.ttf); } body { font-family: "DMSerif", Verdana; background: url(./assets/img/bg.jpg) center/cover; min-height: 100vh; } h1 { text-transform: uppercase; letter-spacing: 3px; text-align: center; font-size: 2.5rem; text-shadow: 3px 3px 8px #00000042; color: #ab0ef4; font-family: "Oswald", sans-serif; text-decoration: underline; } main { background: rgba(245, 245, 245, 0.9); min-height: 500px; width: 90%; margin: 0 auto; border: 2px solid rgb(0, 140, 255); border-radius: 20px 20px 0 0; box-shadow: 0px 0px 20px 4px #81cfc6; padding: 15px; } h2 { margin: 0; } .flexbox, .grid { border: 2px solid skyblue; border-radius: 10px; padding: 10px; margin-top: 20px; min-height: 150px; } .flexbox ul { padding: 0; display: flex; justify-content: space-around; } .flexbox li { list-style: none; height: 160px; width: 160px; margin: 10px; background: turquoise; display: flex; justify-content: center; align-items: center; } /* GRID */ .grid-container { display: grid; /* séparatuion de la grille en deux(à ses deux enfants), avec à gauche 30% pour l'image et à droite 70% pour le formulaire*/ grid-template-columns: 30% 70%; } /* sizing de l'image css-logo contenu dans la classe grid qui est dans le parent grid-container*/ .grid img { /* l'image remplt 80% de part de grille*/ width: 80%; margin: 20px auto; display: block; } form { display: grid; /* deux colonnes de chacune 1 fraction*/ grid-template-columns: 1fr 1fr; /* trois rangés de chacune 1 fraction*/ grid-template-rows: 1fr 1fr 1fr; /* structuration sous forme de template de notre repartition des composants enfants de la forme*/ grid-template-areas: "i1 i2"/* i1: input1, i2:input2*/ "ta ta"/*ta: text area */ "vi bt"/*vi:, bt: bouton */; } /* on donne du style sur deux éléments en meme temps en les listant avant les parentheses*/ input, textarea { margin: 5px; border: 1px solid darkblue; padding: 10px; font-size: 1.1rem; font-family: "DMSerif"; border-radius: 5px; } /* donner du style uniquement la textearea*/ textarea { /* renseigner le nommage pour le grid template area*/ grid-area: ta; height: 40px; /* empeche le cassage du style de la page en empechant le resizing de la textarea du formulaire*/ resize: none; } /* pour pointer un id d'élément html on utilise la notation préfixe # */ #btn-submit { /* renseigner le nommage*/ grid-area: bt; /* change le le symbole de curseur souris quand il survole sur le bouton*/ cursor: pointer; background: cyan; transition: 0.2s; } /* au survole(hover) de la souris le bouton change de comportement*/ #btn-submit:hover { background: darkblue; /* couleur de text du bouton devient blanc*/ color: white; }</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Cours CSS</title> <link rel="stylesheet" href="style.css" /> </head> <body> <header> <h1>Les bases de CSS</h1> </header> <main> <div class="flexbox"> <h2>Flexbox</h2> <ul> <li>boite 1</li> <li>boite 2</li> <li>boite 3</li> </ul> </div> <div class="grid"> <h2>Grid</h2> <div class="grid-container"> <img src="./assets/img/css-logo.png" alt="logo css" /> <form action=""> <input type="text" id="firstname" placeholder="Prénom" /> <input type="text" id="surname" placeholder="Nom" /> <textarea cols="30" rows="10" placeholder="Ici votre message"></textarea> <input type="submit" value="Valider" id="btn-submit" /> </form> </div> </div> </main> </body> </html></code></pre> </div> </div> <div class="paragraph"> <p>sadržaj_početak</p> </div> </div> </div> <div class="sect1"> <h2 id="début_abs_pos">Apsolutna pozicija</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap"); @font-face { font-family: "DMSerif"; src: url(./assets/fonts/DMSerifDisplay-Regular.ttf); } body { font-family: "DMSerif", Verdana; background: url(./assets/img/bg.jpg) center/cover; min-height: 100vh; } h1 { text-transform: uppercase; letter-spacing: 3px; text-align: center; font-size: 2.5rem; text-shadow: 3px 3px 8px #00000042; color: #ab0ef4; font-family: "Oswald", sans-serif; text-decoration: underline; } main { background: rgba(245, 245, 245, 0.9); min-height: 500px; width: 90%; margin: 0 auto; border: 2px solid rgb(0, 140, 255); border-radius: 20px 20px 0 0; box-shadow: 0px 0px 20px 4px #81cfc6; padding: 15px; } h2 { margin: 0; } .flexbox, .grid, .absolute { border: 2px solid skyblue; border-radius: 10px; padding: 10px; margin-top: 20px; min-height: 150px; } .flexbox ul { padding: 0; display: flex; justify-content: space-around; } .flexbox li { list-style: none; height: 160px; width: 160px; margin: 10px; background: turquoise; display: flex; justify-content: center; align-items: center; } .grid-container { display: grid; grid-template-columns: 30% 70%; } .grid img { width: 80%; margin: 20px auto; display: block; } form { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr 1fr; grid-template-areas: "i1 i2" "ta ta" "vi bt"; } input, textarea { margin: 5px; border: 1px solid darkblue; padding: 10px; font-size: 1.1rem; font-family: "DMSerif"; border-radius: 5px; } textarea { grid-area: ta; height: 40px; resize: none; } #btn-submit { grid-area: bt; cursor: pointer; background: cyan; transition: 0.2s; } #btn-submit:hover { background: darkblue; color: white; } /* ABSOLUTE */ /* Sans élément en Relative, de base, l'élément en absolute l'est par rapport au Body */ /* Il faut mettre une position relative au parent pour contraindre l'élément en absolute dans ses frontières */ .absolute { /* position relative par rapport à son parent, donc contenu dans les frontieres de son parents*/ position: relative; } #circle1 { height: 80px; width: 80px; background: skyblue; position: absolute; border-radius: 150px; top: -20px; right: -20px; } #circle2 { height: 40px; width: 40px; border-radius: 150px; background: teal; position: absolute; left: 50%; transform: /*traslate de 50% de la taille du cercle, pour etre centré par rapport au centre du cercle, plutot que sur son bord gauche par défaut.*/ translateX(-50%); top: 100px; }</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Cours CSS</title> <link rel="stylesheet" href="style.css" /> </head> <body> <header> <h1>Les bases de CSS</h1> </header> <main> <div class="flexbox"> <h2>Flexbox</h2> <ul> <li>boite 1</li> <li>boite 2</li> <li>boite 3</li> </ul> </div> <div class="grid"> <h2>Grid</h2> <div class="grid-container"> <img src="./assets/img/css-logo.png" alt="logo css" /> <form action=""> <input type="text" id="firstname" placeholder="Prénom" /> <input type="text" id="surname" placeholder="Nom" /> <textarea cols="30" rows="10" placeholder="Ici votre message"></textarea> <input type="submit" value="Valider" id="btn-submit" /> </form> </div> </div> <div class="absolute"> <h2>Absolute</h2> <span id="circle1"></span> <span id="circle2"></span> </div> </main> </body> </html></code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_početak">[toc_početak]</a></p> </div> </div> </div> <div class="sect1"> <h2 id="début_responsive">Responsivan</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap"); @font-face { font-family: "DMSerif"; src: url(./assets/fonts/DMSerifDisplay-Regular.ttf); } body { font-family: "DMSerif", Verdana; background: url(./assets/img/bg.jpg) center/cover; min-height: 100vh; } h1 { text-transform: uppercase; letter-spacing: 3px; text-align: center; /* pour etre plus responsive on peut passer la taille en vw(view port width) pour qu'elle s'adapte à la taille de l'ecran*/ font-size: 2.5rem; text-shadow: 3px 3px 8px #00000042; color: #ab0ef4; font-family: "Oswald", sans-serif; text-decoration: underline; } main { background: rgba(245, 245, 245, 0.9); min-height: 500px; width: 90%; margin: 0 auto; border: 2px solid rgb(0, 140, 255); border-radius: 20px 20px 0 0; box-shadow: 0px 0px 20px 4px #81cfc6; padding: 15px; } h2 { margin: 0; } .flexbox, .grid, .absolute { border: 2px solid skyblue; border-radius: 10px; padding: 10px; margin-top: 20px; min-height: 150px; } .flexbox ul { padding: 0; display: flex; justify-content: space-around; } .flexbox li { list-style: none; height: 160px; width: 160px; margin: 10px; background: turquoise; display: flex; justify-content: center; align-items: center; } .grid-container { display: grid; grid-template-columns: 30% 70%; } .grid img { width: 80%; margin: 20px auto; /* permet en media query de la centrer en petit écran*/ display: block; } form { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr 1fr; grid-template-areas: "i1 i2" "ta ta" "vi bt"; } input, textarea { margin: 5px; border: 1px solid darkblue; padding: 10px; font-size: 1.1rem; font-family: "DMSerif"; border-radius: 5px; } textarea { grid-area: ta; height: 40px; resize: none; } #btn-submit { grid-area: bt; cursor: pointer; background: cyan; transition: 0.2s; } #btn-submit:hover { background: darkblue; color: white; } .absolute { position: relative; } #circle1 { height: 80px; width: 80px; background: skyblue; position: absolute; border-radius: 150px; top: -20px; right: -20px; } #circle2 { height: 40px; width: 40px; border-radius: 150px; background: teal; position: absolute; left: 50%; transform: translateX(-50%); top: 100px; } /* RESPONSIVE: a partir des tailles d'ecran permet de surcharger les reglages definis plus haut */ @media screen and (max-width: 900px) { .grid-container { display: block; } .grid-container img { width: 40%; } } @media screen and (max-width: 610px) { .flexbox ul { flex-direction: column; align-items: center; } form { grid-template-columns: 1fr; grid-template-rows: 1fr; grid-template-areas: "i1" "i2" "ta" "bt"; } input, textarea { font-size: 0.8rem; } }</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Cours CSS</title> <link rel="stylesheet" href="style.css" /> </head> <body> <header> <h1>Les bases de CSS</h1> </header> <main> <div class="flexbox"> <h2>Flexbox</h2> <ul> <li>boite 1</li> <li>boite 2</li> <li>boite 3</li> </ul> </div> <div class="grid"> <h2>Grid</h2> <div class="grid-container"> <img src="./assets/img/css-logo.png" alt="logo css" /> <form action=""> <input type="text" id="firstname" placeholder="Prénom" /> <input type="text" id="surname" placeholder="Nom" /> <textarea cols="30" rows="10" placeholder="Ici votre message"></textarea> <input type="submit" value="Valider" id="btn-submit" /> </form> </div> </div> <div class="absolute"> <h2>Absolute</h2> <span id="circle1"></span> <span id="circle2"></span> </div> </main> </body> </html></code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_početak">[toc_početak]</a></p> </div> </div> </div> <div class="sect1"> <h2 id="početak_zaključak">Debug и Zaključak</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-css hljs" data-lang="css">/* all elements: supprime les comportements par défaut*/ * { /* les marges à zéro*/ margin: 0; /* les parge internes(padding) à zéro*/ padding: 0; /* tous les bords avec un cadre rouge de 2px. qui est ou et qui fait quoi...*/ border: 2px solid red; }</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_početak">[toc_početak]</a></p> </div> </div> </div> https://cheroliv.com/blog/2023/0061_memo_html_post.html Sun, 13 Aug 2023 00:00:00 +0000 blog/2023/0061_memo_html_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_dobre_veze">Dobre veze</a></li> <li><a href="#_репозиторијум_и_пример_кода">Репозиторијум и пример кода</a></li> </ul> </div> <div class="sect1"> <h2 id="_dobre_veze">Dobre veze</h2> <div class="sectionbody"> <div class="ulist"> <div class="title">html</div> <ul> <li> <p><a href="https://htmlcheatsheet.com">htmlcheatsheet.com</a>: HTML bilježnica</p> </li> </ul> </div> <div class="ulist"> <div class="title">font</div> <ul> <li> <p><a href="https://fontawesome.com">fontawesome.com</a>biblioteka ikona</p> </li> <li> <p><a href="https://www.toptal.com/designers/htmlarrows/symbols/">toptal.com/designers/htmlarrows/symbols</a>: Prirodne ikone u HTML</p> </li> </ul> </div> <div class="ulist"> <div class="title">specijalni znakovi i escape sekvence</div> <ul> <li> <p><a href="https://www.sonarsource.com/blog/encoding-differentials-why-charset-matters/" class="bare">https://www.sonarsource.com/blog/encoding-differentials-why-charset-matters/</a></p> </li> <li> <p><a href="https://stackoverflow.com/a/3614344/13104550" class="bare">https://stackoverflow.com/a/3614344/13104550</a></p> </li> <li> <p><a href="https://html.spec.whatwg.org/multipage/named-characters.html" class="bare">https://html.spec.whatwg.org/multipage/named-characters.html</a></p> </li> </ul> </div> <div class="paragraph"> <p><a href="#toc">[toc]</a></p> </div> </div> </div> <div class="sect1"> <h2 id="_репозиторијум_и_пример_кода">Репозиторијум и пример кода</h2> <div class="sectionbody"> <div class="paragraph"> <p>github repozitorijum:https://github.com/cheroliv/html-codebase[html-codebase, window = "_blank]</p> </div> <div class="paragraph"> <p>memo source:<br> index.html</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <!-- Le titre de la page --> <title>Cours HTML</title> <!-- Icone de l'onglet --> <link rel="shortcut icon" href="html-logo.png" /> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" /> </head> <body> <header> <h1>Texte - Titre H1</h1> <p> <em>em pour mettre en italique</em>, <strong>strong pour mettre en gras</strong> <span>L'élement en span ne revient pas à la ligne</span>. </p> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Exercitationem cumque ratione veniam officiis nulla a debitis at facilis sed dignissimos. </p> </header> <section> <div> <h2>Photo - Titre H2</h2> <img src="./img-1.jpg" alt="image-arbre" height="200" /> </div> <div> <h3>Liste - Titre H3</h3> <ul> <li>UL = unordered list</li> <li>UL = unordered list</li> <li>UL = unordered list</li> </ul> <ol> <li>OL = ordered list</li> <li>OL = ordered list</li> <li>OL = ordered list</li> </ol> </div> <div> <h4>Tableaux - Titre H4</h4> <table border="4" cellpadding="10" cellspacing="4" style="text-align: center"> <thead> <tr> <th>Col 1</th> <th>Col 2</th> <th>Col 3</th> </tr> </thead> <tbody> <tr> <td rowspan="2">Row 1 Cell 1</td> <td>Row 1 Cell 2</td> <td>Row 1 Cell 3</td> </tr> <tr> <td>Row 2 Cell 2</td> <td>Row 2 Cell 3</td> </tr> <tr> <td colspan="3">Row 3 Cell 1</td> </tr> </tbody> </table> </div> <div> <h5><span>♖</span> Liens - Titre H5</h5> <a href="https://htmlcheatsheet.com/" target="_blank">HTML Cheatsheet</a> <br /> <a href="https://www.toptal.com/designers/htmlarrows/symbols/" target="_blank">Icones natifs en HTML</a> </div> <div> <h6><i class="fas fa-video"></i> Vidéo - Titre H6</h6> <video src="video.mp4" height="150" autoplay loop muted></video> </div> </section> <br /> <!-- Formulaires en HTML --> <section> <h2>Formulaire</h2> <form action="/action.php" method="post"> <label for="name">Nom</label> <input id="name" type="text" placeholder="Entrez votre nom" /><br /> <label for="number">Entrez votre age</label> <input type="number" id="number-age" value="15" oninput="document.getElementById('range-age').value=this.value"> <input type="range" id="range-age" min="0" max="100" oninput="document.getElementById('number-age').value=this.value"><br /> <!-- Input select --> <label for="gender">Genre</label> <select id="gender"> <option selected="selected" value="Homme">Homme</option> <option value="Femme">Femme</option> </select><br /> <!-- Input radio --> <div> <input type="radio" name="type" id="human" checked /> <label for="human">Humain</label> <input type="radio" name="type" id="dog" /> <label for="dog">Chien</label> <input type="radio" name="type" id="cat" /> <label for="cat">Chat</label> </div> <textarea cols="20" rows="5" placeholder="Votre message..."></textarea><br /> <!-- Input Checkbox --> <label><input type="checkbox" />Accepter les CGV</label> <br /> <input type="submit" value="Submit" /> </form> </section> <br /> <!-- Mail & envoi de fichiers --> <footer> <a href="mailto:fs@gmail.com">Ecrivez-moi !</a> <br /> <a href="notice.txt" download="nom-du-fichier">Télécharger la notice</a> <details> <summary>Plus d'infos</summary> <p> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Harum, repellendus. </p> </details> </footer> </body> </html></code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc">[toc]</a></p> </div> </div> </div> https://cheroliv.com/blog/2023/0060_memo_js_post.html Fri, 4 Aug 2023 00:00:00 +0000 blog/2023/0060_memo_js_post.html <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <p>github репозиторијум:https://github.com/cheroliv/js-codebase[js-codebase, window="_blank]</p> </div> </div> </div> <div class="sect1"> <h2 id="toc_js"><span class="underline">Uvod JavaScript</span></h2> <div class="sectionbody"> <div class="olist arabic"> <ol class="arabic"> <li> <p><a href="#start">Varijable, aritmetički operatori i stringovi</a></p> </li> <li> <p><a href="#arrays">Nizovi</a></p> </li> <li> <p><a href="#functions">Функције</a></p> </li> <li> <p><a href="#param_x_scope">Parametri i scopes</a></p> </li> <li> <p><a href="#objects">Objekti</a></p> </li> <li> <p><a href="#loops">Petlje</a></p> </li> <li> <p><a href="#const_var_let">Const, var i let</a></p> </li> <li> <p><a href="#rest_and_spread_operators">Operatori rest i spread</a></p> </li> <li> <p><a href="#деструктуризација">[деструктуризација]</a></p> </li> <li> <p><a href="#import_export">Uvoz i izvoz modula</a></p> </li> <li> <p><a href="#klase">[klase]</a></p> </li> </ol> </div> <div class="paragraph"> <p>index.html</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-html hljs" data-lang="html"><!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <title>Document</title> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> </head> <body> index <script src="01_start.js"></script> <script src="02_arrays.js"></script> <script src="03_functions.js"></script> <script src="04_param_x_scope.js"></script> <script src="05_objects.js"></script> <script src="06_loops.js"></script> <script src="07_const_var_let.js"></script> <script src="08_rest_and_spread_operators.js"></script> <script src="09_destructuring.js"></script> <script src="10_module_import_export.js"></script> </body> </html></code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="start">Varijable, aritmetički operatori i stringovi</h2> <div class="sectionbody"> <div class="paragraph"> <p>01_start.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Variables */ //une variable stupide var my_variable = "dummy variable"; console.log(my_variable); //assertion console.assert(my_variable === "dummy variable"); var username = "cheroliv"; console.log(username); console.assert(username === "cheroliv"); //concaténation de string console.assert(username === "cher" + "oliv"); /** * Opérateur arithmétique: + - * / % */ //integer var x = 10; var y = 5; var z = 20; console.log(x + y); console.assert(x + y === 15); console.log(x + y - z); console.assert(x + y - z === -5); console.log(x - y); console.assert(x - y === 5); console.log(x * y); console.assert(x * y === 50); console.log(x / y); console.assert(x / y === 2); console.log("---------"); x = 20; y = 10; console.log(x + y); console.assert(x + y === 30); console.log(x + y - z); console.assert(x + y - z === 10); console.log(x - y); console.assert(x - y === 10); console.log(x * y); console.assert(x * y === 200); console.log(x / z); console.assert(x / z === 1); //Littéraux de gabarits pour string avec backstick ` //Template literals (Template strings) console.assert(`typeof z: ${typeof z}` === "typeof z: number"); console.log(`x is type of : ${typeof x}`); console.log(`y is type of : ${typeof y}`); console.log(`z is type of : ${typeof z}`); //typeof: donne le type de la variable console.assert(typeof x === "number"); console.assert(typeof y === "number"); console.assert(typeof z === "number"); console.log("---------"); /** * Incrémenation/décrémentation */ //incrémantation/décrémentation préfixe console.log(++x) //incrémenté puis affiché: 21 console.log(x) //la valeur incrémenté: 21 //incrémantation/décrémentation suffixe console.log(y++) //affiche la valeur sans incrémenation puis incrémente: 10 console.log(y) //la valeur incrémenté: 11 //décrémentation x--; y--; console.assert(x === 20); console.assert(y === 10); /** * String: chaine de caractères */ console.log(`username: ${username}`); //taille de la string console.log(`username.length: ${username.length}`); console.assert(username.length === 8); console.assert(username.length === "cheroliv".length); console.log("---------");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="arrays">Nizovi</h2> <div class="sectionbody"> <div class="paragraph"> <p>02_arrays.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Les arrays */ // auteurs [["nom ", "prénom", "pays"]] var writers = [ ["Karl", "Marx", "de"], ["Jean-Jacques", "Rousseau", "fr"], ["Victor", "Hugo", "fr"], ["René", "Descartes", "fr"], ["Paul", "Verlaine", "fr"], ["Antonio", "Gramsci", "it"], ["Georg", "Lukacs", "hu"], ["Franz", "Kafka", "hu"], ["Arthur", "Rimbaud", "fr"], ["Gérard", "de Nerval", "fr"], ["Chrétien", "de Troyes", "fr"], ["François", "Rabelais", "fr"], ["Georg", "Hegel", "de"], ["Friedrich", "Engels", "de"], ] console.table(writers); // accés aux élèments du tableau console.log(writers[0]); console.log(`${writers[0][0]}, ${writers[0][1]} (${writers[0][2]})`); console.assert("Karl, Marx (de)" === `${writers[0][0]}, ${writers[0][1]} (${writers[0][2]})`); //sauvegarder la valeur du prénom de Marx var karl = writers[0][0] //éditer un élement du tableau, le prénom de Marx writers[0][0] = "Karlito" console.log(`${writers[0][0]}, ${writers[0][1]} (${writers[0][2]})`); console.assert("Karlito, Marx (de)" === `${writers[0][0]}, ${writers[0][1]} (${writers[0][2]})`); console.assert("Karl" === karl); //remettre la valeur initale du prénom de Marx writers[0][0] = karl; console.assert(`${karl}, Marx (de)` === `${writers[0][0]}, ${writers[0][1]} (${writers[0][2]})`); console.log("---------"); /** * Arrays: map/forEach/pop/push/slice/sort/shift/unshift */ var numbers = [1, 5, 4, 3, 2]; console.log("Iterate with forEach"); // parcourir avec array.forEach numbers.forEach((it) => console.log(it)); console.log("---------"); console.log("Iterate with map"); // parcourir avec array.map numbers.map((it) => console.log(it)); console.log("---------"); //afficher les éléments sur une ligne //génère la string avec le formatage des nombres const numbersString = (numberArray) => { var consoleOutput = new String(); numberArray.forEach(number => consoleOutput += `${number}, `); return consoleOutput = consoleOutput.substring(0, consoleOutput.length - 2); }; //affiche la chaine entre crochets dans la console const displayNumbers = (numbersStr) => { console.log(`[${numbersString(numbersStr)}]`); }; console.log("orginal number array") displayNumbers(numbers); console.log("---------"); //push: ajoute à la fin console.log("push"); numbers.push(6); displayNumbers(numbers); console.log("---------"); //pop: suprime le dernier console.log("pop"); numbers.pop(); displayNumbers(numbers); console.log("---------"); //unshift: ajouter le parametre au debut de l'array console.log("unshift"); numbers.unshift(0); displayNumbers(numbers); console.log("---------"); //shift: supprime le premier element de l'array console.log("shift"); numbers.shift(); displayNumbers(numbers); console.log("---------"); //slice: renvoi l'array entre les positions en argument console.log("slice"); var sliceNumbersResult = numbers.slice(2, 4); displayNumbers(sliceNumbersResult); console.log("---------"); //sort asc console.log("sort asc"); var ascSort = numbers.sort((a, b) => a - b); displayNumbers(ascSort); console.log("---------"); //sort desc console.log("sort desc"); var descSort = numbers.sort((a, b) => b - a); displayNumbers(descSort); console.log("---------");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="functions">Функције</h2> <div class="sectionbody"> <div class="paragraph"> <p>03_functions.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Les fonctions */ //function style legacy function sayHelloWorldLegacy() { console.log("Hello world legacy!"); } sayHelloWorldLegacy(); function sayHelloLegacy(firstName, lastName, style) { console.log(`Hello ${firstName}, ${lastName} (${style})`); } sayHelloLegacy("Cher", "Oliv", "legacy"); console.log("---------"); //function style arrow const sayHelloWorld = () => console.log("Hello world!"); sayHelloWorld(); const sayHello = (firstName, lastName) => console.log(`Hello ${firstName}, ${lastName}`); sayHello("Cher", "Oliv"); console.log("---------"); var authors = [ ["Chrétien", "de Troyes", "fr"], ["François", "Rabelais", "fr"], ["René", "Descartes", "fr"], ["Jean-Jacques", "Rousseau", "fr"], ["Georg", "Hegel", "de"], ["Karl", "Marx", "de"], ["Friedrich", "Engels", "de"], ["Victor", "Hugo", "fr"], ["Paul", "Verlaine", "fr"], ["Antonio", "Gramsci", "it"], ["Georg", "Lukacs", "hu"], ["Franz", "Kafka", "hu"], ["Arthur", "Rimbaud", "fr"], ["Gérard", "de Nerval", "fr"], ] const displayAuthors = (authorsArray) => authorsArray.forEach(author => console.log(`${author[0]} ${author[1]}, (${author[2]})`) ); displayAuthors(authors); console.log("---------"); /** * valeur par défaut des parametres d'une fonctions */ const add = (a = 0, b = 0) => a + b; console.assert(add() === 0) console.assert(add(1) === 1) console.assert(add(1, 1) === 2) console.log("---------");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="param_x_scope">Parametri i scopes</h2> <div class="sectionbody"> <div class="paragraph"> <p>04_param_x_scope.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">//global scope: visible partout, dans et hors functions var global; const foo = () => { //local scope: visible uniquement dans la fonction foo var bar = "bar" console.log(bar) } foo(); console.log("---------");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="objects">Objekti</h2> <div class="sectionbody"> <div class="paragraph"> <p>05_objects.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Les objects */ var authors = [ ["Chrétien", "de Troyes", "fr"], ["François", "Rabelais", "fr"], ["René", "Descartes", "fr"], ["Jean-Jacques", "Rousseau", "fr"], ["Georg", "Hegel", "de"], ["Karl", "Marx", "de"], ["Friedrich", "Engels", "de"], ["Victor", "Hugo", "fr"], ["Paul", "Verlaine", "fr"], ["Antonio", "Gramsci", "it"], ["Georg", "Lukacs", "hu"], ["Franz", "Kafka", "hu"], ["Arthur", "Rimbaud", "fr"], ["Gérard", "de Nerval", "fr"], ]; var hugo = { firstName: authors[7][0], lastName: authors[7][1], country: authors[7][2], }; var book = { author: hugo, title: "Les misérables" }; console.log(hugo); console.log(book); //accéder à un membre de l'objet par point console.log(hugo.country); //accéder à un membre de l'objet par crochet console.log(book["title"]); console.log(book.author.lastName); console.log(book["author"]["firstName"]); //ajouter une clé a un objet hugo.gender = "non binary"; console.assert(hugo.gender === "non binary"); //mettre à jour une clé hugo.gender = "male"; console.assert(hugo.gender !== "non binary"); console.assert(hugo["gender"] === "male"); //supprimer une clé delete hugo.gender; //verfier que l'objet ne contient pas la clé gender console.assert(!Object.keys(hugo).includes("gender")); console.log("---------");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="loops">Petlje</h2> <div class="sectionbody"> <div class="paragraph"> <p>06_loops.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Les boucles: Itérer sur arrays et objets. */ console.log("for loop over array"); var numbers = [12, 10, 8, 6, 4, 2, 0]; for (number of numbers) { console.log(number); } console.log("---------"); console.log("for loop over object key"); var obj = { a: 1, b: 2, c: 3, d: 4 }; for (key in obj) { console.log(key); } console.log("---------"); console.log("for loop over object value"); for (value in obj) { console.log(obj[value]); } console.log("---------"); console.log("another for loop over authors array") var authors = [ ["Chrétien", "de Troyes", "fr"], ["François", "Rabelais", "fr"], ["René", "Descartes", "fr"], ["Jean-Jacques", "Rousseau", "fr"], ["Georg", "Hegel", "de"], ["Karl", "Marx", "de"], ["Friedrich", "Engels", "de"], ["Victor", "Hugo", "fr"], ["Paul", "Verlaine", "fr"], ["Antonio", "Gramsci", "it"], ["Georg", "Lukacs", "hu"], ["Franz", "Kafka", "hu"], ["Arthur", "Rimbaud", "fr"], ["Gérard", "de Nerval", "fr"], ]; for (const [i, value] of authors.entries()) { console.log(`${value[0]}, ${value[1]} (${value[2]})`); } console.log("---------"); console.log("while loop over array") var i = 0 while (i < authors.length) { console.log(`${authors[i][0]}, ${authors[i][1]} (${authors[i][2]})`); i++; } console.log("---------");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="const_var_let">Const, var i let</h2> <div class="sectionbody"> <div class="paragraph"> <p>07_const_var_let.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * const X var X let */ //var x du if n'est pas confiné au scope du if const varTest = () => { var x = 1; console.log(x); console.assert(x === 1); if (true) { var x = 2; console.log(x); console.assert(x === 2); } console.log(x); console.assert(x !== 1); console.assert(x === 2); } varTest(); console.log("---------"); //var x est global à tous les fichier js //chargés dans la page html //var x issue du fichier 1_start.js //ligne 46 console.log(x); console.assert(x === 20); console.log("---------"); //premier let x est confiné au scope de la fonction //le let x du if est confiné au scope du if const letTest = () => { let x = 1; console.log(x); console.assert(x === 1); if (true) { let x = 2; console.log(x); console.assert(x === 2); } console.log(x); console.assert(x === 1); console.assert(x !== 2); } letTest(); console.log("---------"); /** * const: déclare un emplacement mémoire non réattribuable * c'est modifiable pour un array, * mais non réinitialisable; * ex: * const arr = [25, 27, 29] * arr = [5, 7] //impossible * arr[0]=20 // possible * ex: * const n = 1; * n = 3; //impossible */ const arr = [25, 27, 29] console.table(arr); arr[0] = 20 // possible console.table(arr); arr.pop() console.table(arr); console.log("---------");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="rest_and_spread_operators">Operatori rest i spread</h2> <div class="sectionbody"> <div class="paragraph"> <p>08_reste_et_propagation_opérateurs.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Opérateur de rest: * const add = (...operandes) => a + b; * ou avec parametres avec valeur par défaut * const add = (a=0, b=0, ...operandes) => a + b; */ /** * spread opérateur: * récupère l'ensemble des elements d'une collection, * dans un array */ const user_ages = [25, 56, 12, 58, 41, 62, 26]; const max_user_age = Math.max(...user_ages); const min_user_age = Math.min(...user_ages); console.assert(max_user_age == 62); console.assert(min_user_age == 12); console.log("---------");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="destructuring">Dekonstrukcija</h2> <div class="sectionbody"> <div class="paragraph"> <p>09_destructuring.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * L'affectation par décomposition (destructuring) */ const user = { first_name: "Oliv", last_name: "Cher", nick_name: "cheroliv", gender: "male", is_adult: true }; console.log(user); //première façon d'initaliser des variables sans destructuration let first_name_legacy = user.first_name; let last_name_legacy = user.last_name; let nick_name_legacy = user.nick_name; let gender_legacy = user.gender; let is_adult_legacy = user.is_adult; console.assert("Oliv" === first_name_legacy); console.assert("Cher" === last_name_legacy); console.assert("cheroliv" === nick_name_legacy); console.assert("male" === gender_legacy); console.assert(true === is_adult_legacy); console.log("---------"); /** * Initialisation par déstructuration */ const { first_name, last_name, nick_name, gender, is_adult } = user; console.assert(user.first_name === first_name); console.assert(user.last_name === last_name); console.assert(user.nick_name === nick_name); console.assert(user.gender === gender); console.assert(user.is_adult === is_adult); /** * Intialisation par déstructuration des arrays */ //cible explicite const [a1, a2] = [15, 25, 17, 81, 51, 46]; console.assert(a1 === 15); console.assert(a2 === 25); //cible avec position par rapport aux index par virgules //je veux b3 à 46 const [b1, b2, , , , b3] = [15, 25, 17, 81, 51, 46]; console.assert(b1 === 15); console.assert(b2 === 25); console.assert(b3 === 46); //déstructuration avec operateur de rest // je contruit un autre avec avec les elements // à partir du premier élèment non destructuré const [c1, c2, ...sub_arr] = [15, 25, 17, 81, 51, 46]; console.assert(b1 === 15); console.assert(b2 === 25); console.assert(sub_arr.length === 4); console.assert(sub_arr[0] === 17); console.assert(sub_arr[1] === 81); console.assert(sub_arr[2] === 51); console.assert(sub_arr[3] === 46); // Une boucle pour comparer le resultat attendu for (const [i, value] of[15, 25, 17, 81, 51, 46].entries()) { //on reconstruit le tableau à chaque iteration console.assert([c1, c2].concat(sub_arr)[i] === value); }</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="import_export">Uvoz i izvoz modula</h2> <div class="sectionbody"> <div class="paragraph"> <p>10_module_import_export.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Import et export de module * * Dans le fichier html * au niveau de la balise d'import de script * spécifier le type module * * 1er technique: import nommé des fonctions: * import { sum, minus, times, div, rem } from "./dummy_math_functions.js"; * * 2eme technique: import global des fonction avec l'asterisque(*) * en préfixant l'import par un nommage du fichier importé: * import * as math from "./dummy_math_functions.js"; * * 3eme technique: import par alias avec le mot clé "as" * import { * sum as add, * minus as substract, * times as multiply, * div as divide, * rem as modulo * } from "./dummy_math_functions.js"; */ import { sum, minus, times, div, rem } from "./dummy_math_functions.js"; console.assert(sum(1, 1) === 2); console.assert(minus(4, 2) === 2); console.assert(times(2, 2) === 4); console.assert(div(4, 2) === 2); console.assert(rem(4, 2) === 0);</code></pre> </div> </div> <div class="paragraph"> <p>dummy_math_functions.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">//sum const sum = (x, y) => x + y; // subtraction const minus = (x, y) => x - y; // multiplication const times = (x, y) => x * y; // division const div = (x, y) => x / y; // remainder: reste de la division euclidiene const rem = (x, y) => x % y; // log sum const sum_log = (x, y) => console.log(sum(x, y)); // log subtraction const minus_log = (x, y) => console.log(minus(x, y)); // log multiplication const times_log = (x, y) => console.log(times(x, y)); // log division const div_log = (x, y) => console.log(div(x, y)); // log remainder const rem_log = (x, y) => console.log(rem(x, y)); export { sum, minus, times, div, rem, sum_log, minus_log, times_log, div_log, rem_log };</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> <div class="sect1"> <h2 id="classes">Korišćenje klasa</h2> <div class="sectionbody"> <div class="paragraph"> <p>11_classes.js</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-javascript hljs" data-lang="javascript">/** * Utilisation des classes */ //creation d'un objet class Account { constructor(username) { this.username = username; } }; const acc1 = new Account("cheroliv"); console.table(acc1); console.assert(acc1.username === "cheroliv"); console.log("---------"); //création d'un objet et ajout de getter et setter(accesseurs) class AccountInfo { constructor(username) { this._username = username; } get username() { return this._username; } /** * @param {(arg0: string) => void} new_username */ set new_username(new_username) { this._username = new_username; } }; const acc_info1 = new AccountInfo("cheroliv"); console.table(acc_info1); //accés au membre _username avec le getter username() console.assert(acc_info1.username === "cheroliv"); //update la valeur username de acc_info1 avec le setter acc_info1.new_username = "imrandeh"; console.assert(acc_info1.username === "imrandeh"); console.log("---------");</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc_js"><span class="underline">Uvod JavaScript</span></a></p> </div> </div> </div> https://cheroliv.com/blog/2022/0054_memo_cadrage_post.html Sat, 31 Dec 2022 00:00:00 +0000 blog/2022/0054_memo_cadrage_post.html <div class="sect1"> <h2 id="_okadranje">okadranje</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_radionica_1_vizija">Radionica 1 : Vizija</h3> <div class="sect3"> <h4 id="_1_uzorak_qqoqcp_ko_šta_gde_kada_kako_zašto">1. Uzorak “QQOQCP” – Ko, Šta, Gde, Kada, Kako, Zašto</h4> </div> <div class="sect3"> <h4 id="_2_product_vision_board">2. Product Vision Board</h4> <div class="sect4"> <h5 id="_ciljna_grupa">Ciljna grupa</h5> <div class="paragraph"> <p>Ko su korisnici koji koriste proizvod ili ponudu? (direktno, indirektno)</p> </div> </div> <div class="sect4"> <h5 id="_потребности">потребности</h5> <div class="paragraph"> <p>Koje su 5 glavnih potreba ključnih korisnika aplikacije?</p> </div> </div> <div class="sect4"> <h5 id="_proizvod">Proizvod</h5> <div class="paragraph"> <p>Šta je moja vrednosna ponuda? Koja su 5 glavnih funkcija proizvoda koja omogućavaju da se odgovori na potrebe</p> </div> </div> <div class="sect4"> <h5 id="_пословни_циљ">пословни циљ</h5> <div class="paragraph"> <p>Које су критеријуми успеха?</p> </div> </div> <div class="sect4"> <h5 id="_vizija">Vizija</h5> <div class="paragraph"> <p>Kada su 4 kolone popunjene, trebaće da popunate deo vizije Product Vision. Board у једној целој реченици.</p> </div> </div> </div> </div> <div class="sect2"> <h3 id="_radionica_2_ličnostiput_korisnika">Radionica 2: ličnosti/put korisnika</h3> <div class="ulist"> <div class="title">Definišite za svaku ličnost korisnički put:</div> <ul> <li> <p>Ko će koristiti moj servis? (Cilj)</p> </li> <li> <p>Šta želi da uradi? (But)</p> </li> <li> <p>Како ће он урадити? (Пут корисника)</p> </li> </ul> </div> </div> <div class="sect2"> <h3 id="_радионица_3_зонирање_сториборд_сайтмап">Радионица 3: Зонирање, Сториборд, Сайтмап</h3> <div class="sect3"> <h4 id="_1_zoniranje">1. Zoniranje</h4> </div> <div class="sect3"> <h4 id="_2_storyboard">2. Storyboard</h4> </div> <div class="sect3"> <h4 id="_3_mapa_sajta">3. Mapa sajta</h4> </div> </div> <div class="sect2"> <h3 id="_radionica_4_wireframemoodboard">Radionica 4: Wireframe/Moodboard</h3> <div class="sect3"> <h4 id="_1_wireframes">1. Wireframes</h4> </div> <div class="sect3"> <h4 id="_2_табло_настроја">2. Табло настроја</h4> </div> </div> <div class="sect2"> <h3 id="_radionica_5_mapiranje_priče_korisničke_priče">Radionica 5: Mapiranje priče/ korisničke priče</h3> <div class="sect3"> <h4 id="_mapiranje_priča_prioritet_us">Mapiranje priča (prioritet US)</h4> </div> <div class="sect3"> <h4 id="_kao_type_dutilisateur_želim_un_objectif_da_une_raison">Kao <type d’utilisateur>, želim <un objectif> da <une raison>.</h4> </div> </div> <div class="sect2"> <h3 id="_radionica_6_backlog">Radionica 6: Backlog</h3> <div class="paragraph"> <p><a href="https://www.atlassian.com/fr/agile/scrum/backlogs">zastojanje</a></p> </div> </div> <div class="sect2"> <h3 id="_радионица_7_техника_и_архитектура">Радионица 7: Техника и архитектура</h3> </div> </div> </div> https://cheroliv.com/blog/2022/0053_memo_kotlin_post.html Sun, 29 May 2022 00:00:00 +0000 blog/2022/0053_memo_kotlin_post.html <div class="sect1"> <h2 id="_dobri_linkovi">Dobri linkovi</h2> <div class="sectionbody"> <div class="paragraph"> <p><a href="https://play.kotlinlang.org/">kotlinlang igralište</a>+</p> </div> <div class="paragraph"> <p><a href="https://arrow-kt.io/">arrow.kt</a>+</p> </div> <div class="paragraph"> <p><a href="https://arkivanov.github.io/MVIKotlin/">MVI:Model pogled namjera</a><br></p> </div> <div class="paragraph"> <p><a href="https://github.com/arkivanov/Essenty">главно</a>+</p> </div> <div class="paragraph"> <p><a href="https://arkivanov.github.io/Decompose/">rasloži</a>+</p> </div> </div> </div> <div class="sect1"> <h2 id="_разноразно_парче_кода">Разноразно парче кода</h2> <div class="sectionbody"> <div class="sect2"> <h3 id="_map_reduce">map reduce</h3> <div class="paragraph"> <p>Konvertovati listu bajtova u listu stringova i sažeti listu stringova<br> у низу који садржи конкатенацију. Kako logger request poslat(requestBodyContent:byte[])</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">log.info( requestBodyContent!!.map { it.toInt().toChar().toString() } .reduce { request: String, s: String -> request + s } )</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_enum_i_zaključene_klase">enum i zaključene klase</h3> <div class="paragraph"> <p>post: <a href="0038_training_kotlin_enum_sealed_class_post">obuka kotlin enum zaključen klasa</a></p> </div> </div> <div class="sect2"> <h3 id="_функционални_интерфејс_и_референца_методе">функционални интерфејс и референца методе</h3> <div class="paragraph"> <p>Možemo da preobrazimo entitet u model domena DTO sa referentnom metodom (funkcionalni stil - Java 8)</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">fun findAllByLoginNot( pageable:Pageable, login:String) :Page<UserDto> { return userDao.findAllByLoginNot( pageable, login).map(::fromEntity) }</code></pre> </div> </div> <div class="paragraph"> <p>jedanhttps://stackoverflow.com/a/22245383/837404[добра објашњење]</p> </div> </div> <div class="sect2"> <h3 id="_uhvati_standardni_izlaz">Uhvati standardni izlaz</h3> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">package functional import java.io.ByteArrayOutputStream import java.io.PrintStream import java.lang.System.out import java.lang.System.setOut import kotlin.test.AfterTest import kotlin.test.BeforeTest import kotlin.test.Test import kotlin.test.assertEquals class BasicsHOF { private val standardOut: PrintStream? = out private val outputStreamCaptor = ByteArrayOutputStream() @BeforeTest fun setUp() = setOut(PrintStream(outputStreamCaptor)) @AfterTest fun tearDown() = setOut(standardOut) @Test fun `three times dope`() { 3.times { println("Hello") } assertEquals( buildString { repeat(3) { append("Hello\n") } deleteAt(length - 1) }, outputStreamCaptor .toString() .trim() ) } fun Int.times(fn: () -> Unit) = (1..this).forEach { _ -> fn() } }</code></pre> </div> </div> </div> <div class="sect2"> <h3 id="_koje_je_razlika_u_kotlinu_između_apply_run_let_also_use_i_with">Koje je razlika u Kotlinu između apply, run, let, also, use i with?</h3> <div class="paragraph"> <p><strong>Poređenje Kotlin funkcija i korišćenje lambda oblika Reference</strong></p> </div> </div> </div> </div> <div class="sect1"> <h2 id="_primeni">primeni</h2> <div class="sectionbody"> <div class="paragraph"> <div class="title">Увод Kotlin funkcije`apply`, <code>run</code>, <code>let</code>, <code>also</code>, <code>use</code>, et `with`pružaju različite načine za obradu objekata. Svaka ima svoje slučajeve korišćenja i ponašanje. Dodatno, lambda reference oblika omogućavaju da kod bude čitljiviji i ponovnog korišćenja kroz referenciranje na postojeće lambda funkcije.</div> <p>Funkcija`apply`se koristi za podešavanje objekta tokom njegovog kreiranja. Vraća objekat na kom je pozvana.</p> </div> <div class="paragraph"> <p>Пример са lambda референцом</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val someObject = SomeClass().apply(::configureObject)</code></pre> </div> </div> <div class="paragraph"> <p>Пример са ламбда :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val someObject = SomeClass().apply { // configuration des propriétés de someObject }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_pokreni">pokreni</h2> <div class="sectionbody"> <div class="paragraph"> <p>Funkcija`run`Se koristi za izvršavanje bloka koda na objektu i vraća rezultat bloka koda.</p> </div> <div class="paragraph"> <p>Primer sa lambda reference :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val result = someObject.run(::someFunction)</code></pre> </div> </div> <div class="paragraph"> <p>Пример са lambda :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val result = someObject.run { // bloc de code à exécuter sur someObject // la dernière expression est renvoyée }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_let">let</h2> <div class="sectionbody"> <div class="paragraph"> <p>Funkcija`let`Koristi se za izvršavanje bloka koda na objektu i vraća rezultat bloka koda.</p> </div> <div class="paragraph"> <p>Пример са lambda reference :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val result = someObject.let(::processObject)</code></pre> </div> </div> <div class="paragraph"> <p>Пример са лямбда :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val result = someObject.let { // bloc de code à exécuter sur someObject // la dernière expression est renvoyée }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_takođe">takođe</h2> <div class="sectionbody"> <div class="paragraph"> <p>Функција`also`se koristi za izvršenje dodatne akcije nad objekatom i vraća objekat na kojem je pozvana.</p> </div> <div class="paragraph"> <p>Primer sa lambda referencom</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">someObject.also(::performAdditionalAction)</code></pre> </div> </div> <div class="paragraph"> <p>Пример са ламбда :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">someObject.also { // action additionnelle sur someObject }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_koristi">koristi</h2> <div class="sectionbody"> <div class="paragraph"> <p>Funkcija`use`se koristi za rad sa resursima koje je potrebno zatvoriti nakon korišćenja. Automatski poziva funkciju`close`na kraju bloka.</p> </div> <div class="paragraph"> <p>Primer sa lambda referencom :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">someResource.use(::useResource)</code></pre> </div> </div> <div class="paragraph"> <p>Пример са ламбда :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">someResource.use { // travailler avec la ressource }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_са">са</h2> <div class="sectionbody"> <div class="paragraph"> <p>funkcija`with`se koristi za pozivanje više metoda na objektu bez ponavljanja imena i vraća rezultat poslednje izraza.</p> </div> <div class="paragraph"> <p>Primer sa lambda referencom :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val result = with(someObject, ::processWithObject)</code></pre> </div> </div> <div class="paragraph"> <p>Пример са lambda :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">val result = with(someObject) { // appeler des méthodes sur someObject // la dernière expression est renvoyée }</code></pre> </div> </div> <div class="paragraph"> <p>Korišćenjem oblika lambda referenca ili blokova`{}`, Možete enkapsulirati logiku u zasebne funkcije, poboljšavajući čitljivost i ponovnu upotrebu koda.</p> </div> <div class="paragraph"> <p>Да ли let враћа објекат са побоследствима које су извршене над њим или у почетном стању улаза зависимо од let ?</p> </div> </div> </div> <div class="sect1"> <h2 id="_let_function_u_kotlin">let Function u Kotlin</h2> <div class="sectionbody"> <div class="paragraph"> <p>Funkcija`let`u Kotlin se koristi za izvođenje operacija nad objektom i vraćanje različitog rezultata. Ipak, važno je napomenuti da funkcija`let`Ne menja početno stanje objekta na kojoj je pozvana.</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Potpis</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><code>inline fun <T, R> T.let(block: (T) → R): R</code></p></td> </tr> </tbody> </table> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Употреба</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Функција`let`Често се користи за примену трансформација на објекат и добијање резултата базираног на тим трансформацијама.</p></td> </tr> </tbody> </table> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Резултат</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Vrednost vraćena funkcijom`let`je rezultat lambda izraza prosleđen kao argument, običajno je rezultat operacija izvršenih nad objektom.</p></td> </tr> </tbody> </table> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 50%;"> <col style="width: 50%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Spoljni efekti</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Iako je funkcija`let`Može da ima stranih efekata na objekat kada se koristi u lambda izrazu, ali ne menja početno stanje objekta samog.</p></td> </tr> </tbody> </table> <div class="paragraph"> <p>Stoga, funkcija`let`Ово је елегантан начин да се изврше операције над објектом, док се добије изведени резултат, док се чува интегритет оригиналног објекта.</p> </div> </div> </div> https://cheroliv.com/blog/2022/0052_memo_jvm_post.html Sat, 28 May 2022 00:00:00 +0000 blog/2022/0052_memo_jvm_post.html <div class="sect1"> <h2 id="toc">Садржај</h2> <div class="sectionbody"> <div class="olist arabic"> <ol class="arabic"> <li> <p><a href="#char">stringovi i karakteri</a></p> </li> <li> <p><a href="#math">brojevi i matematika</a></p> </li> <li> <p><a href="#date">datumi i vremena</a></p> </li> <li> <p><a href="#java8date">datumi i sati java8</a></p> </li> <li> <p><a href="#arrCol">tabele i zbirke</a></p> </li> <li> <p><a href="#sysProp">System.Properties</a></p> </li> <li> <p><a href="#threads">Niti</a></p> </li> <li> <p><a href="#regex">Regularni izrazi</a></p> </li> </ol> </div> </div> </div> <div class="sect1"> <h2 id="char">stringovi i karakteri</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">import java.text.Collator import java.util.* import kotlin.test.* class StringsTest { @Test fun `chaines de caractères et caractères`() { //inférence de type val s = "C'est" assertEquals("C'est", s) //concaténation val t: String = s + " le moment." assertEquals("C'est le moment.", t) // StringBuilder val t1: String = s + buildString { append(" le moment.") } assertEquals("C'est le moment.", t1) //interpolation val t2 = "$s le moment." assertEquals("C'est le moment.", t2) //multiligne chaine de caractères val t3 = """$s le moment.""" assertEquals("C'est le moment.", t3) //conversion de type val t4 = t + " " + 23.4 assertEquals("C'est le moment. 23.4", t4) val t5 = 'C'.toString() assertEquals("C", t5) //taille de la chaine de caractères assertEquals(16, t.length) //sous-chaine d'une chaine de caractères //retourne une chaine de caractères contenant, //les caractères aux positions x à y-1 //sub = t.substring(x, y) //t = "C'est le moment." //retourne les caractères 6 et 7 var sub = t.substring(6, 8) assertEquals("le", sub) //retourne les caractères 0 à 4 sub = t.substring(0, 5) assertEquals("C'est", sub) //la longueur d'une sous-chaine est toujours égale (y-x) val numChars = sub.length assertEquals(5 - 0, numChars) //extraction des caractères d'une chaine assertEquals('e', t.elementAt(2)) assertEquals('e', t.get(2)) assertEquals('e', t[2]) //conversion d'une chaine en tableau de caractères val ca = t.toCharArray() assertEquals(t.length, ca.size) t.mapIndexed { index, char -> assertEquals(char, ca[index]) } //place les 4 premiers caractères de t1 //dans le tableau ca a la position 2 (t as java.lang.String).getChars( /* srcBegin = */ 0, /* srcEnd = */ 3, /* dst = */ ca, /* dstBegin = */ 1 ) assertEquals("CC'et le moment.", String(ca)) //colle tous les caractères dans un meme string assertEquals("CC'et le moment.", ca.concatToString()) //to lower case assertEquals("c'est le moment.", t.toLowerCase()) assertEquals("c'est le moment.", t.lowercase()) //to upper case assertEquals("C'EST LE MOMENT.", t.toUpperCase()) assertEquals("C'EST LE MOMENT.", t.uppercase()) //comparaison de chaines de caractères //t = "C'est le moment." assertFalse(t.equals("hello")) assertFalse(t == "hello") //ignore la casse assertTrue(t.equalsIgnoreCase("C'EST LE MOMENT.")) assertTrue(t.equals("C'EST LE MOMENT.", ignoreCase = true)) //démarre par assertTrue(t.startsWith("C'est")) //se finit par assertTrue(t.endsWith("le moment.")) //compareTo //retourne une valeur < 0, car s est //alphabétiquement avant "N'est" val r1: Int = s.compareTo("N'est") assertTrue(r1 < 0) //variante ignorant la casse val r1Prime: Int = (s as java.lang.String).compareToIgnoreCase("n'est") assertTrue(r1Prime < 0) //retourne 0 si les chaines sont equivalente val r2: Int = s.compareTo("C'est") assertEquals(0, r2) //retourne une valeur > 0 car s vient apres "B'est" val r3: Int = s.compareTo("B'est") assertTrue(r3 > 0) //Recherche de caractères et de sous-chaines de caractères //recherche de caractères //position du premier caractères 't' var pos = t.indexOf('t') assertEquals(4, pos) //position du suivant pos = t.indexOf('t', pos + 1) assertEquals(14, pos) //retour d'érreur -1 si absence de suivant pos = t.indexOf('t', pos + 1) assertEquals(-1, pos) //position du dernier 't' dans la chaine: 14 pos = t.lastIndexOf('t') assertEquals(14, pos) //recherche de 't' vers l'arrière a partir du caractères 13 pos = t.lastIndexOf('t', pos - 1) assertEquals(4, pos) //recherche de sous-chaines //retourne 2 pos = t.indexOf("est") assertEquals(2, pos) //"est" n'apparait qu'une seule fois: retourne -1 pos = t.indexOf("est", pos + 1) assertEquals(-1, pos) //recherche d'une sous-chaine depuis l'arrière //t = "C'est le moment." //retourne 6 pos = t.lastIndexOf("le ") assertEquals(6, pos) //extrait depuis la position 9, //renvoi toute la chaine après "le " val noun = t.substring(pos + 3) assertEquals(-1, noun.indexOf("le ")) //remplacement de toutes les instances d'un caractère //par un autre caractère //ne fonctionne que avec les caractères, pas les chaines val exclaim: String = t.replace('.', '!') assertEquals('!', exclaim.get(exclaim.length - 1)) assertEquals(exclaim.length - 1, exclaim.indexOf('!')) assertEquals(-1, exclaim.indexOf('.')) //suppression des espaces blancs //au début et à la fin d'une chaine val noextraspaces = t.trim() assertNotEquals(' ', noextraspaces.get(0)) assertNotEquals(' ', noextraspaces.get(noextraspaces.length - 1)) //extraction des instances uniques de chaines de caractères //avec intern() val s1 = s.intern() assertEquals(s, s1) val s2 = "C'est".intern() assertEquals("C'est", s2) assertEquals(s1, s2) //StringBuilder pour manipuler les caractères d'une chaine de caractères //crée un tampon StringBuilder à partir d'une chaine de caractères val b = StringBuilder("N'est") //extrait et définit des caractères individuel du tampon StringBuilder //le caractères à l'index 0 val c: Char = b.get(0) assertEquals('N', c) //modifier le premier caractère de la chaine b.setCharAt(0, 'C') assertEquals(s, b.toString()) //ajouter des données à un StringBuilder b.append(' ') b.append("le moment.") b.append(23) //insère des chaines de caractères ou autre dans le StringBuilder b.insert(6, "pas ") assertEquals("C'est pas le moment.23", b.toString()) //remplace un sous ensemble de caractères //avec une chaine de caractères donnée b.replace(2, 9, "est") assertEquals("C'est le moment.23", b.toString()) //supprime les caractères b.delete(15, 18) assertEquals("C'est le moment", b.toString()) b.deleteCharAt(2) assertEquals("C'st le moment", b.toString()) //insert à la postion 2 et décale reste à droite(sans perte de données) b.insert(2, 'e') //tronque la taille de la donnée b.setLength(5) assertEquals("C'est", b.toString()) //inverse les caractères de la chaine b.reverse() assertEquals("tse'C", b.toString()) //écrase le StringBuilder, pret à etre réutilisé b.setLength(0) assertEquals("", b.toString()) //java.util.StringTokenizer pour fragmenter une chaine //de caractères en un ensemble de mots var st = StringTokenizer(t) //nb d'items encore présentent dans la file assertEquals(3, st.countTokens()) //est ce que il y a encore des items dans la file assertTrue(st.hasMoreTokens()) //récupérer le token courrant assertEquals("C'est", st.nextToken()) assertEquals("le", st.nextToken()) assertEquals("moment.", st.nextToken()) assertFalse(st.hasMoreTokens()) assertEquals(0, st.countTokens()) //extraire des occurences de mots délimités //par des caractères autres que des expaces. val str = "a:b:c:d" st = StringTokenizer(str, ":") assertEquals(4, st.countTokens()) assertTrue(st.hasMoreTokens()) assertEquals("a", st.nextToken()) assertEquals("b", st.nextToken()) assertEquals("c", st.nextToken()) assertEquals("d", st.nextToken()) assertFalse(st.hasMoreTokens()) assertEquals(0, st.countTokens()) //text="C'est le moment." val text = t.toCharArray() var p = 0 //sauter les espaces de tete //pour ramener p à la position du premier caractère imprimable while ((p < text.size) && (Character.isWhitespace(text[p])) ) p++ assertEquals(0, p) assertEquals("C'est le moment.", text.concatToString()) //met le premier mot du texte en majuscule while (p < text.size && Character.isLetter(text[p])) { text[p] = Character.toUpperCase(text[p]) p++ } assertEquals(1, p) assertEquals('C', text[0]) assertTrue(Character.isUpperCase(text[0])) assertFalse(Character.isLetter(text[1])) //comparer des chaines de caractères // avec les contrainte la locale système val col = Collator.getInstance() //le résulat est négatif car chica //est avant chico dans l'ordre alphabétique assertTrue(col.compare("chica", "chico") < 0) } }</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc">Садржај</a></p> </div> </div> </div> <div class="sect1"> <h2 id="math">brojevi i matematika</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">import java.math.BigInteger import java.security.SecureRandom import java.text.NumberFormat import java.util.* import kotlin.test.* class NumbersMathTest { @Test fun `Nombres et Math`() { //Constantes utiles Byte.MIN_VALUE Byte.MAX_VALUE Short.MIN_VALUE Short.MAX_VALUE Float.MIN_VALUE Float.MAX_VALUE Math.PI Math.E val s = "-42" //conversion de chaine de caractères //vers un nombre, si possible. var b: Byte = java.lang.Byte.parseByte(s) var sh: Short = java.lang.Short.parseShort(s) var i: Int = java.lang.Integer.parseInt(s) var l: Long = java.lang.Long.parseLong(s) var f: Float = java.lang.Float.parseFloat(s) var d: Double = java.lang.Double.parseDouble(s) //valeur exacte val f_exac = java.lang.Float.valueOf(s) val d_exac = java.lang.Double.valueOf(s) //les routines de conversions entière gérent //les nombres dans diverses bases. //1011 en binare est égal a 11 en base dix b = java.lang.Byte.parseByte("1011", 2) assertEquals(11, b) //ff en base 16(hexa) est égal à 255 en base dix. sh = java.lang.Short.parseShort("ff", 16) assertEquals(255, sh) //la méthode valueOf() peut gérer des bases arbitraires. i = java.lang.Integer.valueOf("egg", 17).toInt() assertEquals(4334, i) //la méthode decode() gére les representations octale, //décimal, hexadécimal, en fonction du préfixe numérique //de la chaine de caractères //un 0 de tete signifie base 8 //un 0x de tete signifie base 16 //les autres sont en base 10 val sho = java.lang.Short.decode("0377") //la classe Integer peut convertir les nombres //en diverses chaines de caractères. val decimal = java.lang.Integer.toString(42) assertEquals("42", decimal) val decimal_ = 42.toString() assertEquals("42", decimal_) val binary = java.lang.Integer.toBinaryString(42) assertEquals("101010", binary) val octal = java.lang.Integer.toOctalString(42) assertEquals("52", octal) val hex = java.lang.Integer.toHexString(42) assertEquals("2a", hex) val base36 = java.lang.Integer.toString(42, 36) assertEquals("16", base36) val base36_ = 42.toString(36) assertEquals("16", base36_) //java.text.NumberFormat effectue la conversion // d'une maniere spécifique aux parametres locaux //sans parametre prend la local systeme comme reference val nf = NumberFormat.getNumberInstance(Locale.FRANCE) val formatted_number = nf.format(9876543.21) assertNotEquals("9876543.21", formatted_number) //parse la chaine de caractères en fonction des parametres locaux(fr) val n = nf.parse("1234567,89") assertEquals(1234567.89, n) //les valeurs monétaires sont parfois formaté // d'une maniere differente des nombres val money_format = NumberFormat.getCurrencyInstance(Locale.FRANCE) assertEquals("123,40 €", money_format.format(1234.56)) //java.lang.Math d = Math.toRadians(27.0) d = Math.cos(d) d = Math.sqrt(d) d = Math.log(d) d = Math.exp(d) d = Math.pow(10.0, d) d = Math.atan(d) d = Math.toDegrees(d) //arrondi au dessus val up = Math.ceil(d) //arrondi au dessous val down = Math.floor(d) //arrondi au plus près val nearest = Math.round(d) //java.lang.Math.Random() val r = Math.random() assertTrue(r >= 0.0 && r < 1.0) //créé un nouvel objet Random, en l'initialisant //avec l'heure courante val generator = java.util.Random(System.currentTimeMillis()) //prochaine valeur aléatoire de taille double d = generator.nextDouble() assertTrue((d >= 0.0) && (d < 1.0)) //prochaine valeur aléatoire de taille float f = generator.nextFloat() assertTrue((f >= 0.0) && (f < 1.0)) //prochaine valeur aléatoire de taille long l = generator.nextLong() assertTrue( (Math.abs(l) <= Long.MAX_VALUE) && (Math.abs(l) >= 0) ) //prochaine valeur aléatoire de taille int i = generator.nextInt() assertTrue( (Math.abs(i) <= java.lang.Integer.MAX_VALUE) && (Math.abs(i) >= 0) ) val limit = 100 //prochaine valeur aléatoire de taille int //la limit max du ramdom est ramené à limit //et la limit min est 0 i = generator.nextInt(limit) assertTrue(i in 0 until limit) //prochaine valeur aléatoire de taille booléen val bool = generator.nextBoolean() assertNotNull(bool) //valeur moyenne 0.0, déviation standard 1.0 d = generator.nextGaussian() //randoms bytes //rempli un tableau avec des valeurs byte aléatoires val b_arr = ByteArray(128) generator.nextBytes(b_arr) b_arr.iterator().forEachRemaining { assertTrue( it <= Byte.MAX_VALUE && it >= Byte.MIN_VALUE ) } //java.security.SecureRandom pour les nombres aléatoires //utilisé en cryptographie val secure_generator = SecureRandom() //le générateur génère sa propre tete de liste sur 16 octets secure_generator.setSeed(secure_generator.generateSeed(16)) val sec_b_arr = ByteArray(128) secure_generator.nextBytes(sec_b_arr) sec_b_arr.iterator().forEachRemaining { assertTrue( it <= java.lang.Byte.MAX_VALUE && it >= java.lang.Byte.MIN_VALUE ) } //java.math.BigDecimal java.math.BigInteger //pour travailler sur des grandes valeurs. //calcule de la factorielle de 1000 var total = BigInteger.valueOf(1) (2..1000).forEach { total = total.multiply(BigInteger.valueOf(it.toLong())) } assertTrue(total.toString().length == 2568) } }</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc">Садржај</a></p> </div> </div> </div> <div class="sect1"> <h2 id="date">datumi i vremena</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">import java.text.DateFormat import java.text.SimpleDateFormat import java.time.Instant import java.util.* import kotlin.test.Test import kotlin.test.assertEquals import kotlin.test.assertTrue class DatesHoursTest { @Test fun `Dates et heures`() { //l'heure courante en millisecondes val t0 = System.currentTimeMillis() //une autre représentation de la meme information val now = java.util.Date() //converti un objet java.util.Date en une valeur long. val t1 = now.getTime() assertTrue(t1 > Instant.EPOCH.toEpochMilli()) //kotlin property access syntaxe style val t1_prime = now.time //java.text.DateFormat //affiche la date d'aujourd'hui en utilisant le format //par défaut des parametres locaux val defaultDateFormat = DateFormat.getDateInstance() //personnalisation du formatage et de la locale val df = DateFormat.getDateInstance(DateFormat.LONG, Locale.FRANCE) val localeFormattedDate = df.format(Date()) //constantes pour les styles de pattern de formatage assertEquals(0, DateFormat.FULL) assertEquals(1, DateFormat.LONG) assertEquals(2, DateFormat.MEDIUM) assertEquals(3, DateFormat.SHORT) assertEquals(2, DateFormat.DEFAULT) //utilise pour l'heure un format abrégé avec //des parametres personnalisés val tf = DateFormat.getTimeInstance( DateFormat.SHORT, Locale.FRANCE ) //affiche l'heure en utilisant le format de tf val shortTime = tf.format(Date()) assertTrue(shortTime.contains(':')) //affiche la date et l'heure en utilisant //un format détaillé val longTimeStamp = DateFormat.getDateTimeInstance( DateFormat.FULL, DateFormat.FULL, ) assert(longTimeStamp.format(Date()).isNotEmpty()) //utilisez java.text.SimpleDateFormat //pour définir votre propre modele de formatage val customFormat = SimpleDateFormat("yyyy.MM.dd") assertEquals(10, customFormat.format(Date()).length) //DateFormat peut également parser les date contenu dans des chaines val kotlinAnnounceDate = customFormat.parse("2019.05.08") //la class Date et sa représentation en millisecondes //n'autorise qu'une forme trés simple d'arithmétique //on ajoute 3 600 000 millisecondes à l'heure courante val anHourFromNow = now.getTime() + (60 * 60 * 1000) assert(anHourFromNow > now.getTime()) //java.util.Calendar //pour manipuler les dates et heures de facon plus sophistiquée //instanciation selon les parametres locaux //et le fuseau horaire local val calendar = Calendar.getInstance() //initialisation du calendrier à la date de maintenant calendar.setTime(now) //détermine le jour de l'année auquel correspond la date courante val dayOfYear = calendar.get(Calendar.DAY_OF_YEAR) assert(dayOfYear < 366) //réinitialisation de la date courante calendar.set(2019, Calendar.MAY, 8) assertEquals(4, calendar.get(Calendar.DAY_OF_WEEK)) //à quel jour du mois correspond le deuxieme mercredi de mai 2019 //set(key,value) calendar.set(Calendar.YEAR, 2019) calendar.set(Calendar.MONTH, Calendar.MAY) calendar.set(Calendar.DAY_OF_WEEK, Calendar.WEDNESDAY) //defini à quel (n=2) semaine du mois est la date calendar.set(Calendar.DAY_OF_WEEK_IN_MONTH, 2) //extrait le jour du mois val dayOfMonth = calendar.get(Calendar.DAY_OF_MONTH) assertEquals(8, dayOfMonth) calendar.setTime(kotlinAnnounceDate) //ajoute 30j à la date calendar.add(Calendar.DATE, 30) val monthAfter = calendar.getTime() //date est elle avant ou apres? assertTrue(monthAfter.after(kotlinAnnounceDate)) } }</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc">Садржај</a></p> </div> </div> </div> <div class="sect1"> <h2 id="java8date">datumi i sati java8</h2> <div class="sectionbody"> <div class="paragraph"> <p>Java 8 uvodi novi paket <strong><em>java.time</em></strong>, koji sadrži osnovne klase koje<br> Большинство програмера рада са. Takodje sadrži četiri podpaketa:<br></p> </div> <div class="paragraph"> <p><strong><em>java.time.chrono</em></strong><br> alternativne kronologije koje programeri koji koriste sisteme kalendara koji ne<br> Praćenje norme ISO će interagirati sa. Primer bi bio japanski kalendar<br> sistem izdržljiv.<br> <strong><em>java.time.format</em></strong><br> Sadrži DateTimeFormatter korišćen za konvertovanje objekata datuma i vremena<br> у једном низу и такође за анализу низова у објектима података и времена<br> <strong><em>java.time.temporal</em></strong><br> Содржи интерфесове који су потребни основним класама за датум и време и такође<br> апстракције (на пример, упити и ажуратори) за напредне операције са датумима.<br> <strong><em>java.time.zone</em></strong><br> Klase koje se koriste za osnovna pravila vremenskog pojas;<br> Većina programera neće imati potrebu za ovaj paket.<br></p> </div> <div class="imageblock"> <div class="content"> <img src="../../img/java8-date-time.png" alt="java8 date time"> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">import java.time.LocalDate import java.time.Month import java.time.Period import java.time.YearMonth import java.time.temporal.* import java.util.HashMap import java.util.stream.Collectors import kotlin.test.Test class DatesHoursJava8Test { class BirthdayDiary { private val birthdays: MutableMap<String, LocalDate> init { birthdays = HashMap() } fun addBirthday( name: String, day: Int, month: Int, year: Int ): LocalDate { val birthday: LocalDate = LocalDate.of(year, month, day) birthdays[name] = birthday return birthday } fun getBirthdayFor(name: String): LocalDate? { return birthdays[name] } fun getAgeInYear(name: String, year: Int): Int { val period: Period = Period.between( birthdays[name], birthdays[name]!!.withYear(year) ) return period.getYears() } fun getFriendsOfAgeIn(age: Int, year: Int): Set<String> { return birthdays.keys.stream() .filter { p: String -> getAgeInYear(p, year) == age } .collect(Collectors.toSet()) } fun getDaysUntilBirthday(name: String): Int { val period: Period = Period.between( LocalDate.now(), birthdays[name] ) return period.getDays() } fun getBirthdaysIn(month: Month): Set<String> { return birthdays.entries.stream() .filter { (_, value): Map.Entry<String, LocalDate> -> value.getMonth() === month } .map<String> { (key): Map.Entry<String, LocalDate> -> key } .collect(Collectors.toSet()) } val birthdaysInCurrentMonth: Set<String> get() = getBirthdaysIn(LocalDate.now().getMonth()) val totalAgeInYears: Int get() = birthdays.keys.stream() .mapToInt { p: String -> getAgeInYear( p, LocalDate.now().getYear() ) } .sum() } //Les ajusteurs modifient les objets de date et d'heure. Supposons, par exemple, que nous voulions //renvoie le premier jour d'un trimestre qui contient un horodatage particulier : class FirstDayOfQuarter : TemporalAdjuster { override fun adjustInto(temporal: Temporal): Temporal? { val currentQuarter: Int = YearMonth.from(temporal) .get(IsoFields.QUARTER_OF_YEAR) return when (currentQuarter) { 1 -> LocalDate.from(temporal) .with(TemporalAdjusters.firstDayOfYear()) 2 -> LocalDate.from(temporal) .withMonth(Month.APRIL.value) .with(TemporalAdjusters.firstDayOfMonth()) 3 -> LocalDate.from(temporal) .withMonth(Month.JULY.value) .with(TemporalAdjusters.firstDayOfMonth()) 4 -> LocalDate.from(temporal) .withMonth(Month.OCTOBER.value) .with(TemporalAdjusters.firstDayOfMonth()) else -> null } } } enum class Quarter { FIRST, SECOND, THIRD, FOURTH } //Dans quel trimestre de l'année cette date se situe-t-elle ? class QuarterOfYearQuery : TemporalQuery<Quarter> { override fun queryFrom(temporal: TemporalAccessor): Quarter { val now = LocalDate.from(temporal) return if (now.isBefore(now.with(Month.APRIL).withDayOfMonth(1))) Quarter.FIRST else if (now.isBefore( now.with(Month.JULY) .withDayOfMonth(1) ) ) Quarter.SECOND else if (now.isBefore( now.with(Month.NOVEMBER) .withDayOfMonth(1) ) ) Quarter.THIRD else Quarter.FOURTH } } @Test fun `Dates et heures après java 8`() { val today = LocalDate.now() val currentMonth = today.month val firstMonthOfQuarter = currentMonth.firstMonthOfQuarter() val q = QuarterOfYearQuery() // Direct var quarter: Quarter? = q.queryFrom(LocalDate.now()) println(quarter) // Indirect quarter = LocalDate.now().query(q) println(quarter) val now = LocalDate.now() val fdoq: Temporal = now.with(FirstDayOfQuarter()) println(fdoq) } }</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc">Садржај</a></p> </div> </div> </div> <div class="sect1"> <h2 id="arrCol">tabele i zbirke</h2> <div class="sectionbody"> <div class="imageblock"> <div class="content"> <img src="../../img/collections_classes_inheritance.png" alt="Classes de collections et héritage"> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">package playground.programming import java.util.* import kotlin.test.Test import kotlin.test.assertEquals import kotlin.test.assertFalse import kotlin.test.assertTrue class ArrayCollectionTest { @Test fun `Tableaux, collections`() { //Tableau //java.util.Arrays définit d'utiles méthodes de manipulation de tableaux, //y compris de tri et de recherche au sein d'un tableau val intArray = arrayOf(10, 5, 7, -3) //tri le tableau Arrays.sort(intArray) var pos = Arrays.binarySearch(intArray, 7) //la valeur 7 est trouvé a l'index 2 assertEquals(2, pos) //12 pas trouvé retourne une valeur negative assert(Arrays.binarySearch(intArray, 12) < 0) //les tableaux peuvent également etre triés //et faire l'objet d'une recherche val stringArray = arrayOf("le", "moment", "c'est") assertEquals("c'est", stringArray[2]) assertEquals("le", stringArray[0]) assertEquals("moment", stringArray[1]) Arrays.sort(stringArray) assertEquals("c'est", stringArray[0]) assertEquals("le", stringArray[1]) assertEquals("moment", stringArray[2]) //Arrays.equals() compare tous les éléments de deux tableaux //Arrays.clone() copie tous les elements du tableau dans un autre stringArray.forEachIndexed { i, it -> assertEquals(it, stringArray.clone()[i]) } val data = ByteArray(100) //Arrays.fill() initialise tous les éléments des deux tableaux //initalise tous les éléments à -1 Arrays.fill(data, -1) data.forEach { assertEquals(-1, it) } //attribue aux éléments 5, 6, 7, 8 et 9 la valeur -2 Arrays.fill(data, 5, 10, -2) ((5 until (10 - 1))).forEach { assertEquals(-2, data[it]) } //récupère le type de data val type = data::class.java //est ce que data est un tableau? assertTrue(type.isArray()) //est ce que data est un tableau de byte assertEquals(Byte::class.java, type.getComponentType()) //Collection val s = java.util.HashSet<String>() s.add("test") assertTrue(s.contains("test")) assertFalse(s.contains("test2")) s.remove("test") assertFalse(s.contains("test")) val ss = TreeSet<String>() ss.add("b") ss.add("a") ss.iterator().forEach { assertTrue(it == "a" || it == "b") } //liste doublement chainée var dll: List<String> = LinkedList<String>() //plus efficace val l = java.util.ArrayList<String>() l.addAll(ss) l.addAll(1, ss) val obj = l.get(1) val obj_prime = l[1] assertEquals(obj, obj_prime) l.set(3, "nouvel élément") l.add("test") l.add(0, "test2") l.removeAt(1) l.remove("a") assertFalse(l.contains("a")) l.removeAll(ss) assertFalse(l.containsAll(ss)) assertFalse(l.isEmpty()) assertTrue(l.isNotEmpty()) val sublist = l.subList(1, 3) val elements = l.toArray() l.clear() val m = HashMap<String, Integer>() m.put("clé", Integer(42)) m["clé"] = Integer(42) val value: Integer = m.get("clé")!! assertEquals(Integer(42), value) m.remove("clé") assertTrue(m.isEmpty()) val keys = m.keys assertTrue(keys.isEmpty()) val set = HashSet<String>() set.add("key_1") set.add("key_2") set.add("key_3") val members = set.toArray() assertEquals(3, members.size) val list = ArrayList<String>() list.add("items1") list.add("items2") list.add("items3") val items = list.toArray() assertEquals(3, items.size) //trie et recherche d'éléments sur les collections list.add("clé") //en premier on trie Collections.sort(list) //en kotlin list.sort() //en deuxieme on cherche //retourne l'index du premier trouvé sinon -1 pos = Collections.binarySearch(list, "clé") assertEquals(0, pos) val list1 = mutableListOf(1, 2, 3, 4, 5) val list2 = mutableListOf<Int>(0, 0, 0, 0, 0) //d'autres méthodes intéressantes concernant Collections //copie list1 dans list2, 2e parametre dans 1er parametre Collections.copy(list2, list1) //comparaison de la copy avec filter assertTrue(list1.filterIndexed { i: Int, it: Int -> it != list2[i] }.isEmpty()) //comparaison de la copy avec map list1.mapIndexed { index: Int, it: Int -> assertEquals(it, list2[index]) } //rempli avec des 0 Collections.fill(list2, 0) assertTrue(list2.none { it != 0 }) //le maximum assertEquals(5, Collections.max(list1)) //le minimum assertEquals(1, Collections.min(list1)) //renverse Collections.reverse(list) listOf("items3", "items2", "items1", "clé").mapIndexed { i: Int, it: String -> assertEquals(it, list[i]) } //mélange la list Collections.shuffle(list) //retourne un ensemble immuable possédant un seul élément 0 Collections.singleton(0) //renvoi un emballage immuable autour d'une liste Collections.unmodifiableList(list) //renvoi un emballage synchronisé autour d'une map, ensemble clé valeur Collections.synchronizedMap(m) //java.util.Properties un est objet key value } }</code></pre> </div> </div> <div class="paragraph"> <p>Sačuvaj sve obrnute kod sekvence (<code>…​</code>) tačno kao što jesu — nikada ne menjaj sadržaj obrnute kode, razmake ili poziciju. Ovaj tekst može biti fragment većeg rečenice — prevedi fragment bez traženja dodatnog konteksta. Izlazi samo prevedeni tekst — bez objašnjenja, bez komentaraja, bez uvođenja, bez alternativa, bez opcija. <a href="#toc">Садржај</a></p> </div> </div> </div> <div class="sect1"> <h2 id="sysProp">System.Properties</h2> <div class="sectionbody"> <div class="paragraph"> <p><a href="https://docs.oracle.com/javase/tutorial/essential/environment/sysprop.html">System.Properties službena dokumentacija</a></p> </div> <div class="paragraph"> <p>Ovo je tabela nekog zanimljivih svojstava<br> Ova svojstva su interesantna za dobijanje informacija<br> на хост системе JVM.</p> </div> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3333%;"> <col style="width: 3.3343%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>Ključ</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock"><strong>значење</strong></p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">razdvojnik fajla</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Karakter koji odvoji komponente putanje fajla. Ovo je "/" na UNIX-u i "\" na Windows-u.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">java.class.path</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Putanja koja se koristi za pronalaženje direktorijuma i JAR arhiva koji sadrže datoteke klasa. Elementi putanje za klase odvojjeni su platformsko-specifičnim karakterom specificiranim u svojstvu path.separator.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">java.home</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Instalacioni direktorijum za Java Runtime Environment (JRE)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">java.vendor</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Naziv dobavljača JRE</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">java.vendor.url</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">URL dobavljača JRE</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">java.version</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Broj verzije JRE</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">line.separator</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Niz koji operativni sistem koristi za razdvajanje linija u tekstualnim fajlovima</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">os.arch</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">arhitektura operativnog sistema</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">os.name</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Naziv operativnog sistema</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">os.version</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Verzija operativnog sistema</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">put.separator</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Karakter separatora putanje koji se koristi u java.class.path</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">korisnički direktorijum</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Radni direktorijum korisnika</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">korisnik.kuća</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Kućni direktorijum</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">user.name</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Име налога корисника</p></td> </tr> </tbody> </table> <div class="paragraph"> <p><a href="#toc">Садржај</a></p> </div> </div> </div> <div class="sect1"> <h2 id="threads">Niti</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">import java.text.DateFormat import java.util.* import kotlin.test.Test class ThreadsTest { @Test fun `threads test`() { //java.lang.Thread représente le thread fondamentale de l'API java //il existe deux manière de définir un thread //1) étendre la classe Thread ou une lambda en kotlin //2) implémenter l'interface Runnable, // puis passer une instance de cet objet Runnable au constructeur de Thread. val list1: List<Int> = List( size = 45, init = { (1..31).random() } ) println("list1$list1") //facon 1 val t = Thread { Collections.sort(list1) println("list1 sorted$list1") } t.start() val list2 = List( size = 45, init = { (1..31).random() } ) println("list2$list2") //facon 2 val sorter = BackgroundSorter(list2) sorter.start() //priorité des threads //tant qu'un thread de niveau de priorité supérieure n'est pas fini //alors celui de niveau inférieur ne peut s'exécuter //on définit un thread avec une priorité inférieur à la normale t.setPriority(Thread.NORM_PRIORITY - 1) //ici on définit un thread avec une priorité inférieur à la priorité //du thread courant t.setPriority(Thread.currentThread().getPriority() - 1) //Thread.yield() fait une pause pour laisser les autres threads de meme priorité s'exécuter } class BackgroundSorter(private val l: List<Int>) : Thread() { override fun run() { Collections.sort(l) println("list2 sorted$l") } } //pour l'arrêt du thread, plutôt qu'utiliser la fonction Thread.stop() // qui laisse la memoire dans un état non controlé. //utiliser la méthode tel que l'exemple pleaseStop() class DummyClock( private val df: DateFormat = DateFormat.getTimeInstance(DateFormat.MEDIUM), private var keepRunning: Boolean = true ) : Thread() { init { isDaemon = true start() } override fun run() { while (keepRunning) { println(df.format(Date())) try { sleep(1000) } catch (e: InterruptedException) { println(e.message) } } } fun pleaseStop() { keepRunning = false } } //java.util.Timer //java.util.TimerTask //ces classes permettent l'exécution de taches répétitives @Test fun `Timer et TimerTask test`() { DummyClock() } }</code></pre> </div> </div> <div class="paragraph"> <p><a href="#toc">Садржај</a></p> </div> </div> </div> <div class="sect1"> <h2 id="regex">Regularni izrazi</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">import java.util.* import java.util.regex.Matcher import java.util.regex.Pattern import java.util.stream.Collectors import kotlin.test.Test import kotlin.test.assertEquals class RegularExpressionsTest { @Test fun `expressions régulières`() { val p: Pattern = Pattern.compile("honou?r") val caesarUK = "For Brutus is an honourable man" val mUK: Matcher = p.matcher(caesarUK) assertEquals(true, mUK.find(), "Should matches UK spelling") val caesarUS = "For Brutus is an honorable man" val mUS: Matcher = p.matcher(caesarUS) assertEquals(true, mUS.find(), "Should matches US spelling") } @Test fun `expressions régulières plus complexes`() { //Notez que nous devons utiliser \\ car nous avons besoin d'un littéral \ //et Java utilise un seul \ comme caractère d'échappement var pStr = "\\d" // Un chiffre numérique var text = "Apollo 13" var p = Pattern.compile(pStr) var m = p.matcher(text) print(pStr + " matches " + text + "? " + m.find()) println(" ; match: " + m.group()) pStr = "[a..zA..Z]" //N'importe quelle lettre p = Pattern.compile(pStr) m = p.matcher(text) print(pStr + " matches " + text + "? " + m.find()) println(" ; match: " + m.group()) //N'importe quel nombre de lettres, qui doivent toutes être comprises entre 'a' et 'j' //mais peut-être en majuscule ou en minuscule. pStr = "([a..jA..J]*)" p = Pattern.compile(pStr) m = p.matcher(text) print(pStr + " matches " + text + "? " + m.find()) println(" ; match: " + m.group()) text = "abacab" //'a' suivi de quatre caractères quelconques, suivi de 'b' pStr = "a....b" p = Pattern.compile(pStr) m = p.matcher(text) print(pStr + " matches " + text + "? " + m.find()) println(" ; match: " + m.group()) } @Test fun `Quelles chaînes correspondent à la regex ?`() { val pStr = "\\d" // Un chiffre numérique val p = Pattern.compile(pStr) val ls: List<String> = Arrays.asList("Cat", "Dog", "Ice-9", "99 Luftballoons") val containDigits: List<String> = ls.stream() .filter(p.asPredicate()) .collect(Collectors.toList()) assert(containDigits.contains("Ice-9")) assert(containDigits.contains("99 Luftballoons")) assertEquals(2, containDigits.size) } }</code></pre> </div> </div> <div class="sect2"> <h3 id="_табела_метазнакова_регуларних_израза">Табела метазнакова регуларних израза</h3> <table class="tableblock frame-all grid-all stretch"> <colgroup> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7543%;"> <col style="width: 1.7592%;"> </colgroup> <tbody> <tr> <td class="tableblock halign-left valign-top"><p class="tableblock">метакарактер</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">funkcionalnost</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Notes</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">?</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Opcionalni karakter—nula ili jedna instanca</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">*</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Nula ili više prethodnog karaktera</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">+</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Jedno ili više prethodnih znakova</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">{M,N}</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Između M i N instanci prethodnog znaka</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\d</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">jedna cifra</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\D</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">nenumerički znak</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\w</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Jedan znak reči</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">brojevi, slova i _</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\W</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Karakter bez reči</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\s</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Znak razmaka</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\S</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Jedno ne belo znak</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\n</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">znak za prelom reda</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">\t</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Znak tabulacije</p></td> <td class="tableblock halign-left valign-top"></td> <td class="tableblock halign-left valign-top"><p class="tableblock">.</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Било који знак</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Ne uključuje novu liniju u Javi</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">[ ]</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Svaki karakter sadržan između kvadratnim zagradama</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Pozvana klasa znakova</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">[^ ]</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Svaki znak koji nije između zagrada</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Pozvan invertovana klasa znakova</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">( )</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Изгради групу елемената мотива</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Nazvan grupa (ili grupa za hvatanje)</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">|</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Definisati alternativne mogućnosti</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Implementira logičko ILI</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">^</p></td> <td class="tableblock halign-left valign-top"><p class="tableblock">Početak niza $ Kraj niza</p></td> <td class="tableblock halign-left valign-top"></td> </tr> </tbody> </table> <div class="paragraph"> <p>dopunitihttps://www.codeurjava.com/2015/05/les-expressions-regulieres-avec-regex.html[са]</p> </div> </div> </div> </div> https://cheroliv.com/blog/2022/0047_memo_gradle_post.html Mon, 23 May 2022 00:00:00 +0000 blog/2022/0047_memo_gradle_post.html <div id="toc" class="toc"> <div id="toctitle">Sommaire</div> <ul class="sectlevel1"> <li><a href="#_приказај_помоћ">Приказај помоћ</a></li> <li><a href="#_definiši_sistemsko_svojstvo_jvm_d_system_prop">Definiši sistemsko svojstvo JVM: `-D, --system-prop</a></li> <li><a href="#_definisati_svojstvo_projekta_za_build_script_pmypropmyvalue">Definisati svojstvo projekta za build script: `-Pmyprop=myvalue</a></li> <li><a href="#_navodi_direktorijum_pokretanja_gradle_podrazumevana_vrednost_je_trenutni_direktorijum">Navodi direktorijum pokretanja Gradle. Podrazumevana vrednost je trenutni direktorijum.</a></li> <li><a href="#_preoptereši_svojstvo_param_component_preko_komandne_linije">Preoptereši svojstvo 'param_component' preko komandne linije :</a></li> <li><a href="#_dodati_fasciklu_u_izvorni_skup_u_običnom_projektu_sa_kotlin_dsl_om">Dodati fasciklu u izvorni skup u običnom projektu sa Kotlin DSL-om</a></li> <li><a href="#_додати_фасциклу_изворном_сету_у_пројекту_андроид_помоћу_groovy_dsl">Додати фасциклу изворном сету у пројекту Андроид помоћу Groovy DSL</a></li> <li><a href="#_izbegavati_izgradnju_i_testiranje_podmodula">Izbegavati izgradnju i testiranje podmodula</a></li> <li><a href="#_преузети_акт">Преузети акт</a></li> <li><a href="#_prikazati_zavisnosti_izgradnje">Prikazati zavisnosti izgradnje</a></li> <li><a href="#_пример_употребе_reduce_саберина_листе_у_ниски">Пример употребе reduce : саберина листе у ниски</a></li> <li><a href="#_preuzmi_opis_posebnog_zadatka">Preuzmi opis posebnog zadatka.</a></li> <li><a href="#_za_pokretanje_zadatka_iz_root_workingdir_zatim_prefiksirajte_zadatak_ne">Za pokretanje zadatka iz root workingDir, zatim prefiksirajte zadatak ne `:</a></li> <li><a href="#_поново_покрени_задаче_које_nisu_успеле_користити_опцију_rerun_tasks">Поново покрени задаче које nisu успеле, користити опцију `--rerun-tasks</a></li> <li><a href="#_pokrenuti_jedan_zadatak_u_jednom_specifičnom_projektu_izjednog_drugog_direktorijuma">Pokrenuti jedan zadatak u jednom specifičnom projektu izjednog drugog direktorijuma</a></li> </ul> </div> <div class="sect1"> <h2 id="_приказај_помоћ">Приказај помоћ</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew --help</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_definiši_sistemsko_svojstvo_jvm_d_system_prop">Definiši sistemsko svojstvo JVM: `-D, --system-prop</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew -Dmyprop=myvalue #ou ./gradlew --system-prop myvalue</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_definisati_svojstvo_projekta_za_build_script_pmypropmyvalue">Definisati svojstvo projekta za build script: `-Pmyprop=myvalue</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew -Pmyprop=myvalue #ou ./gradlew --project-prop myvalue</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_navodi_direktorijum_pokretanja_gradle_podrazumevana_vrednost_je_trenutni_direktorijum">Navodi direktorijum pokretanja Gradle. Podrazumevana vrednost je trenutni direktorijum.</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew -p ~/src/next_startup #ou ./gradlew --project-dir ~/src/next_startup</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_preoptereši_svojstvo_param_component_preko_komandne_linije">Preoptereši svojstvo 'param_component' preko komandne linije :</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew -Pparam_component=CUSTOM_VALUE</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_dodati_fasciklu_u_izvorni_skup_u_običnom_projektu_sa_kotlin_dsl_om">Dodati fasciklu u izvorni skup u običnom projektu sa Kotlin DSL-om</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">sourceSets { getByName("test"){ java.srcDir("src/scripts/groovy") } getByName("test"){ java.srcDir("src/scripts/kscript") } getByName("test"){ java.srcDir("src/test/javascript") } }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_додати_фасциклу_изворном_сету_у_пројекту_андроид_помоћу_groovy_dsl">Додати фасциклу изворном сету у пројекту Андроид помоћу Groovy DSL</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">android { sourceSets { main.java.srcDirs += "src/main/../../../../ceelo/domain/src/main/java/" test.java.srcDirs += "src/test/../../../../ceelo/domain/src/test/java/" } }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_izbegavati_izgradnju_i_testiranje_podmodula">Izbegavati izgradnju i testiranje podmodula</h2> <div class="sectionbody"> <div class="paragraph"> <p>gradle build -x :excluded-module:check -x :excluded-module:assemble -x :excluded-module:build</p> </div> <div class="paragraph"> <p>Премештање датотека</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">tasks.register("moveWebappNode") { doLast { ant.withGroovyBuilder { "move"( "webapp/node_modules" to "$rootDir/webapp-src/node_modules", ) } } }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_преузети_акт">Преузети акт</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">tasks.register<Tar>("tarWebapp") { dependsOn("moveWebappNpm") group = WEBAPP description = "tar webapp" doLast { setOf( "build", "target", "node_modules" ).forEach { dir -> exclude { it.name .dir } } archiveFileName.set("webapp.tar") destinationDirectory.set(File("${rootDir.absolutePath}$sep$WEBAPP_SRC")) } }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_prikazati_zavisnosti_izgradnje">Prikazati zavisnosti izgradnje</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">tasks.register("printDependencies") { description = "print project dependencies" group = WEBAPP doLast { println("${project.name} dependencies") mutableMapOf<String, Map<String, String>>( "buildDependencies" to buildDependencies, "domainDeps" to domainDeps, "domainTestDeps" to domainTestDeps, ).apply { putAll(appModules) } .forEach { module -> if (module.value.isNotEmpty()) { println("${module.key}:") module.value.forEach { println(dependency(it)) } println() } } } }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_пример_употребе_reduce_саберина_листе_у_ниски">Пример употребе reduce : саберина листе у ниски</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">tasks.register("printWebappSrc") { description = "print webapp sources" group = WEBAPP doLast { webAppSrc .reduce { acc, s -> "$acc\n\t$s" } .run { println("$WEBAPP_SRC: $this\n") } } }</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_preuzmi_opis_posebnog_zadatka">Preuzmi opis posebnog zadatka.</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew -q help --task foo</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_za_pokretanje_zadatka_iz_root_workingdir_zatim_prefiksirajte_zadatak_ne">Za pokretanje zadatka iz root workingDir, zatim prefiksirajte zadatak ne `:</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew :foo</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_поново_покрени_задаче_које_nisu_успеле_користити_опцију_rerun_tasks">Поново покрени задаче које nisu успеле, користити опцију `--rerun-tasks</h2> <div class="sectionbody"> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew check --rerun-tasks</code></pre> </div> </div> </div> </div> <div class="sect1"> <h2 id="_pokrenuti_jedan_zadatak_u_jednom_specifičnom_projektu_izjednog_drugog_direktorijuma">Pokrenuti jedan zadatak u jednom specifičnom projektu izjednog drugog direktorijuma</h2> <div class="sectionbody"> <div class="paragraph"> <p>opcija`-p` (ou <code>--project-dir</code>) omogućava da se specificira putanja do Gradle projekta i izvrši zadatak u njemu, čak i ako je trenutni direktorijum drugačiji.</p> </div> <div class="paragraph"> <p>На пример, да би се задатак покренуо`build`projekta koji se nalazi u`~/projets/mon-autre-projet`dok se nalazimo u drugom direktorijumu :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">./gradlew -p ~/projets/mon-autre-projet build</code></pre> </div> </div> <div class="paragraph"> <p>Ovo je posebitno korisno za skriptiranje akcija na više projekata s jedne centralne lokacije.</p> </div> <div class="ulist"> <div class="title">види још :</div> <ul> <li> <p><a href="https://docs.gradle.org/current/userguide/command_line_interface.html#sec:command_line_warnings">referenca</a></p> </li> <li> <p><a href="https://docs.gradle.org/current/userguide/command_line_interface.html#sec:command_line_options">referenca</a></p> </li> <li> <p><a href="https://stackoverflow.com/a/36178581/837404">diskusija</a></p> </li> </ul> </div> </div> </div> https://cheroliv.com/blog/2022/0038_training_kotlin_enum_sealed_class_post.html Tue, 17 May 2022 00:00:00 +0000 blog/2022/0038_training_kotlin_enum_sealed_class_post.html <div class="paragraph"> <p>zaključenе klase nisu enumeracije(ključna reč: enum).<br> Dolazeći iz Jave, možda biste bili pokušen da preopteregite svoju enumeraciju doprinosa funkcionalnosti: // Java kod</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-java hljs" data-lang="java">enum PizzaOrderStatus { ORDER_RECEIVED, PIZZA_BEING_MADE, OUT_FOR_DELIVERY, COMPLETED; public PizzaOrderStatus nextStatus() { switch (this) { case ORDER_RECEIVED: return PIZZA_BEING_MADE; case PIZZA_BEING_MADE: return OUT_FOR_DELIVERY; case OUT_FOR_DELIVERY: return COMPLETED; case COMPLETED:return COMPLETED; } } }</code></pre> </div> </div> <div class="paragraph"> <p>Umesto toga, možete koristiti sealed klasu:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">sealed class PizzaOrderStatus(protected val orderId: Int) { abstract fun nextStatus() : PizzaOrderStatus class OrderReceived(orderId: Int) : PizzaOrderStatus(orderId) { override fun nextStatus(): PizzaOrderStatus { return PizzaBeingMade(orderId) } } class PizzaBeingMade(orderId: Int) : PizzaOrderStatus(orderId) { override fun nextStatus(): PizzaOrderStatus { return OutForDelivery(orderId) } } class OutForDelivery(orderId: Int) : PizzaOrderStatus(orderId) { override fun nextStatus(): PizzaOrderStatus { return Completed(orderId) } } class Completed(orderId: Int) : PizzaOrderStatus(orderId) { override fun nextStatus(): PizzaOrderStatus { return this } } }</code></pre> </div> </div> <div class="paragraph"> <p>Предност овог приступа је то што можемо сада дапреносимо податке са status:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">var status: PizzaOrderStatus = OrderReceived(123) while (status !is Completed) { status = when (status) { is OrderReceived -> status.nextStatus() is PizzaBeingMade -> status.nextStatus() is OutForDelivery -> status.nextStatus() is Completed -> status } }</code></pre> </div> </div> <div class="paragraph"> <p>Općenito, zatvorene klase su dobre ako želite da imate podatke povezane sa jednim Država.</p> </div> https://cheroliv.com/blog/2022/0036_training_kotlin_post.html Thu, 12 May 2022 00:00:00 +0000 blog/2022/0036_training_kotlin_post.html <div class="sect1"> <h2 id="_uma_mapa">uma mapa</h2> <div class="sectionbody"> <div class="paragraph"> <p><span class="image"><img src="../../diagram/training_kotlin.png" alt="training_kotlin"></span></p> </div> </div> </div> <div class="sect1"> <h2 id="_функционално_програмирање">Функционално програмирање</h2> <div class="sectionbody"> <div class="paragraph"> <p>Вежбе су узете из књиге:<br> Funkcionalno programiranje u Kotlinu kroz tutorijale<br> Написано од Массимо Карли<br> repozitorijum: <a href="https://github.com/kodecocodes/fpk-materials" class="bare">https://github.com/kodecocodes/fpk-materials</a></p> </div> <div class="sect2"> <h3 id="_синтакса">Синтакса</h3> <div class="sect3"> <h4 id="_firstprogramtest">FirstProgramTest</h4> <div class="paragraph"> <p>pojmovi: prikaz na ekranu, funkcija<br> FirstProgramTest:https://github.com/cheroliv/cheroliv.com/blob/master/codes/src/test/kotlin/programming/FirstProgramTest.kt[izvor]<br></p> </div> </div> <div class="sect3"> <h4 id="_concatfunctiontest">ConcatFunctionTest</h4> <div class="paragraph"> <p>notions: memorija, promenljiva, vrednost, objekat, proširenje funkcije<br> ExampleUnitTest:https://github.com/cheroliv/cheroliv.com/blob/master/codes/src/test/kotlin/programming/ConcatFunctionTest.kt[извор]+</p> </div> </div> <div class="sect3"> <h4 id="_birthdaymessagetestoutput">BirthdayMessageTestOutput</h4> <div class="paragraph"> <p>pojmovi: skupovi, petlje<br> <a href="https://developer.android.com/codelabs/basic-android-kotlin-training-first-kotlin-program?continue=https%3A%2F%2Fdeveloper.android.com%2Fcourses%2Fpathways%2Fandroid-basics-kotlin-one%23codelab-https%3A%2F%2Fdeveloper.android.com%2Fcodelabs%2Fbasic-android-kotlin-training-first-kotlin-program">Uvod u Kotlin</a><br> RođendanPorukaTestIzlaz:https://github.com/cheroliv/cheroliv.com/blob/master/codes/src/test/kotlin/programming/BirthdayMessageTestOutput.kt[</think> </think></p> </div> <div class="paragraph"> <p>(Note: Since no actual source text was provided, there is nothing to translate.)]+</p> </div> </div> </div> <div class="sect2"> <h3 id="_курс_kotlin">Курс Kotlin</h3> <div class="videoblock"> <div class="content"> <iframe src="https://www.youtube.com/embed/YRjY3jRrQYY?rel=0" frameborder="0" allowfullscreen></iframe> </div> </div> </div> <div class="sect2"> <h3 id="_tutorijal_o_kolekcijama_u_javi">Tutorijal o kolekcijama u Javi</h3> <div class="paragraph"> <p><a href="https://docs.oracle.com/javase/tutorial/collections/index.html" target="_blank" rel="noopener">Kolekcije</a></p> </div> <div class="paragraph"> <p>Srce interfejsa kolekcije<br> <span class="image"><img src="../../img/0036_training_kotlin_post/colls-coreInterfaces.gif" alt="Колекcije"></span><br></p> </div> </div> <div class="sect2"> <h3 id="_osnovni_funkcionalni">Osnovni funkcionalni</h3> <div class="sect3"> <h4 id="_deklarativni_x_imperativni_pristup">Deklarativni X imperativni pristup</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">package functional import kotlin.test.Test import kotlin.test.assertEquals class DeclarativeTests { val input = listOf( "123", "abc", "1ds", "987", "abdf", "1d3", "de1", "88", "101" ) fun imperativeSum(list: List<String>): Int { var sum = 0 for (item in list) { try { sum += item.toInt() } catch (_: NumberFormatException) { } } return sum } @Test fun `test imperative approach`() { imperativeSum(input).run { println("Sum $this") assertEquals(1299, this) } } fun isValidNumber(s: String) = try { s.toInt() true } catch (_: NumberFormatException) { false } fun declarativeSum(list: List<String>) = list .filter(::isValidNumber) .map(String::toInt) .sum() @Test fun `test declarative approach`() { assertEquals(1299, declarativeSum(input).apply { println("Sum $this") }) } }</code></pre> </div> </div> </div> <div class="sect3"> <h4 id="_vježba_1_1">Vježba 1.1</h4> <div class="paragraph"> <p>Implementiraj funkciju sumInRange, koja sabira vrednosti u<br> jedna List<String> u datom intervalu. Potpis je:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">fun sumInRange(input: List<String>, range: IntRange): Int</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `Exercise 1_1`() { assertEquals(4, sumInRange( listOf("1", "10", "a", "7", "ad2", "3"), 1..5 ).apply { println("sumInRange 1..5: $this") } ) }</code></pre> </div> </div> <div class="paragraph"> <p>Pokušajte ga i proverite svoj odgovor sahttps://github.com/cheroliv/cheroliv.com/blob/master/codes/src/test/kotlin/functional/DeclarativeTests.kt[решение, prozori="_blank].</p> </div> </div> <div class="sect3"> <h4 id="_funkcije_višeg_reda">Funkcije višeg reda</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">package functional import java.io.ByteArrayOutputStream import java.io.PrintStream import java.lang.System.* import java.lang.Thread.sleep import kotlin.math.sign import kotlin.test.Test import kotlin.test.assertEquals class BasicsHOFTests { val ONE_SECOND = 1000L @Test fun `high order function`() { //capture de la sortie standard val standardOut: PrintStream? = out val outputStreamCaptor = ByteArrayOutputStream() setOut(PrintStream(outputStreamCaptor)) 3.times { println("Hello") } assertEquals( buildString { repeat(3) { append("Hello\n") } deleteAt(length - 1) }, outputStreamCaptor .toString() .trim() ) //libération de la sortie standard setOut(standardOut) } fun Int.times1(fn: () -> Unit) { for (i in 1..this) { fn() } } fun Int.times2(fn: () -> Unit) { for (i in 1..this) fn() } fun Int.times3(fn: () -> Unit) = (1..this).forEach { fn() } fun Int.times4(fn: () -> Unit) = repeat((1..this).count()) { fn() } fun Int.times(fn: () -> Unit) = (1..this).forEach { _ -> fn() } }</code></pre> </div> </div> </div> <div class="sect3"> <h4 id="_vježba_1_2">Vježba 1.2</h4> <div class="paragraph"> <p>Implementirati chrono, koji prima funkciju tipa`() →`<br> Ulazna jedinica vraća vreme potrebno za izvođenje. Signatura je :<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">fun chrono(fn : () -> Unité) : Long</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `Exercise 1_2`() { val waitOneSec = { sleep(ONE_SECOND) } chrono(waitOneSec).apply { println("chrono: $this") assertEquals(1, sign) } }</code></pre> </div> </div> <div class="paragraph"> <p>Pokušajte ga i proverite svoj odgovor sa lahttps://github.com/cheroliv/cheroliv.com/blob/master/codes/src/test/kotlin/functional/BasicsHOFTests.kt[решение, windows="_blank].</p> </div> </div> <div class="sect3"> <h4 id="_kompozicija">Kompozicija</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">package functional import kotlin.test.Test import kotlin.test.assertEquals fun double(x: Int): Int = 2 * x fun square(x: Int): Int = x * x fun squareAndDouble1(x: Int) = double(square(x)) infix fun <A, B, C> ((A) -> B).compose(g: (B) -> C) : (A) -> C = { a -> g(this(a)) } class CompositionTests { @Test fun composition_impure() { assertEquals(200, double(square(10))) assertEquals(200, squareAndDouble1(10)) } @Test fun composition_pure() { val squareAndDouble = ::square compose ::double assertEquals(200, squareAndDouble(10)) } }</code></pre> </div> </div> </div> <div class="sect3"> <h4 id="_čiste_funkcije_i_testabilnost">Čiste funkcije i testabilnost</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">package functional import java.io.ByteArrayOutputStream import java.io.PrintStream import java.lang.System.out import java.lang.System.setOut import kotlin.test.Test import kotlin.test.assertEquals var count = 0 //impure car une variable global subit un effet de bord fun impure(value: Int): Int { count++ return value + count } //impure car utilisation de la sortie standard qui fait muter le system fun addOneAndLog(x: Int): Int { val result = x + 1 println("New Value is $result") return result } //pure fun addOne(x: Int) = (x + 1).run { Pair(this, "New Value is $this") } class PureTests { @Test fun `impure fonction`() { assertEquals(3, impure(2)) val standardOut = out val outputStreamCaptor = ByteArrayOutputStream() setOut(PrintStream(outputStreamCaptor)) addOneAndLog(3) assertEquals( "New Value is 4", outputStreamCaptor .toString() .trim() ) setOut(standardOut) } @Test fun `pure fonction`() { addOne(3).run { assertEquals(4, first) assertEquals("New Value is 4", second) } } }</code></pre> </div> </div> </div> <div class="sect3"> <h4 id="_обрађивање_искључаја">Обрађивање искључаја</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">package functional import org.junit.jupiter.api.assertThrows import kotlin.Result.Companion.failure import kotlin.Result.Companion.success import kotlin.test.Test import kotlin.test.assertEquals //NumberFormatException est un effet de bord qui rend la fonction impure fun strToInt(str: String) = str.toInt() //pure fun strToIntOrNull(str: String) = try { str.toInt() } catch (nfe: NumberFormatException) { null } //pure avec gestion de l'exception plus élégante fun strToIntResult(str: String): Result<Int> = try { success(str.toInt()) } catch (nfe: NumberFormatException) { failure(nfe) } class ExceptionHandlingTests { @Test fun impure() { assertThrows<NumberFormatException> { strToInt("foo") } assertEquals(1, strToInt("1")) } @Test fun pure() { assertEquals(null, strToIntOrNull("foo")) assertEquals(1, strToIntOrNull("1")) } @Test fun `pure avec result`() { assertEquals(1, strToIntResult("1").getOrNull()) assertEquals( "For input string: \"foo\"", strToIntResult("foo") .exceptionOrNull() ?.message ) } }</code></pre> </div> </div> </div> </div> <div class="sect2"> <h3 id="_ključne_tačke">Ključne tačke</h3> <div class="ulist"> <ul> <li> <p>Dokle objektno orijentisano programiranje znači programiranje sa objektima,</p> </li> </ul> </div> <div class="paragraph"> <p>Funkcionalno programiranje znači programiranje sa funkcijama. Razlagate problem na više pod-problema, koje modelirate uz funkcije.</p> </div> <div class="ulist"> <ul> <li> <p>Funkcije višeg reda prihvataju druge funkcije kao ulaz ili vraćaju druge</p> </li> </ul> </div> <div class="paragraph"> <p>funkcionišu kao povratne vrednosti Teorija kategorija je teorija kompozicije, a vi je koristite da razumete kako komponirati vaše funkcije u radnom programu Izlazna vrednost čiste funkcije zavisi samo od njena ulazna parametra, i ona Nema nuspojava.</p> </div> <div class="ulist"> <ul> <li> <p>Nezeljivi efekat je nešto što funkcija čini vanjskom svetu. Ovo</p> </li> </ul> </div> <div class="paragraph"> <p>може да буде журнал у стандардном излазу или промена вредности глобалне променљиве. Funkcionalno programiranje radi za čiste funkcije, ali takođe pruža i alat za transformisanje nečistih funkcija u čiste funkcije Možete učiniti nečistu funkciju čistom pomerajući efekte da ih део повратне вредности.</p> </div> <div class="ulist"> <ul> <li> <p>Funkcionalno programiranje je pitanje kompozicije.</p> </li> </ul> </div> <div class="paragraph"> <p>Upravljanje greškama je tipičan primer neželjenih efekata, a Kotlin vam daje alatke. da ih upravljamo funkcionalno.</p> </div> </div> <div class="sect2"> <h3 id="_dublje_proučavanje_java8_lambda_izrazi_i_funkcionalni_interfejsi">Dublje proučavanje java8: lambda izrazi i funkcionalni interfejsi</h3> <div class="videoblock"> <div class="content"> <iframe src="https://www.youtube.com/embed/20waNRw6wMA?rel=0&list=PLzzeuFUy_Cng0wZhqbnkvWAW0d2fdVfyQ" frameborder="0" allowfullscreen></iframe> </div> </div> </div> <div class="sect2"> <h3 id="_teorija_kategorija">Teorija kategorija</h3> <div class="paragraph"> <p>Математичка теорерија категорија:</p> </div> <div class="videoblock"> <div class="content"> <iframe src="https://www.youtube.com/embed/LVHoROSF3KA?rel=0" frameborder="0" allowfullscreen></iframe> </div> </div> </div> <div class="sect2"> <h3 id="_osnove_funkcija">Osnove funkcija</h3> <div class="sect3"> <h4 id="_vježba_2_1">Vježba 2.1</h4> <div class="paragraph"> <p>Можете ли да напишете пример функције која мапира различите вредности?<br> čiji domen ima neodlične vrednosti u opsegu, kao što su f(b) i f(c) na slici ispod?<br></p> </div> <div class="paragraph"> <p>Pokušaj ga, a zatim proveri projekat izazova za rešenje kako da vidiš kako si uradio.<br> Nadjicete savete i objašnjenje sledeći vezu prema <a href="https://github.com/cheroliv/cheroliv.com/blob/master/codes/src/test/kotlin/functional/BasicsHOFTests.kt">решение</a>.<br></p> </div> </div> <div class="sect3"> <h4 id="_vježba_2_2">Vježba 2.2</h4> <div class="paragraph"> <p>Možeš li da napišeš inverznu funkciju množenja sa dva?<br> Koje su domen i opseg inverzne funkcije?<br> Погледај пројекат изазова и прилог B за решење.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">fun chrono(fn : () -> Unité) : Long</code></pre> </div> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin">@Test fun `Exercise 1_2`() { val waitOneSec = { sleep(ONE_SECOND) } chrono(waitOneSec).apply { println("chrono: $this") assertEquals(1, sign) } }</code></pre> </div> </div> <div class="paragraph"> <p>Pokušajte ga i proverite svoj odgovor sahttps://github.com/cheroliv/cheroliv.com/blob/master/codes/src/test/kotlin/functional/BasicsHOFTests.kt[решение, windows="_blank].</p> </div> </div> </div> </div> </div> https://cheroliv.com/blog/2022/0031_memo_design_system_post.html Sun, 9 Jan 2022 00:00:00 +0000 blog/2022/0031_memo_design_system_post.html <div class="sect1"> <h2 id="_alatke">alatke</h2> <div class="sectionbody"> <div class="dlist"> <div class="title"><strong>Ilustracije</strong></div> <dl> <dt class="hdlist1"><a href="https://undraw.co/">undraw.co</a></dt> <dd> <p>Ilustracije otvorenog koda za sve ideje koje możete zamisliti i stvoriti.</p> </dd> <dt class="hdlist1"><a href="https://absurd.design/">absurd.design</a></dt> <dd> <p>Absurdne ilustracije koje imaju smisao.</p> </dd> <dt class="hdlist1"><a href="https://drawkit.com/">drawkit.com</a></dt> <dd> <p>Predivne besplatne ilustracije. Nedeljna ažuriranja.</p> </dd> <dt class="hdlist1"><a href="https://icons8.com/">icons8.com</a></dt> <dd> <p>Ikone, ilustracije, fotografije, muzika i dizajn alati.</p> </dd> <dt class="hdlist1"><a href="https://blush.design/">rumen.design</a></dt> <dd> <p>Иконе, илустрације, фотографии,muzika и алатке за дизајн</p> </dd> <dt class="hdlist1"><a href="https://www.humaaans.com/">humaaans.com</a></dt> <dd> <p>мешајте и комбинујте илустрације људи са дизајн библиотеком</p> </dd> </dl> </div> <div class="dlist"> <div class="title"><strong>Боје</strong></div> <dl> <dt class="hdlist1"><a href="https://coolors.co/">coolors.co</a></dt> <dd> <p>Ultra-brz generator šema boja!</p> </dd> </dl> </div> <div class="dlist"> <div class="title"><strong>Trendovi</strong></div> <dl> <dt class="hdlist1"><a href="https://fr.pinterest.com">pinterest</a></dt> <dd> <p>Vizuelno otkrivanje ideja : slike, videozapisi, tematske kolekcije.</p> </dd> <dt class="hdlist1"><a href="https://dribbble.com">Дрибла</a></dt> <dd> <p>Platforma za dizajnere koji dele svoje kreacije i interaguju.</p> </dd> </dl> </div> <div class="dlist"> <div class="title"><strong>UX/UI i dizajn sistemi</strong></div> <dl> <dt class="hdlist1"><a href="https://material.io/">Google Material Design</a></dt> <dd> <p>Sistem dizajna Googla za jedinstvene i prilagodljive korisničke interfejse.</p> </dd> <dt class="hdlist1"><a href="https://developer.apple.com/design/human-interface-guidelines/">Apple smernice za interfejs korisnika</a></dt> <dd> <p>Preporuke Apple-a za dizajniranje intuitivnih iOS i macOS aplikacija.</p> </dd> <dt class="hdlist1"><a href="https://www.uxpin.com/">UXPin</a></dt> <dd> <p>Платформа за дизајн и сараду за креирање прототипа и дизајн система.</p> </dd> <dt class="hdlist1"><a href="https://www.frontify.com/">Frontify</a></dt> <dd> <p>Платформа за управљање марком и системима дизајна за обезбеђење конзистентности.</p> </dd> <dt class="hdlist1"><a href="https://designsystemsrepo.com/design-systems/">Repozitorijum dizajn sistema</a></dt> <dd> <p>Колекција ресурса и примера дизајн системи за inspiraciju</p> </dd> </dl> </div> <div class="dlist"> <div class="title"><strong>Фронтенд развој</strong></div> <dl> <dt class="hdlist1"><a href="https://htmlcheatsheet.com" target=""_blank">htmlcheatsheet.com</a></dt> <dd> <p>HTML špargalica</p> </dd> <dt class="hdlist1"><a href="https://fontawesome.com">fontawesome.com</a></dt> <dd> <p>biblioteka ikona</p> </dd> <dt class="hdlist1"><a href="https://www.toptal.com/designers/htmlarrows/symbols/">toptal.com/designers/htmlarrows/symbols</a></dt> <dd> <p>Prirodni ikoni u HTML-u</p> </dd> <dt class="hdlist1"><a href="https://css-tricks.com/">CSS-Tricks</a></dt> <dd> <p>Neophodan za CSS, sa člancima, tutorijalima i savetima za savremeni frontend.</p> </dd> <dt class="hdlist1"><a href="https://www.frontendmentor.io/">Фронтенд Ментор</a></dt> <dd> <p>Frontend kod izazovi bazirani na stvarnim projektima za poboljšanje vaših veština.</p> </dd> <dt class="hdlist1"><a href="https://dev.to/">Dev.to</a></dt> <dd> <p>Zajednica programera za dijeljenje članaka, tutorijala i projekata.</p> </dd> <dt class="hdlist1"><a href="https://codepen.io/">CodePen</a></dt> <dd> <p>Online editor koda i zajednica za deljenje komadića koda i demo-primjera.</p> </dd> </dl> </div> <div class="paragraph"> <p>Frontend razvoj podržan AI</p> </div> <div class="dlist"> <dl> <dt class="hdlist1"><a href="https://v0.dev/">v0.dev</a></dt> <dd> <p>v0 konvertuje opis iz prirodnog jezika u kod i korisnički interfejs.</p> </dd> <dt class="hdlist1"><a href="https://uizard.io/">Uizard</a></dt> <dd> <p>Uizard se fokusira na transformaciju makete (slike, skice) u HTML, CSS i React kod.</p> </dd> <dt class="hdlist1"><a href="https://www.usegalileo.ai/explore">usegalileo.ai</a></dt> <dd> <p>Galileo AI vam omogućava da opisujete interfejs koji želite prirodnim jezikom, a AI generiše uredljive Figma dizajne.</p> </dd> <dt class="hdlist1"><a href="https://play.teleporthq.io/">TeleportHQ</a&gt;</dt> <dd> <p>TeleportHQ je low-code platforma za razvoj frontend koja koristi veštačnu inteligenciju da vam pomogne da izgradite i objavite vizuelne web sajtove.</p> </dd> </dl> </div> </div> </div> https://cheroliv.com/blog/2020/0029_kubernetes_microk8s_docker_premiers_pas_post.html Tue, 3 Nov 2020 00:00:00 +0000 blog/2020/0029_kubernetes_microk8s_docker_premiers_pas_post.html <div id="preamble"> <div class="sectionbody"> <div class="paragraph"> <p><a href="https://microk8s.io/docs/">službena dokumentacija microk8s</a>+</p> </div> </div> </div> <div class="sect3"> <h4 id="_instalacija_paketa_microk8s">Instalacija paketa microk8s:</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"></code></pre> </div> </div> </div> https://cheroliv.com/blog/2020/0028_gradle_executer_un_processus_externe_depuis_une_tache_gradle_post.html Mon, 28 Sep 2020 00:00:00 +0000 blog/2020/0028_gradle_executer_un_processus_externe_depuis_une_tache_gradle_post.html <div class="sect3"> <h4 id="_gradle_kotlin_dsl">Gradle-Kotlin-DSL:</h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-kotlin hljs" data-lang="kotlin"></code></pre> </div> </div> </div> https://cheroliv.com/blog/2020/0027_kotlin_not_implemented_exception_not_implemented_error_post.html Sun, 27 Sep 2020 00:00:00 +0000 blog/2020/0027_kotlin_not_implemented_exception_not_implemented_error_post.html <div class="paragraph"> <p>NotImplementedException NotImplementedError, korisno za testove, omogućava da znate, gde ste, i uzrok greške.<br> Još nije implementirano, omogućuje podizanje ispravnog izuzetka.<br> Il y a :<br> <a href="http://commons.apache.org/proper/commons-lang/javadocs/api-release/org/apache/commons/lang3/NotImplementedException.html">org.apache.commons.lang3.IzuzetakNijeImplementiran</a><br> <a href="https://kotlinlang.org/api/latest/jvm/stdlib/kotlin/-not-implemented-error/">kotlin.NotImplementedError</a><br></p> </div> https://cheroliv.com/blog/2020/0026_untar_post.html Sat, 26 Sep 2020 00:00:00 +0000 blog/2020/0026_untar_post.html <div class="sect3"> <h4 id="_linkovi_interserver_net">Linkovi: <a href="https://www.interserver.net/tips/kb/extract-tar-gz-files-using-linux-command-line/">interserver.net</a></h4> </div> https://cheroliv.com/blog/2020/0025_gradle_rejouer_les_tests_meme_lorsque_les_tests_sont_UP-TO-DATE_post.html Fri, 25 Sep 2020 00:00:00 +0000 blog/2020/0025_gradle_rejouer_les_tests_meme_lorsque_les_tests_sont_UP-TO-DATE_post.html https://cheroliv.com/blog/2020/0024_docker_n_installe_pas_l_application_mais_tire_la_plutot_post.html Thu, 24 Sep 2020 00:00:00 +0000 blog/2020/0024_docker_n_installe_pas_l_application_mais_tire_la_plutot_post.html <div class="sect3"> <h4 id="_hackernoon_com"><a href="https://hackernoon.com/dont-install-postgres-docker-pull-postgres-bee20e200198">hackernoon.com</a></h4> </div> https://cheroliv.com/blog/2020/0023_gherkin_en_francais_post.html Wed, 23 Sep 2020 00:00:00 +0000 blog/2020/0023_gherkin_en_francais_post.html https://cheroliv.com/blog/2020/0022_gradle_cli_surcharger_un_parametre_post.html Tue, 22 Sep 2020 00:00:00 +0000 blog/2020/0022_gradle_cli_surcharger_un_parametre_post.html <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">---- ---- $ ./gradlew -Pparam_component=CUSTOM ---- ----</code></pre> </div> </div> https://cheroliv.com/blog/2020/0021_memo_git_post.html Mon, 21 Sep 2020 00:00:00 +0000 blog/2020/0021_memo_git_post.html <div class="sect3"> <h4 id="_izvori">Izvori:</h4> <div class="paragraph"> <p>*https://xenovation.com/blog/source-control-management/git/how-to-change-remote-git-repository[ksenovacija] *https://intellipaat.com/community/3102/git-show-remote-url-how-can-i-determine-the-url-that-a-local-git-repository-was-originally-cloned-from[intellipaat]</p> </div> </div> <div class="sect3"> <h4 id="_промени_удаљени_репозиторијум_у_гиту">промени удаљени репозиторијум у гиту</h4> <div class="paragraph"> <p>Приказати URL текућег удаљеног репозиторијума:</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash"></code></pre> </div> </div> </div> https://cheroliv.com/blog/2020/0021_aspirer_depuis_une_URL_post.html Sun, 20 Sep 2020 00:00:00 +0000 blog/2020/0021_aspirer_depuis_une_URL_post.html <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">---- ---- $ wget -r -k -np http://site.com/docs/manual/ ---- Да бисте поставили цељни директоријум, додајте аргумент -P и затим укажите путању. ----</code></pre> </div> </div> https://cheroliv.com/blog/2020/0020_creer_un_disk_bootable_post.html Sat, 19 Sep 2020 00:00:00 +0000 blog/2020/0020_creer_un_disk_bootable_post.html <div class="sect3"> <h4 id="_linkovi_etcher">Linkovi: <a href="https://www.balena.io/etcher/">etcher</a></h4> </div> https://cheroliv.com/blog/2020/0019_dezipper_en_CLI_dans_un_dossier_cible_post.html Fri, 18 Sep 2020 00:00:00 +0000 blog/2020/0019_dezipper_en_CLI_dans_un_dossier_cible_post.html <div class="sect3"> <h4 id="_linkovi_askubuntu">Linkovi: <a href="https://askubuntu.com/questions/86849/how-to-unzip-a-zip-file-from-the-terminal">askubuntu</a></h4> <div class="paragraph"> <p>Ako želite da izvučete u određeni odredišni folder, možete da koristite: <code>` $ unzip datoteka.zip -d odredišni_folder </code>` Ako su izvorni i ciljni direktorijumi isti, možete jednostavno uraditi: Salut <code>code</code> monde! $ izvuci file.zip <code>`</code></p> </div> </div> https://cheroliv.com/blog/2020/0018_Afficher_la_somme_des_tailles_de_fichier_dans_la_liste_des_r%C3%A9pertoires_post.html Thu, 17 Sep 2020 00:00:00 +0000 blog/2020/0018_Afficher_la_somme_des_tailles_de_fichier_dans_la_liste_des_r%C3%A9pertoires_post.html <div class="sect3"> <h4 id="_linkovi_stackexchange">Linkovi: <a href="https://unix.stackexchange.com/questions/72661/show-sum-of-file-sizes-in-directory-listing">stackexchange</a></h4> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-none hljs">---- ---- $ du -ach --exclude "./.*" /home/troll/ ---- ----</code></pre> </div> </div> </div> https://cheroliv.com/blog/2020/0017_detruire_une_branch_sur_github_post.html Wed, 16 Sep 2020 00:00:00 +0000 blog/2020/0017_detruire_une_branch_sur_github_post.html <div class="sect3"> <h4 id="_obrisati_granu_na_github">Obrisati granu na GitHub</h4> </div> <div class="sect3"> <h4 id="_veza_gist">Veza: <a href="https://gist.github.com/cheroliv/921a13ed23ae6d4d66af8d43dd536987">gist</a></h4> </div> https://cheroliv.com/blog/2020/0016_asciidoc_markdown_memo_post.html Tue, 15 Sep 2020 00:00:00 +0000 blog/2020/0016_asciidoc_markdown_memo_post.html <div class="paragraph"> <div class="title">Zашто asciidoc ili markdown ? Ovdje, ja se orijentiram ka asciidoc-u, jer već imam nekoliko tiketa napisanih u asciidoc-u.<br></div> <p>Asciidoc je jezik markiranja koji omogućava proizvodnju sadržaja, jer pruža formatiranje koje čuva tekst čitljivim za ljude.<br> Ovo je način da se standarizuje obrada teksta za jednostavni sadržaj bez dodatnog softvera.</p> </div> <div class="ulist"> <div class="title">Linkovi:</div> <ul> <li> <p><a href="https://blog.oxiane.com/2018/06/13/asciidoc-documentation-as-code/" target=""_blank">@jmdoudoux на blog.oxiane.com</a>[asciidoc]</p> </li> <li> <p><a href="https://powerman.name/doc/asciidoc" target=""_blank">powerman.name</a>[asciidoc]</p> </li> </ul> </div> https://cheroliv.com/blog/2019/0013_how-to-install-a-deb-file_post.html Mon, 19 Aug 2019 00:00:00 +0000 blog/2019/0013_how-to-install-a-deb-file_post.html <div class="paragraph"> <p>За инсталирање Debian пакета из .deb фајла преко командне линије.<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ sudo dpkg -i /chemin/du/fichier/deb/</code></pre> </div> </div> <div class="paragraph"> <p>pogledaj ovde zahttps://unix.stackexchange.com/questions/159094/how-to-install-a-deb-file-by-dpkg-i-or-by-apt[referenca]+</p> </div> https://cheroliv.com/blog/2019/0011_gradle_configuration_ide_jbake_content_post.html Fri, 16 Aug 2019 00:00:00 +0000 blog/2019/0011_gradle_configuration_ide_jbake_content_post.html <div class="paragraph"> <p>U aplikacionom projektu vođen Gradleovim menadžerom gradnje<br> Lepše je imati vidljivost na sve dokumente<br> ucesnik u razvoju aplicacije,<br> kao direktorijumi resursa koji nisu<br> у putevima po konvenciji<br> Na primer, želim da folder src/jbake,<br> da bude vidljiv kao ‘resource folder’ ,<br> Мoguće је урадити то улазањем у подешавања пројекта,<br> у мастерима ИДЕ. Међутим оva опција не е сачувана на следе заређивање<br> projekta Gradle u IDE-u. Da biste trajno dodali ovu konfiguraciju<br> Решење је да се преоптерети конфигурација путања извора<br> u datoteci za konfiguraciju build.gradle kao na linijama 18, 19, 20 i 21 :<br> build.gradle<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">plugins { id "java" id "groovy" id "org.jbake.site" version "5.0.0" id "org.ajoberstar.git-publish" version "2.1.1" } repositories { mavenCentral() jcenter() } group project_group version project_version sourceSets { main { java { srcDirs = [] } groovy { srcDirs =["src/main/java", "src/main/groovy"] } resources { srcDirs =[ "src/main/resources", "src/jbake"//in order to get site src content in the IDE ] } } test { java { srcDirs = [] } groovy { srcDirs =["src/test/java", "src/test/groovy"] } } } test { useJUnitPlatform() } configurations { ivy } dependencies { ivy "org.apache.ivy:ivy:$ivy_version" implementation "org.codehaus.groovy:groovy-all:$groovy_version" implementation "org.asciidoctor:asciidoctor-java-integration:$asciidoctor_java_integration_version" implementation "org.freemarker:freemarker:$freemarker_version" testImplementation "org.junit.jupiter:junit-jupiter-api:$junit5_version" testRuntimeOnly "org.junit.jupiter:junit-jupiter-engine:$junit5_version" } gitPublish { repoUri = github_pages_blog_repository branch = git_branch contents { from(file(jbake_content_from)) { into jbake_content_to } } } tasks.withType(GroovyCompile) { groovyClasspath += configurations.ivy }</code></pre> </div> </div> https://cheroliv.com/blog/2019/0010_gradle_groovy_script_grab_ivy_configuration_post.html Wed, 14 Aug 2019 00:00:00 +0000 blog/2019/0010_gradle_groovy_script_grab_ivy_configuration_post.html <div class="paragraph"> <p>Predmet tiketa je konfiguracija Gradle skripte za gradnju.<br> Желим да могу да користим Groovy скрипт без да направим референцу<br> у Gradle пројекту у којем га сам прикључио<br> Želim da imam mogućnost da pokrenem ovaj Groovy skript izvan Gradle.<br> Bez da ivy anotacije preuzimanja vanjske zavisnosti<br> ne dolaze da izazovu probleme performansi ili kompajliranja<br> Gradle build skripte.<br> Da bi ilustrirao konfiguraciju, koristim dva skripta:<br> Gradle skripta za gradnju i Groovy skripta.<br> Groovy skript sadrži na početku na liniji 2,<br> инструкција за преузимање ванске зависимости<br> помоћу зависност менаџера ivy.<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-Groovy hljs" data-lang="Groovy">#!/usr/bin/env groovy @Grab("commons-io:commons-io:2.6") import org.apache.commons.io.FileUtils static String getSeparator() { System.getProperty("file.separator") } String from = "${System.getProperty("user.home")}${separator}.config${separator}transmission${separator}torrents" String to = "${System.getProperty("user.home")}${separator}Documents${separator}torrents_completed" File fromDlDir = new File("${System.getProperty("user.home")}${separator}Téléchargements") File fromDir = new File(from) File toDir = new File(to) Collection<File> torrentFiles = FileUtils.listFiles( fromDir, ["torrent"] as String[], false) torrentFiles.addAll(FileUtils.listFiles( fromDlDir, ["torrent", "torrent.added"] as String[], false)) torrentFiles.empty ?: torrentFiles.each { it -> FileUtils.copyFileToDirectory(it, toDir) } println torrentFiles.size()</code></pre> </div> </div> <div class="paragraph"> <p>У фајлу build.gradle, сада hajde da vidimo kako да уведемо у гармонию<br> oba menadžera zavisnosti, ivy i Gradle. Sporazum između njih se odnosi na linije:<br> 26, 30, 37, 38 et 39<br> Dakle mogu da pokrenem moj Groovy skript ručno<br> i kompilacija Gradle ne ometava @Grab.<br> Зависностi Groovy скрипте не морају да се наведу у Gradle.<br> Međutim ne mogu da pokrenem Groovy skript iz Gradle.<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-Groovy hljs" data-lang="Groovy">plugins { id "java" id "groovy" } repositories { mavenCentral() jcenter() } sourceSets { main { java { srcDirs = [] } groovy { srcDirs =["src/main/java", "src/main/groovy"] } resources { srcDirs =["src/main/resources"] } } test { java { srcDirs = [] } groovy { srcDirs =["src/test/java", "src/test/groovy"] } } } configurations { ivy } dependencies { ivy "org.apache.ivy:ivy:$ivy_version" implementation "org.codehaus.groovy:groovy-all:$groovy_version" } tasks.withType(GroovyCompile) { groovyClasspath += configurations.ivy }</code></pre> </div> </div> <div class="paragraph"> <p>referenca ticketa nahttps://stackoverflow.com/a/18174033/837404[stackoverflow]</p> </div> https://cheroliv.com/blog/2019/0009_groovy_algebre_pgcd_ppmc_post.html Tue, 13 Aug 2019 00:00:00 +0000 blog/2019/0009_groovy_algebre_pgcd_ppmc_post.html <div class="sect2"> <h3 id="_ппмц">ППМЦ</h3> <div class="paragraph"> <p><a href="https://fr.wikipedia.org/wiki/Plus_petit_commun_multiple">wiki PPMC ili najmanji zajednički množak</a></p> </div> <div class="paragraph"> <p>AlgebraUtils.groovy<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">package com.cheroliv.misc import groovy.transform.CompileStatic @CompileStatic class AlgebraUtils { /** * Great common divisor * Plus grand commun diviseur(pgcd) * Great Common Divisor * @param a * @param b * @return */ static Integer gcd(Integer a, Integer b) { !b ? a : gcd(b, a % b) } /** * Least common multiple * Plus petit commun multiplicateur(ppmc) * @param a * @param b * @return */ static BigInteger lcm(Integer a, Integer b) { (a * b / gcd(a, b)) as BigInteger } static void main(String... args) { Integer a = 96 Integer b = 28 println "gcd($a, $b) = ${gcd(a, b)}" a = 790 b = 990 println "lcm($a, $b) = ${lcm(a, b)}" } }</code></pre> </div> </div> <div class="paragraph"> <p>резултат:</p> </div> <div class="paragraph"> <p>gcd(96, 28) = 4 NZM(790, 990) = 78210</p> </div> </div> https://cheroliv.com/blog/2019/0008_bash_find_trouver_fichiers_par_extension_post.html Mon, 12 Aug 2019 00:00:00 +0000 blog/2019/0008_bash_find_trouver_fichiers_par_extension_post.html <div class="paragraph"> <p>Tražim fajlove po kriterijumima naziva: lista fajlova koji imaju ekstenziju .h i .cpp</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ find . -name '*.h' -o -name '*.cpp' + +</code></pre> </div> </div> <div class="paragraph"> <p>lista fajlova koji imaju ekstenziju .h i .cpp<br> rezultat je sačuvan u datoteci list_of_txt_files.list</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ find . -name '*.h' -o -name '*.cpp' -print > list_of_txt_files.list</code></pre> </div> </div> <div class="paragraph"> <p>Tražim listu fajlova čija je ekstenzija .chm<br> и ја уништавам ову листу.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ find . -name "*.chm" -type f -delete</code></pre> </div> </div> https://cheroliv.com/blog/2019/0015_projet_avec_methodologie_en_cascade_post.html Thu, 1 Aug 2019 00:00:00 +0000 blog/2019/0015_projet_avec_methodologie_en_cascade_post.html <div class="sect2"> <h3 id="_analizirati_i_prikupljati_potrebe">Analizirati i prikupljati potrebe</h3> </div> <div class="sect2"> <h3 id="_definisati_upravljanje_projektom">Definisati upravljanje projektom</h3> <div class="imageblock"> <div class="content"> <img src="../../diagram/definir_projet.png" alt="definir la gestion de projet"> </div> </div> <div class="imageblock"> <div class="content"> <img src="../../img/triangle_qcd.png" alt="triangle_qcd"> </div> </div> </div> <div class="sect2"> <h3 id="_kontekstualizujte_projekat">Kontekstualizujte projekat</h3> </div> <div class="sect2"> <h3 id="_analizirati_i_prikupljati_zahteve">Analizirati i prikupljati zahteve</h3> <div class="sect3"> <h4 id="_definisati_ciljeve_i_dostave">Definisati ciljeve i dostave</h4> </div> </div> <div class="sect2"> <h3 id="_dekodirati_tabelu_za_čitanje">Dekodirati tabelu za čitanje</h3> </div> <div class="sect1"> <h2 id="_ограничите_пројекат_са_вашим_тимом">Ограничите пројекат са вашим тимом</h2> <div class="sectionbody"> <div class="imageblock"> <div class="content"> <img src="../../img/conductor.png" alt="chef d’orchestre"> </div> </div> <div class="sect2"> <h3 id="_konsultovati_eksperte_da_se_pronađe_rešenje">Konsultovati eksperte da se pronađe rešenje</h3> </div> <div class="sect2"> <h3 id="_izabrati_metodologiju_upravljanja_projektom">Izabrati metodologiju upravljanja projektom</h3> <div class="imageblock"> <div class="content"> <img src="../../img/cascading_planning.png" alt="planning en cascade"> </div> </div> <div class="imageblock"> <div class="content"> <img src="../../img/Cycle_V_details.jpeg" alt="cycle en V"> </div> </div> </div> </div> </div> https://cheroliv.com/blog/2019/0014_list_all_databases_in_postgresql_post.html Tue, 30 Jul 2019 00:00:00 +0000 blog/2019/0014_list_all_databases_in_postgresql_post.html <div class="paragraph"> <p>Nemam volje da instaliramhttps://www.pgadmin.org/[pgAdmin] ou <a href="http://phppgadmin.sourceforge.net/">phppgadmin</a> dakle sve je prisutno na komandnoj liniji.<br> Za to moramo da pokrenemo terminal i da se prijavimo kao korisnik postgres.<br> Корисник postgres је једин који има подразумевано pravo да покrene апликацију psql, која је клијент командној линији. (<a href="https://fr.wikipedia.org/wiki/Interface_en_ligne_de_commande">CLI</a>) postgresql,<br> да бисмо могли да говоримо са базом података преко командне линије из терминала.<br> Za povezivanje, pokrenite terminal i unesite ovo:<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ sudo -i -u postgres</code></pre> </div> </div> <div class="paragraph"> <p>Da se povezete i odmah stignete na naredbeni red postgresql, ukucajte ovo :</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ sudo -i -u postgres psql</code></pre> </div> </div> <div class="paragraph"> <p>Da biste listirali baze podataka u instanci postgresql, ovde je komanda :<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-SQL hljs" data-lang="SQL">postgres=# \l</code></pre> </div> </div> <div class="paragraph"> <p>rezultat:</p> </div> <div class="paragraph"> <p>Список база података Ime | Vlasnik | Kodiranje | Slaganje | Tip karaktera | Prava pristupa</p> </div> <div class="paragraph"> <p>fiber | tech | UTF8 | fr_FR.UTF-8 | fr_FR.UTF-8 | =Tc/tech<br> | | | | | tech=CTc/tech fiberdev | tech | UTF8 | fr_FR.UTF-8 | fr_FR.UTF-8 | =Tc/tech<br> | | | | | tech=CTc/tech fiberweb | tech | UTF8 | fr_FR.UTF-8 | fr_FR.UTF-8 | =Tc/tech<br> | | | | | tech=CTc/tech postgres | postgres | UTF8 | fr_FR.UTF-8 | fr_FR.UTF-8 | template0 | postgres | UTF8 | fr_FR.UTF-8 | fr_FR.UTF-8 | =c/postgres<br> | | | | | postgres=CTc/postgres template1 | postgres | UTF8 | fr_FR.UTF-8 | fr_FR.UTF-8 | =c/postgres<br> | | | | | postgres=CTc/postgres (6 linija)</p> </div> <div class="paragraph"> <p>ukucajte q da napustite prikaz rezultata<br> <br> za listanje shema instance Postgres.</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-sql hljs" data-lang="sql">postgres=# SELECT schema_name FROM information_schema.schemata;</code></pre> </div> </div> <div class="paragraph"> <p>резултат</p> </div> <div class="paragraph"> <p>javno information_schema pg_catalog pg_toast_temp_1 pg_temp_1 pg_toast (6 linija)</p> </div> <div class="paragraph"> <p>ou</p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-sql hljs" data-lang="sql">postgres=# SELECT nspname FROM pg_catalog.pg_namespace;</code></pre> </div> </div> <div class="paragraph"> <p>rezultat</p> </div> <div class="paragraph"> <p>pg_toast pg_temp_1 pg_toast_temp_1 pg_catalog information_schema javni (6 linije)</p> </div> https://cheroliv.com/blog/2019/0007_groovy_rename_recursively_files_post.html Mon, 29 Jul 2019 00:00:00 +0000 blog/2019/0007_groovy_rename_recursively_files_post.html <div class="paragraph"> <p>Moj video plejer na mojoj TV ima svoj način prolaska<br> од једног фајла до другог у континуираном читању<br> и његов режим читања је да пређе од 1…​..mp4 до 10…​.mp4,<br> i ne od 1…​mp4 do 2…​.mp4.<br> Problem je da je oko 900 fajlova i fascikla.<br> Bingo super primer upotrebe Groovy za manipulaciju<br> fajlovi, preimenovanje, pretraga uzorka u imenu fajla<br> ili fajl.<br> Ovde je cilj da promenimo nazive koji počinju sa<br> jedan broj i čiji je drugi karakter imena<br> nije broj, dodacu 0 na početak ovog imena<br></p> </div> <div class="paragraph"> <p>renommerLesFichiersPourCommencerAvecDeuxChiffres.groovy<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">#!/usr/bin/env groovy /** * get a crossplateform separator * @return */ static String getSeparator() { System.getProperty("file.separator") } /** * rename file * @param file * @param newName * @return the renamed file */ static File rename(File file, String newName) { assert file.renameTo(file .parentFile.path + getSeparator() + newName) new File(file .parentFile.path + getSeparator() + newName) } String rootFolderPath = System.getProperty("user.home") + "/Bureau/ng-courses/Udemy - Angular 7 " + "(formerly Angular 2) - The Complete Guide" File rootFolder = new File(rootFolderPath) assert rootFolder.exists() assert rootFolder.directory assert rootFolder.canRead() List<File> dirList = new ArrayList<>() //Adding rootFolder in dirList // just in case there is some files in it dirList.add(rootFolder) //looping to get list of directories //recursively inside rootFolder rootFolder.traverse { File file -> !file.directory ?: dirList.add(file) } //looping through dirList //to rename directories filling criterias for (int i = dirList.size() - 1; i >= 0; i--) { Character[] chars = dirList.get(i).name.chars !(chars[0].digit && !chars[1].digit) ?: dirList.set(i, rename(dirList.get(i), "0${dirList.get(i).name}")) if (dirList.get(i).directory) { //looping through directory //to rename file filling criterias dirList.get(i).listFiles().each { File f -> Character[] cs = f.name.chars !(cs[0].digit && !cs[1].digit) ?: rename(f, "0${f.name}") } } }</code></pre> </div> </div> https://cheroliv.com/blog/2019/0006_groovy_find_files_copy_to_post.html Fri, 19 Jul 2019 00:00:00 +0000 blog/2019/0006_groovy_find_files_copy_to_post.html <div class="paragraph"> <p>Cilj ovog skripta je da traži datoteke,<br> из родичког директоријума; преузети селекцију<br> у списку. На крају копирај ову листу датотека<br> у циљном директоријуму, ово у Гроуви.</p> </div> <div class="paragraph"> <p>findCopyTo.groovy<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">#!/usr/bin/env groovy @Grab("commons-io:commons-io:2.6") import groovy.io.FileType import org.apache.commons.io.FileUtils /** * un separateur OS independant * @return */ static String getSep() { System.getProperty("file.separator") } /** * la liste des fichiers dont le titre contient un item * de la liste des motifs * * @param path * @param motifs * @return la liste des chemins complet de fichiers */ static List<String> findFilesContainingMotifs( String path, List<String> motifs) { List<String> filePathResultList = new ArrayList<>() new File(path) .eachFileRecurse(FileType.FILES) { if (it.name.toLowerCase().contains('cucumber')) { filePathResultList.add it.path } } filePathResultList } /** * copy vers la liste des fichiers * @param files * @param to */ static void copyFilesTo(List<String> files, String to) { File toDirDest = new File(to) files.each { String filepath -> File file = new File(filepath) //si le dernier caractere de to n'est pas un separateur // alors ajoute le a la chaine (to.substring(to.length() - 1) == sep) ?: to.concat(sep) if (to + file.name != filepath) { FileUtils.copyFileToDirectory(file, toDirDest) file.delete() } } } /** * la list des arguments */ String userName = System.getProperty("user.name") List<String> motifs = ['cucumber'] String path = "/media/$userName/320/Books/" String to = "/media/$userName/320/Books/bdd/" /** * lappel aux methodes */ copyFilesTo(findFilesContainingMotifs(path, motifs), to) //affiche moi les fichiers déplacés findFilesContainingMotifs(path, motifs).each { println it }</code></pre> </div> </div> https://cheroliv.com/blog/2019/0005_groovy_manipulation_files_post.html Thu, 18 Jul 2019 00:00:00 +0000 blog/2019/0005_groovy_manipulation_files_post.html <div class="paragraph"> <p>Ovde ću se zainteresovati za učitavanje svojstva u build projektu.https://docs.gradle.org/current/userguide/userguide.html[gradle]<br> bez da je to dostupno u kodu.<br> Svojstvo će biti definirano u fajlu gradle.properties u direktoriju ~/.gradle/gradle.properties<br> ~ је пречац за симболну променљиву HOME_PATH која представља кориснички корењ сесије: lehttps://fr.wikipedia.org/wiki/R%C3%A9pertoire_personnel[lični direktorijum].<br> Na isti način u build projektuhttps://maven.apache.org/guides/index.html[maven], sa `~/.m2/settings.xml Сврха овог скрипта је брисање датотека које би одговарале наведеним узорцима.<br> u varijabli strCriteria. Зато ћу користитиhttps://fr.wikipedia.org/wiki/Fermeture_(informatique)[zatvaranja]: svaki, pronađiSve, prikuplji<br> a i klasa StringTokenizer koja će razrezati moj niz kriterija na komade<br> da bismo dobili listu stringova. Ako jedan od fajlova u mojoj folderi za čišćenje sadrži jedan od uzoraka u svom imenu<br> Онда он ће бити кандидат за уništвај, јер ће бити додат у листу резултата.<br> И на последњој линији један мали пример d’<a href="https://en.wikipedia.org/wiki/Elvis_operator">Elvis operator</a><br> filemanip.groovy<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">#!/usr/bin/env groovy //Mes criteres de selection des fichiers à detruire String strCriteria = "Dummies Dummie ajax Objective-C Windows blackberry " + "wordpress joomla ios c# f# rails ruby flex asp flash Dreamweaver adobe " + "CoffeeScript c++ .chm .epub .rar .zip .tar drupal drupals .net php javascript " + ".js iphone ipad js _js facebook gwt vaadin linq python py zope window " + "3D scala gaming active_directory tomcat jboss glassfish microsoft 2d " + "lego blogger blog cocoa dojo dom dotnetnuke eclipse .gz unity sharepoint " + ".tgz iwork filemaker .doc .txt" //repertoire personnel String userDir = System.getProperty("user.home") //un separateur de chemin crossplatform String sep = System.getProperty("file.separator") //la variable symbolique String sym_books_vrac_path = "books_vrac_path" //le chemin de mon fichier gradle.properties hors projet String propertiesFilePath = userDir .concat("${sep}.gradle${sep}gradle.properties") File propertiesFile = new File(propertiesFilePath) //je m'aassure que le fichier existe et que ce n'est pas un dossier assert propertiesFile.exists() && !propertiesFile.directory Properties gradleProperties = new Properties() //on boucle avec un inpustream sur le fichier //gradle.properties pour peupler ma variable gradleProperties propertiesFile.withInputStream { InputStream it -> gradleProperties.load(it) } //le chemin du dossier books_vrac est la valeur de notre clé books_vrac_path String pathVracDir = gradleProperties.get(sym_books_vrac_path) //j'ai récuperé tous ces livres en tapant cette commande dans le terminal //wget -m -np -c -R "index.html*" "http://the-eye.eu/public/Books/IT%20Various/" //on ouvre le dossier dont le chemin est dans la variable pathVracDir // on s'assure qu'il existe et que c'est un dossier File vracDir = new File(pathVracDir) assert vracDir.exists() && vracDir.directory //separer les élèments de ma liste de critère StringTokenizer tokenizer = new StringTokenizer(strCriteria) //la liste de critere List<String> criteriaList = new ArrayList<>() //j'itère sur les tokens et je construit ma liste de token, // mot clef critère de recherche tokenizer.each { String it -> criteriaList.add(it.toLowerCase()) } //je collect tous les noms de fichier dans le dossier List<String> fileNameList = vracDir .listFiles() .collect { File it -> it.directory ?: it.name } // je collect les noms de fichier qui contiendraient un des criteres List<String> resultList = fileNameList.findAll { String name -> criteriaList.findAll { String crit -> name.toLowerCase().contains(crit) } } // je parcours ma liste de résultat pour les effacer resultList.each { String fileName -> assert new File(vracDir.path + sep + fileName).delete() } println fileNameList.size() println resultList.size() resultList.empty ?: println(vracDir.path + sep + resultList.first())</code></pre> </div> </div> https://cheroliv.com/blog/2019/0004_groovy_replace_string_load_properties_post.html Wed, 17 Jul 2019 00:00:00 +0000 blog/2019/0004_groovy_replace_string_load_properties_post.html <div class="paragraph"> <p>Evo funkcionalnog koda u Groovy,<br> za promenu svih pojavljivanja sekvence znakova u Stringu<br> i učitati datoteku .properties u objektu properties<br> Извршити команду у String.<br> replaceTextinFile.groovy<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">#!/usr/bin/env groovy println System.getProperty("user.home") static String getSeparator_() { System.getProperty("file.separator") } String separator = separator_ String path = System.getProperty("user.home") .concat("${separator}.gradle" + separator + "gradle.properties") File propertiesFile = new File(path) assert propertiesFile.exists() && !propertiesFile.directory Properties gradleProperties = new Properties() propertiesFile.withInputStream { InputStream it -> gradleProperties.load(it) } String user_name = gradleProperties.getProperty("user_name") String text String resultText text = new File("${System.getProperty("user.home")}" + separator + "src" + separator + "cheroliv.github.io" + separator + "src" + separator + "main" + separator + "resources" + separator + "eco_space.txt").text String to = separator + "media" + separator + "${user_name}" + separator + "320" + separator + "videoCours" + separator String from = "${System.getProperty("user.home")}" + separator + "p2p" + separator resultText = text.replace(to, from) println resultText //execute command line in a string println "rsync -avr ${resultText} ${to}".execute().text</code></pre> </div> </div> https://cheroliv.com/blog/2019/0003_groovy_char_ascci_post.html Wed, 10 Jul 2019 00:00:00 +0000 blog/2019/0003_groovy_char_ascci_post.html <div class="paragraph"> <p>Ovo je funkcionalan deo koda na Grooviju koji generiše tekstualnu datoteku,<br> sa prvih 256 čitljivih karaktera tabele ASCII<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-groovy hljs" data-lang="groovy">#!/usr/bin/env groovy import java.nio.charset.StandardCharsets List<Character> chars = new ArrayList<>() int j = 0 Character jumpLine = '\n' 256.times { Integer idx -> if (Character.isAlphabetic(idx) || Character.isDigit(idx)) { if (j % 10 == 0 && j != 0) { chars.add(jumpLine) chars.add(idx as char) } else chars.add(idx as char) j++ } } String seperator = System.getProperty("file.separator") String path = "${System.getProperty("user.home")}${seperator}ascii.txt" File speCharFile = new File(path) if (speCharFile.exists() && !speCharFile.directory) { speCharFile.text = "" } else { speCharFile.createNewFile() } String text = new String() chars.each { Character it -> text = it == jumpLine ? "$text$it" : "$text $it " } speCharFile.setText(text, StandardCharsets.UTF_8.toString())</code></pre> </div> </div> <div class="paragraph"> <p>sam nazvao fajl <code>spe_char.groovy</code>,<br> od mape gde je fajl<br> отвори терминал и копирај-залепи за извршење скрипте<br></p> </div> <div class="listingblock"> <div class="content"> <pre class="highlightjs highlight"><code class="language-bash hljs" data-lang="bash">$ groovy spe_char.groovy</code></pre> </div> </div> <div class="paragraph"> <p>резултат:</p> </div> <div class="paragraph"> <p>0 1 2 3 4 5 6 7 8 9 A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z ª µ º À Á Â Ã Ä Å Æ Ç È É Ê Ë Ì Í Î Ï Ð Ñ Ò Ó Ô Õ Ö Ø Ù Ú Û Ü Ý Þ ß à á â ã ä å æ ç è é ê ë ì í î ï ð ñ ò ó ô õ ö ø ù ú û ü ý þ ÿ</p> </div>