Vlastné portfólio som odkladal 11 rokov. Keď som sa k nemu konečne dostal, chcel som ho spraviť rýchlo, pekne a tak, aby som s ním nemal zbytočne veľa údržby.
Prvá verzia vznikla ako statická SPA vo Vue 3 a TypeScripte. Bežala na VPS od Websupportu, a keďže doménu som mal tiež tam, stačilo nastaviť DNS, reverse proxy a web bol vonku. Dizajn som ladil s Claude AI a s výsledkom som bol spokojný. Na portfólio to fungovalo veľmi dobre. Problém prišiel až vtedy, keď som chcel začať pravidelnejšie upravovať obsah a pridávať články.
Problém: na úpravy obsahu bol vlastný SPA workflow zbytočne ťažkopádny
Keď som potreboval upraviť pár projektov alebo textov, nebol to neriešiteľný problém. Projekt som si rozbehol lokálne, zmenil čo bolo treba a deploy-ol ho späť na server.
Deployment som mal nastavený cez GitHub priamo na VPS. Na serveri beží Dockge service, ktorý používam ako správcu docker compose súborov. Po deploymente sa projekt v Dockeri reštartoval cez Dockge a web bol aktualizovaný.
Technicky to fungovalo. Lenže na bežnú prácu s obsahom to bolo viac krokov, než som bol ochotný robiť. Nechcelo sa mi pri každom texte upravovať kód, vytvárať nové pages, meniť configy a deployovať zmeny na VPS. Potreboval som jednoduchší spôsob, ako svoj obsah spravovať.
Možnosť 1: napojiť SPA na backend
Prvá cesta bola doplniť k pôvodnej SPA backend.
Na VPS od Websupportu mi už beží Appwrite, ktorý používam aj pri ďalších projektoch. Appwrite ponúka služby ako databáza, autentifikácia, messaging alebo štatistiky. Vďaka výkonu VPS by som dokázal aplikáciu na Appwrite napojiť relatívne rýchlo. Zároveň som nechcel strácať čas vývojom niečoho, čo už existuje. Potreboval som CMS.
Možnosť 2: WordPress
S WordPressom som v minulosti pracoval niekoľko rokov a stále ho beriem ako jedno z najrýchlejších riešení pre blogy a obsahové weby. Ak potrebujete spravovať články, texty a projekty bez toho, aby ste pri každej zmene sahali do kódu, CMS dáva zmysel.
A keďže som mal vo Websupporte doménu, hosting aj VPS, vedel som, že celý presun nebude technicky komplikovaný.
Ako prebiehal presun
Ešte pred samotnou migráciou som si pripravil základ WordPress témy. Claude AI som poskytol dizajn pôvodnej Vue 3 SPA a zadal som mu, aby mi pomohol preniesť ho do WordPress témy.
Po približne pol hodine práce a niekoľkých úpravách som mal pripravenú tému, ktorá vizuálne vychádzala z pôvodného portfólia.
Potom som sa pustil do WordPressu.
Vo Websupporte som si na subdoméne vytvoril službu a spustil inštaláciu WordPressu. Celé to trvalo pár minút. Okrem základných údajov pre WordPress som nemusel riešiť nič špeciálne.
Výhoda bola v tom, že som nemusel ručne nahrávať WordPress cez FTP, pripravovať všetko od nuly ani sa zdržiavať základným setupom. Dostal som funkčný WordPress a mohol som riešiť tému, obsah a doladenie webu.
AI vo WordPresse ako pomocník pri dizajne
Websupport pri WordPresse ponúka aj AI asistenta, ktorý mi pomohol s návrhom webu, dizajnom, farebnými paletami, typografiou aj úpravou obsahu.
Keďže som vlastnú tému už mal, nepotreboval som generovať celý web od nuly. Skôr som chcel zistiť, ako mi vie AI posunúť existujúci dizajn ešte o kúsok ďalej.
Môj prompt pre AI asistenta bol návrh vylepšenia dizajnu naprieč webom, odporučenie vhodného fontu a ladiacej farebnej palety. O niekoľko desiatok minút som mal prvotný návrh, ktorý som vedel ďalej upraviť podľa seba.
AI som nebral ako náhradu za vlastné rozhodovanie. Skôr ako rýchly spôsob, ako si pripraviť dobrý základ a ušetriť čas pri veciach, ktoré by som inak ladil ručne.
Čo som dopracoval ručne
Keď bol WordPress pripravený a téma nasadená, niektoré veci som dopracoval lokálne.
Išlo hlavne o:
- Custom Post Types,
- preklady,
- integráciu niekoľkých JavaScript knižníc,
- lightbox.
Aj tu som si pomáhal s Claude AI. WordPress mi vyriešil správu obsahu, ale stále som si vedel doprogramovať komponentny, ktoré som chcel mať plne pod kontrolou.
Výsledok: portfólio na WordPresse za jeden večer
Výsledok bol hotový približne za 3 hodiny.
Z pôvodnej Vue 3 SPA bežiacej na VPS som mal WordPress web s vlastnou témou, administráciou obsahu a možnosťou jednoducho pridávať články, projekty alebo pracovné informácie.
Získal som najmä:
- jednoduchšiu správu obsahu,
- možnosť písať články bez úpravy kódu,
- vlastnú WordPress tému vychádzajúcu z pôvodného dizajnu,
- priestor dopracovať si vlastné funkcionality,
- rýchlu inštaláciu WordPressu cez Websupport,
- základné pluginy pre bezpečnosť a SEO,
- AI asistenta, ktorý pomohol s doladením dizajnu.
Performance výsledného webu je podľa mojej skúsenosti výborný. Vďaka predinštalovaným pluginom mal web zároveň pripravený základ pre bezpečnosť a SEO.
Čo som si z toho odniesol
Ako developer mám prirodzenú tendenciu veci si vyskladať po svojom. Pri mnohých projektoch to dáva zmysel. No nie vždy je však najlepšie technické riešenie to, ktoré si napíšete celé sami.
V tomto prípade som nepotreboval ďalší custom backend ani vlastné CMS. Potreboval som rýchlo a pohodlne spravovať obsah.
Vue 3 SPA bola dobrá voľba pre statické portfólio. WordPress bol lepšia voľba vo chvíli, keď som chcel začať pravidelne publikovať a meniť obsah bez deploymentu.
A práve tu mi kombinácia priestoru od Websupportu, WordPressu a AI nástrojov ušetrila najviac času. Doména, hosting, VPS, jednoduchá inštalácia WordPressu s AI asistentom aj možnosť doprogramovať si vlastné veci vytvorili setup, ktorý bol hotový za jeden večer a stále ostal dostatočne flexibilný pre developera.
Nie je to príbeh o tom, že custom vývoj je zlý a WordPress je vždy odpoveď. Je to skôr pripomienka, že dobrý technický výber niekedy znamená neskladať od nuly to, čo už spoľahlivo rieši hotový nástroj.