O mnieBlogGitHub

Blog - jaką platformę wybrać?

01 October, 2019 - 3 min read

Na dziś odpowiedź brzmi: Gatsby.

Próbowałem wcześniej z WordPressem, potem eksperymentowałem ze statycznym generatorem (Hexo), potem wróciłem do WordPressa, by na końcu wylądować tutaj, czyli statycznym generatorem, jakim jest Gatsby.

WordPress wydawał mi się dotychczas domyślnym rozwiązaniem dla strony typu blog. Ma on kilka plusów:

  • znana platforma - wiele lat temu z niego korzystałem (kiedy byłem programistą PHP :P),
  • bardzo dużo gotowych - darmowych lub płatnych - szablonów, co pozwala szybko osiągnąć atrakcyjny efekt wizualny,
  • trylion wtyczek, a więc: "jeśli masz jakiś problem, to na pewno został on rozwiązany"
  • rozbudowany CMS - mamy posty, grafikę, tagi, kategorie itp.
  • na wielu hostingach można go zainstalować "1 kliknięciem"

W zderzeniu z rzeczywistością Anno Domini 2019 okazało się, że są jednak minusy:

  • instalacja, aktualizacja i konfiguracja WordPressa, MySQL to na dzisiejsze za dużo pracy; hostowanie z własną domeną na wordpress.com nie opłaca się finansowo
  • tam jest jednak pod spodem PHP! ;)

Dlaczego statyczny generator?

Statyczny generator stron to narzędzie oparte np. o Node.js, dzięki któremu przetwarzamy jedną postać strony/bloga (np. pliki markdown) - w statyczną stronę, opartą tylko o HTML, JS i CSS. Na rynku jest całkiem sporo, można sobie przebierać, zależnie od silnika, możliwości, "dojrzałości" społeczności - polecam stronę https://www.staticgen.com/, z listą generatorów.

Jakie możliwości daje statyczny generator?

  • możliwość hostowania "wszędzie" - finalna strona to są same pliki HTML, CSS i JS, więc można nawet wrzucić ten content na Azure Blob Storage i już
  • interfejs command-line (nie wiem, czy we wszystkich, ale na pewno w wielu, zwłaszcza tych opartych o Node.js), bliski programistycznemu sercu
  • bezpieczeństwo - to nie jest PHP z dziurami, które trzeba pilnować, aktualizować itp.
  • prostsze zarządzanie - nie muszę logować się do jakiegoś CMSa, podawać hasła itp.; mogę całą stronę/bloga trzymać na GitHubie i po porstu git commit/git push i mam zaktualizowaną treść
  • większa elastyczność i łatwiejsze rozszerzanie funkcjonalości - to nie jest PHP, tylko np. JavaScript/TypeSciprt

Czemu więc niw udało się z Hexo? Pewnie było kilka powodów:

  • może jeszcze nie byłem gotowy na zmianę w myśleniu o "silniku do bloga"
  • próg wejścia był spory (konfiguracja, szablony), a w zasadzie silnik działał jedynie w oparciu o pliki markdown
  • nie znalazłem satysfakcjonującego gotowego szablonu

A teraz cały na biało - Gatsby

Gatsby zainteresował mnie dwoma "ficzerami":

  • wykorzystanie Reacta - czyli przyjazne środowisko: nie muszę samemu pisać szablonu w gołym HTML-u/CSS-ie
  • możliwość podpięcia jako wejścia dowolnego źródła z contentem - via GraphQL.

Okazało się, że uruchomienie jest bardzo proste, zwłaszcza przy wykorzystaniu gotowych (starterów)[https://www.gatsbyjs.org/starters/]. Dodatkowo, za rękę prowadzi (tutorial)[https://www.gatsbyjs.org/tutorial/], więc próg wejścia jest bezbolesny. Dzięki temu, że renderowanie "contentu" jest oddzielone od źródła danych ("separation of concerns" ;)), możemy w zasadzie tworzyć treść strony/bloga w dowolny sposób - albo po prostu jako treść pomiędzy komponentami Reactowymi, albo z wykorzystaniem wtyczki, która będzie źródłem danych dla kwerend GraphQL, np. w plikach Markdown, ale też wykorzystaniem zewnętrznego CMSa, w tym - WordPressa. A do tego z Gatsby'ego łatwo zdiplojujemy na (Surge)[https://surge.sh/] czy (Netlify)[https://www.gatsbyjs.org/docs/deploying-to-netlify/], tak więc byłskawicznie możemy stworzyć jakiś proof-of-concept i podzielić się nim z kimś, przesyłając linka.

I ten właśnie miks - z jednej strony pełna elastyczność, a z drugiej łatwość osiągnięcia zadowalającego efektu, startując z poziomu 0 - jest wielką siłą Gatsby'ego. A do tego cały sztafaż znajomych narzędzi - Node'owe CLI, git, VS Code, React - czyni pracę bardzo przyjazną. Wydaje mi się zatem, że Gatsby stanie się moim podstawowym narzędziem do budowy blogów i prostych stron - ten Gatsby to naprawdę "Wielki Gatsby". ;)

P.S. Dla ciekawych - tę stronę zbudowałem w oparciu o starter gatsby-starter-julia ((link)[https://www.gatsbyjs.org/starters/niklasmtj/gatsby-starter-julia/]).