Mella CMS

Kommentaarid, e-pood, uuendused ja disainiefektid: mis neljas päevas juhtus

· autor: Meelis Luks · Ajaveeb
Neli päeva, 59 commit'i

Eelmises postituses kirjutasin, kuidas Mella CMS kuue päevaga sündis. Lõpus oli plaanide nimekiri: e-pood, CSS-efektid, vigade parandamine ja turvatest. Sellest ajast on möödunud neli päeva, lisandus 59 commit'i ja kokku on neid nüüd 90. Sait on avalik, nii et iga muudatus läheb kohe päris külastajate ette. Siin on, mis vahepeal juhtus ja mis plaanist on juba tehtud.

Esmaspäev õhtul (19. oktoober): kleebitud Markdown

Päev lõppes väikese mugavusega. Kui rikkasse redaktorisse kleebitakse Markdown-tekst, muudab redaktor selle nüüd kohe korralikuks vormindatud sisuks. Enam ei pea tärne ja trelle käsitsi ära parandama.

Teisipäev hommik (20. oktoober): rämpspost ja blogi

Päev algas kontaktvormi kaitsega. Vorm nõuab nüüd brauserilt väikese proof-of-work ülesande lahendamist ja kontrollib e-posti domeeni. Inimesele on see nähtamatu, robotile aga kallis. Kasutasin lahendust, mis ei vaja crypto.subtle'it, et vorm töötaks ka lihtsamates keskkondades. Avalikud failid said ka versiooninumbri, et vana vahemälu uut koodi ei varjaks.

Kell 10:14 lisasin menüüsse blogi märkeruudu. Pool tundi hiljem oli valmis suurem asi: blogikommentaarid koos vastustega ja tärnidega hinnangud (üle 1100 lisatud rea). Samal päeval vahetasin brauseri confirm()-aknad admini enda dialoogide vastu, et kõik näeks välja ühtlane.

Teisipäev pärastlõuna: e-pood ja väljalaskepaketid

Päeva kõige suurem commit oli valikuline e-pood (64 faili, üle 4800 lisatud rea). Seal on tooted, ostukorv, Stripe'i ja PayPali maksed, tellimused ja digitaalsed allalaadimised. E-pood lülitatakse sisse seadetest ja seda kaitseb aktiveerimiskood. Kood on Ed25519 allkiri, mille privaatvõti on ainult minu käes.

Ausalt tuleb lisada, et makseid olen seni testinud ainult kohalike Stripe'i ja PayPali simulaatoritega, mitte nende päris sandbox-keskkondadega. See on järgmine samm enne, kui keegi päris raha liigutab.

Kohe pärast e-poodi hakkasin tegelema sellega, et CMS-i saaks teistele anda:

  • kliendi väljalaskepaketid: Docker-pilt ja tavaline Node'i pakett, mille server on minimeeritud

  • paigaldusskript, mis kontrollib Node'i versiooni, paigaldab sõltuvused ja kirjutab .env

  • valmis näited Apache'i, nginx'i, Caddy, pm2, systemd ja varunduse jaoks

  • serveri viga: kui port oli hõivatud, kirjutas server "running" ja lõpetas koodiga 0. Nüüd annab see veateate

  • meediakogusse tohib nüüd laadida ka tar.gz, tgz ja gz faile

Kolmapäev hommik (21. oktoober): disainiefektid

Täna hommikul tegin kolme tunniga viis commit'i, mis annavad ehitajale uue visuaalse kihi. Iga ploki stiilile saab nüüd lisada:

  • taustagradiendid

  • filtrid ja segamisrežiimid

  • hover-efektid

  • animatsioonid

Viimane commit uuendas kasutusjuhendit nii, et ka uued efektid on kirjeldatud ja ekraanipiltide skriptid töötavad edasi.

Kolmapäev lõuna: koodiaudit

Kui uus funktsioon on valmis, tekib kiusatus kohe järgmise juurde minna. Seekord palusin Claude'il enne teha terve koodibaasi auditi ja otsida üleliigset rämpsu. Kontrollisime kasutamata eksporte, sõltuvusi, tõlkevõtmeid, CSS-klasse, API otspunkte, andmebaasitabeleid, kommenteeritud koodi ja unustatud console.log-e.

