Temų šablonai ir failų architektūra
Failų ir kodo organizavimas yra kritiškai svarbi sritis web projekto priežiūrai ateityje. O tai padės pasiekti gera failų architektūra!
Temos šablonų ir failų architektūra legvesnei CSS ir JavaScript kodo priežiūrai
Pradedant projektą tenka nuspręst, ar naudoti biblioteką bei framework’ą, ar rašyti visą kodą pačiam… Yra dalis programuotojų, kurie neįsivaizduoja jokio projekto bet tokių bibliotekų kaip Tailwind ar Alpine.js, nes teigia, kad priešingu atveju darbas su kodu ateityje bus pernelyg komplikuotas. Aš su jais sutinku kalbant apie didesnius projektus, tačiau, ar tai būtina smulkiam webui su vos keliais šablonais?
Dinamiški puslapio šablonai
Prieš pradėdamas naują tinklalapio temą visada stengiuosi identifikuoti tam tikras dizaino dalis ar visus puslapius, kuriuos galėčiau panaudoti kode papildoma.
Kalbant trumpai – tinklalapio temą sudaro tam tikros puslapio dalys (pvz., viršutinis meniu, mobiliesiems įrenginiams skirtas meniu, apačioje esančios piktogramos ir pan.) bei puslapių šablonai (tarp universalių dalių įterpiamas turinys). Toks puslapiui specifinis turinys gali būti paveikslėlis, baneris su mygtuku ar sąrašas. Natūraliai kyla klausimas, ar tokias dalis galima panaudoti pakartotinai kitose tinklalapio vietose? Ne tik, kad galima, tačiau tai daryti būtina!
Visų dinamiškų puslapio šablonų esmė yra galimybė turinio koordinatoriams arba puslapio administratoriams keisti tekstą, nuorodas ir paveikslėlius užtikrinant dinamišką turinio pateikimą.
Drag & drop puslapių kūrimo įrankiai
Ar teko naudoti WordPress arba Hubspot puslapių kūrimo įrankius? Šie įrankiai suteikia galimybę sudėlioti atskirą tinklalapio puslapį per labai trumpą laiką ir praktiškai be jokių programavimo žinių.
Programuodamas turinio valdymo sistemas arba kurdamas tinklalapius aš galiu sukurti unikalius drag & drop modulius, kad įmonės puslapius būtų galima kurti dar greičiau ir tokie sukurti puslapiai atrodytų kaip pagrindinės temos dalis.
Galite peržiūrėti keletą pavyzdžių kitame mano asmeniniame tinklalapyje www.digitalrobke.com – šiame projekte naudodamas REACT, CSS, HTML esu sukūręs WordPress puslapių kūrimo modulius.
CSS ir JavaScript failų architektūra
Temų šablonai ir dinamiškas turinys padeda išvengti to paties kodo perrašymo, tačiau kaip tai pritaikyti CSS bei JavaScript? Norėdamas išvengti dubliavimo ir to paties kodo rašymo kelis kartus, naudoju taip vadinamą modulinę failų struktūrą, kurioje kodas yra išskirstytas į failus bei aplankus ir tiesiog su sujungiamas į galutinę versiją, pašalinant nereikalingas jo dalis. Tam tikra kodo dalis gali būti universali ir naudojama visoje svetainėje, o kitas kodas yra aktualus tik tam tikriems šablonams. Failų struktūros pavyzdžius galite peržiūrėti mano GitHub repozitorijoje. Beje, dirbdamas su WordPress projektais aš paprastai naudoju NPM @wordpress/scripts, kurie leidžia sujungti ir minimizuoti failus vos viena terminalo komanda!
