Igor Kulman

Návrat statického webu

· Igor Kulman

Ak sledujete trendy vo svete webového vývoja, možno ste si na Smashing Magazine všimli článok s názvom Why Static Website Generators Are The Next Big Thing. Článok popisuje výhody statických webov, možnosti a nástroje na ich generovanie a pod. Ja som sa rozhodol oba svoje weby (osobný www.kulman.sk a programátorský blog blog.kulman.sk) previesť práve na staticky generované weby. Aká bola motivácia a skúsenosti?

Wordpress

Ako prvý som sa rozhodol previesť blog.kulman.sk. Keď som ho pred pár rokmi zakladal, rozhodol som sa použiť Wordpress. Je to najrozšírenejšie CMS, stále aktívne vyvíjané a existuje pre neho obrovské množstvo pluginov.

S Wordpresssom som však nebol vôbec spokojný. Používať Wordpress totiž znamená

  • neustále updatovať Wordpress (našťastie sa to už deje automaticky) kvôli bezpečnostným chybám
  • neustále updatovať pluginy kvôli bezpečnostným chybám
  • po update pluginov zistovať, ktoré pluginy sú zrazu v konflikte a niečo rozbili
  • neustále čeliť automatizovaným útokom (daň za popularitu Wordpress)

Písanie článkov pritom nie je nijak extra pohodlné, zmeniť niečo vo Wordpresse alebo v používanej nie je často úplne jednoduché. Všetko to ma počas posledných rokov naozaj štvalo, a tak som sa rozhodol, konečne s tým niečo spraviť. Zahodiť Wordpress a prejsť na staticky generovaný web.

Staticky generovaný web

Ako funguje staticky generovaný web? Presné fungovanie záleží od použitého statického generátora ale princíp je vždy v podstate rovnaký. Web obsahuje stránky / články a šablóny, ktoré sa na nich majú aplikovať. Pri prvotnom vytvorení projektu teda vytvoríte požadované šablóny (na detail, výpis, úvod a pod.) a potom už len vytvárate nové stránky / články.

Väčšina generátorov využíva Markdown formát na písanie článkov, kvôli jeho jednoduchosti a prehľadnosti. Po pridaní nového článku spustíte statický generátor a ten aplikuje šablóny a vygeneruje vám statický web.

Výsledný statický web nepotrebuje žiadnu databázu, žiadne PHP, žiadne CMS, žiadne aktívne prvky. Môžete ho hostovať v podstate kdekoľvek. Web bez aktívnych prvkov je samozrejme rýchlejší (žiadne otváranie pripojenia do DB a pod.) a bezpečnejší (žiadna administrácia, ktorú by vám niekto hackol).

Hugo

Statických generátorov existuje v súčasnosti obrovské množstvo (viď. článok na Smashing Magazine), ja som si zvolil Hugo. Hugo je napísaný v Go, distribuje sa ako jediná binárka bez akýchkoľvek závislosti a bez problémov funguje aj s Windows. Samozrejmosťou je nástroj na export článkov z Wordpressu a ich prevod na Markdown.

Zdrojáky pre blog.kulman.sk som umiestnil na GitHub a ako hosting som zvolil GitHub Pages.

Vďaka prepojeniu s Gitom vyzerá moje flow pri písaní nového článku nasledovne

  • vytvorím nový článok pomocou hugo new post/some-post.md
  • príkazom hugo server spustím server na localhoste a vidím “živú” verziu webu
  • napíšem text daného článku, väčšinou v Sublime Text
  • server bežiaci na localhoste zaregistruje zmeny v súboroch a vykoná refresh v prehliadači
  • skontrolujem či článok vyzerá ok
  • ak je všetko ok, prikázom hugo vygenerujem statický web do adresára public (git vetva gh-pages ako submodul)
  • commitnem zpushnem zmeny v adresári public
  • GitHub do pár minút zaregistruje zmeny a nasadí novú verziu webu
  • commitnem a pushnem nový článok do Gitu

Uznávam, že to nie je flow vhodné úplne pre každého, ale človek so základmi Gitu ho určite zvládne.

Záver

Použitím statického generátoru som získal rýchlejší, bezpečnejší a jednoduchší web, nad ktorým mám plnú kontrolu. Zároveň som o nič neprišiel, keďže na komentáre používam Disqus, takže fungujú aj naďalej.

Statický generovaný web však určite nie je vhodný pre každého. Najmä ak máte na webe nejaké dynamické prvky alebo vám nevyhovuje Markdown a občasné použitie príkazového riadku.