Hea uudis: rämpsu oli vähe. Kõik sõltuvused on kasutusel, kõik andmebaasitabelid on kasutusel ja ka kõik API otspunktid, mis esmapilgul tundusid kasutud, kutsub mõni lehekülg tegelikult välja. Leidus siiski väikeseid jääke:

  • viis surnud funktsiooni, konstanti ja tüüpi, mida ükski teine fail ei kasutanud, ning lisaks üks kasutamata import ja parameeter

  • üheksa kasutamata tõlkerida, mis jäid e-poe töö käigus ümber sõnastatud tekstidest

  • 15 eslint-disable kommentaari projektis, kus eslint-i üldse pole. Need olid pealtnäha hoolikas kood, aga tegelikult mõttetu müra

  • üks kasutamata ikoonifail ja aegunud failide nimekiri README-s

Kõik see kustus ühe väikese puhastusega ja pärast seda läbivad nii tüübikontroll kui ehitus. Kontrollisin ka seda, et ükski is-* või drop-* CSS-klass poleks kasutuks muutunud. Sellised klassid on koodis dünaamiliselt kokku pandud, nii et lihtne tekstiotsing oleks need ekslikult kasutuks tunnistanud.

Suurim "rämps" polnud aga koodis, vaid ajaloos. Repo .git kaust kasvas 106 MB-ni ja põhjus oli kaks kasutusjuhendi PDF-i, kumbki umbes 9 MB. Iga uuendus lisas ajalukku uue versiooni ja neid oli kogunenud kaheksa või rohkem. Nüüd on PDF-id versioonihaldusest väljas ja neid saab vajaduse korral skriptiga uuesti ehitada. Olemasolevat ajalugu ma ei kirjutanud ümber, sest see muudaks kõik commit'i-ID-d. Seega vana maht jääb alles, aga uusi PDF-e see enam ei kasvata.

Audit tõi esile ka puuduse: projektis pole ühtegi automaattesti. Seni olen kõike kontrollinud tüübikontrolli, ehituse ja käsitsi proovimisega. See on ausalt öeldes suurim risk, kui kood kasvab veel.

Kolmapäev õhtu (21. oktoober): uuendused ja väljalasked

Kui CMS-i on mõni teine inimene paigaldanud, tuleb temani viia ka uued versioonid. Sellega tegelesin õhtul.

Esmalt tegin paigaldusskripti POSIX-ühilduvaks, et see töötaks ka serverites, kus /bin/bash'i pole. Siis tegin ühe otsuse, mis eelmist päeva tühistas: eemaldasin Dockeri. Dockerfile, compose-failid, käivitusskript ja pildi väljalaskeskript kustusid ning alles jäi tavaline Node'i paigaldus.

Seejärel valmis uuenduste süsteem:

  • admin vaatab kord päevas, kas uuem versioon on olemas, ja näitab administraatoritele teadet (Seaded → Uuendused)

  • update.sh laadib paketi alla, kontrollib Ed25519-allkirjaga manifesti ja SHA-256 kontrollsummat, teeb andmetest ja vanast koodist varukoopia ning alles siis vahetab koodi

  • väljalaskepaketi ehitab ja allkirjastab skript

Kohe peale seda kirjutasin release.sh, mis teeb ühe käsuga kõik: tõstab versiooni, võtab väljalaskemärkmed, ehitab paketi, laeb üles ja märgib git'i sildi. Samal õhtul tuli sellega kaks väljalaset (1.2.1 ja 1.2.2). Kasutusjuhend hakkas ilmuma ka veebilehtedena (inglise ja eesti keeles) ning PDF-i enam ei valmista. Nii lahenes lõplikult ka lõunal mainitud PDF-ide mure.

Neljapäev hommik (22. oktoober): ühe klõpsu uuendus ja 1.3.0

Hommik algas kasutusjuhendi piltide uuendamisega (175 faili) ja siis tuli Uuenda-nupp. Adminis saab nüüd uue versiooni paigaldada ühe klõpsuga. Nupp teeb varukoopia, näitab samme ja kui uus versioon ei käivitu, paneb vana tagasi. Toimimiseks peab serveri .env-is olema UPDATE_RESTART_CMD (1.2.3).

