kytka9notes: Nájdi kód skôr, ako otvoríš Google

Ján Klimek — Tue, 12 May 2026 10:53:59 +0000

Väčšina z nás to pozná, nevieš si spomenúť na skratku alebo terminálové príkazy, ktoré si použil minulý týždeň. Namiesto hľadania cez google či zbytočného využívania AI na také banality, som si vytvoril cheat sheet.

Funguje v prehliadači, vyhľadáva okamžite a funguje aj offline.

Obsah článku:

Čo to vlastne je...
Instantné vyhľadávanie
Žiadne "zbytočné" knižnice
TAB navigácia & UX detaily
Záver: Menej je viac

1. Čo to vlastne je...

Kytka9notes je statická webová apka — jediný index.html súbor, žiadny backend, žiadna databáza, žiadne npm závislosti pri spustení. Miesto, kde si ukladám príkazy, skratky, snippety a poznámky roztriedené do kategórií (macOS, Markdown, HTML, ...).

Každý záznam má typ — command, var alebo comment — a dá sa kedykoľvek odfiltrovať alebo vyhľadať (aj bez diakritiky)

Zámer je jednoduchý: otvoriť tab, napísať pár znakov, nájsť čo hľadáš.

jeden html súbor
nula npm závislostí
offline dostupnosť

2. Instantné vyhľadávanie

Väčšina webových nástrojov pri hľadaní posiela požiadavku na server, čaká na odpoveď a potom prerenduje výsledky. Kytka9notes to robí inak — všetky dáta sú uložené priamo v JavaScripte a vyhľadávanie prebieha výhradne v pamäti prehliadača, bez akejkoľvek sieťovej komunikácie.

Technicky: celý dataset je JavaScript pole (array), ktoré sa načíta raz pri štarte stránky a zostáva v pamäti počas celej session. addEventListener('input', ...) zachytí každú zmenu v search poli a spustí .filter() nad týmto poľom. Výsledné záznamy sa vyrenderujú priamo do DOM bez frameworku, bez virtual DOM diffingu — len čistý innerHTML rewrite. Pre stovky záznamov je toto najrýchlejší možný prístup v prehliadači.

Vyhľadávanie v reálnom čase — výsledky sa filtrujú pri každom stlačení klávesy.

3. Žiadne "zbytočné" knižnice

Čistý vanilla JavaScript. Pri tomto projekte to nie je zaostalé myslenie, práve naopak. Pre nástroj, kde je cieľom maximálna rýchlosť pri minimálnom trení, je absencia frameworku zámer, nie nedostatok. Menej kódu = rýchlejší load = rýchlejšie hľadanie = viac času na skutočnú prácu.

Jediná externá závislosť pri renderingu je Font Awesome — pre ikonky, čo je rozumný kompromis medzi vzhľadom a váhou. Ostatné — dizajn, animácie, logika — je originálny CSS a JS od autora.

Kombinácia "všetky dáta lokálne + filter v JS + žiadny server" znamená, že kytka9notes funguje aj offline po prvom načítaní — ideálne na prácu v lietadle, v kaviarni bez WiFi.

4. TAB navigácia & UX detaily

Kedže ma baví pracovať prevažne klávesnicou a vyvarovať sa myške, stačí tabulátorom skočiť do vyhľadávacieho poľa a nájsť to potrebné.

V hlavičke je v podstate všetko dôležité info, plus aktuálny čas. Na konci stránky je celkový počet poznámok a dátum poslednej aktualizácie.

// Posledná aktualizácia stránky
const datum = new Date(document.lastModified);
const formatovanyDatum = datum.toLocaleDateString('sk-SK', {
    day: '2-digit',
    month: '2-digit',
    year: 'numeric'
});
document.getElementById('posledna-uprava').innerText = formatovanyDatum;

5. Záver: Menej je viac

Kytka9notes nie je produkt pre milióny používateľov. Je to presne to, čo hovorí README: "vytvorený pre pohodlie autora". A práve v tom je jeho sila. Bez kompromisov na UX kvôli onboardingu cudzích ľudí, bez feature bloat, bez analytiky sledujúcej každý klik.

Ak hľadáš inšpiráciu, ako si postaviť vlastný rýchly nástroj — jeden HTML súbor, čistý JavaScript, GitHub Pages — kytka9notes je skvelý príklad na preštudovanie. Zdrojový kód je verejný na GitHube a ukazuje, že niekedy je najlepší framework... žiadny framework.

Live stránka: ➤odkaz
GitHub: ➤odkaz

Keep coding :)

Hello there

Ján Klimek — Fri, 08 May 2026 06:59:44 +0000

Ahojte,
toto je môj prvý článok na tejto platforme.

Som začínajúci programátor. V roku '25 som si prešiel rýchlokurzom jazyka Java, no postupom som zistil, že ma viac baví frontend, preto sa teraz venujem (vzdelávam) hlavne html/css, react. Ak by išlo do tuhého tak na backend použijem php :).

Môje dev prostredie je macOS, Warp, Homebrew, VS Code.

Budem tu dokumentovať moju cestu programovania, projekty a poznatky.

See ya soon...

Forem: Ján Klimek