Veidi hiljem uuendasin sanitize-html teegi versioonile 2.18.1. Sobivalt koostatud HTML võis vana versiooni pinumälu ammendada, nii et see oli turvaparandus (1.2.4). Samas väljalaskes tuli ka allalaadimise leht aadressil cms.mella.ee/releases/, kus on uusim versioon, kontrollsumma, märkmed ning paigaldus- ja uuendusjuhend.

Kell 10:17 hakkas järgmine disainiefektide voor. Pooleteise tunniga lisandus:

  • animatsioonid: plokid tulevad üksteise järel, lisandusid siirdekõverad, vahemaa, kordus ja uued eelseaded

  • hover ploki osadele (näiteks kaardi pildile), gradiendiga tekst ja paigalseisev taustapilt

  • valmis väljanägemised plokkidele

  • kerimisega seotud animatsioonid: triiv, kasv ja hajumine

  • saidi stiil, mis määrab, kuidas üks leht annab teed järgmisele

  • uus Jooksev rida plokk, mis liigutab sõnu või pilte küljele

Kõik liikumised lülituvad välja külastajatel, kes eelistavad vähem liikumist.

Kell 10:57 tuli ka menüü ümbertegemine. Menüü plokk on nüüd linkide loend, kus iga link avaneb samal vahelehel, uuel vahelehel või hüpikaknas ja võib hoida alammenüüd. Vanad menüüd töötavad edasi. Natukese aja pärast sai valmis 1.3.0.

Numbrites

  • Esimene commit: 14. oktoober 2026

  • Viimane commit: 22. oktoober 2026, 11:17

  • Commit'e kokku: 90 (eelmisest postitusest +59)

  • Väljalasked: 1.2.1, 1.2.2, 1.2.3, 1.2.4 ja 1.3.0

  • Suurim muudatus: e-pood, 64 faili

Mida ma sellest õppisin

  1. Rämpspost tuleb kohe, kui leht on avalik. Seetõttu pidi kontaktvormi kaitse valmis olema enne, mitte pärast.

  2. Paigaldamine on funktsioon. Skript ja serverinäited võtsid vähem aega kui e-pood, aga teevad CMS-i kasutatavaks kellelegi peale minu.

  3. Ausus testimise kohta. On parem öelda, et makseid on proovitud simulaatoritega, kui jätta mulje, et kõik on päris maailmas kontrollitud.

  4. Suurim jääk ei pruugi olla kood. Kahe PDF-i ajalugu võttis rohkem ruumi kui kogu lähtekood. Genereeritud failid ei kuulu versioonihaldusse.

  5. Kommentaar võib valetada. eslint-disable näitab hoolt tööriista vastu, mida projektis pole. Selliseid jääke leiab ainult auditiga.

  6. Väljalase peab olema üks käsk. Kui versiooni tõstmine, märkmed, ehitus, üleslaadimine ja silt on käsitsi, jääb mõni neist ühel päeval tegemata.

  7. Uuendusel peab olema tagasitee. Nupp, mis varundab ja paneb vana versiooni tagasi, kui uus ei käivitu, on lihtsalt mugavam kui käsitsi uuendamine.

Lõpetuseks

Esimese postituse plaanist on e-pood ja CSS-efektid nüüd tehtud ning peale neid ka uuenduste süsteem, allalaadimise leht ja menüü ümbertegemine. Koodiaudit on tehtud ja rämps koristatud. Alles on vigade parandamine, turvatest ja e-poe maksete läbiproovimine päris sandbox-keskkonnas. Nimekirja lisandub ka esimene automaattest.

Nagu eelmises postituses: suure osa koodist on minu täpsete juhiste järgi kirjutanud tehisintellekt. Vaatame, kui kaugele me koos Claude'iga jõuame.


Hinda seda postitust
Hinnanguid pole veel

Kommentaarid

Kommentaare pole veel. Ole esimene!

Lisa kommentaar

Sinu e-posti aadressi ei avaldata.
Aitäh! Sinu kommentaar ilmub pärast kinnitamist.