W życiu każdego bloggera przychodzi taki moment, w którym zaczyna blogować o blogowaniu. U mnie wypada to teraz. Jak pewnie zauważyliście, na blogu nastąpiły drobne zmiany stylistyczne. Pod maską natomiast zmiany są drastyczne: przeniosłem wszystko na platformę Jekyll.

Czym jest Jekyll?

Jekyll jest frameworkiem do blogowania. Różni się jednak od klasycznych narzędzi tego typu. Cała treść generowana jest po stronie autora strony, a na serwer trafiają jedynie statyczne pliki. Nie ma tu żadnej bazy danych, dziurawych pluginów i ponownego generowania tej samej treści.

Zlikwidowanie wartwy aplikacji webowej wydaje się cofnięciem o 20 lat w rozwoju. Ma to jednak wymierne korzyści:

  • zmniejszamy powierzchnię ataku
  • zwiększamy wydajność strony

Z miejsca eliminujemy błędy związane z uwierzytelnianiem, autoryzacją, kontrolą sesji użytkownika, wstrzykiwaniem kodu (SQLi, RCI), międzydomenowym fałszowaniem żądań (CSRF) i pewnie wiele innych. Oczywiście możemy zwiększyć ponownie powierzchnię ataku, odbierając dane od użytkownika, jednak w większości przypadków związanych z blogowaniem jest to po prostu zbędne.

Jednocześnie usuwamy wąskie gardła – komunikację aplikacji z bazą danych i innymi zasobami sieciowymi. Statyczne pliki mają jeszcze jedną zaletę: serwer WWW kompresuje je znacznie wydajniej niż treść generowaną dynamicznie. W moim przypadku czas łączny ładowania strony głównej zmniejszył się o 2/3.

Layouty, wpisy i metadane

Layout i treść strony generowane są z plików HTML i MarkDown przez silnik Liquid. Wygląda to podobnie do widoków w ASP.NET MVC. Istnieją tu koncepcje layout, view, partial view etc. Są po prostu inaczej nazwane. Największa wada? Nie ma gotowych layoutów. Największa zaleta? Nie ma gotowych layoutów.

Wordpress jest świetny do szybkiego rozpoczęcia przygody z pisaniem. Niestety, layouty zwykle są marnej jakości i nie są responsywne. Jakby tego było mało, do każdej pierdoły potrzebny jest plugin, który jeszcze bardziej psuje strukturę plików HTML i CSS. Spotkałem się z pluginami doklejającymi wszystkie swoje style w treść HTML. Za każdym przeładowaniem strony konieczne było pobranie na nowo tych samych stylów.

Wersja dla leniwych jest prosta – możemy skorzystać ze standardowego layoutu Jekylla.

Jak już wspomniałem, wpisy trzymamy w plikach HTML/MarkDown. Metadane przechowywane są razem z treścią wpisu, na samej górze dokumentu. Mają postać dokumentu YAML.

Serve i Build

Jekyll posiada dwa polecenia służące do kompilowania projektu do statycznej strony:

  • jekyll build
  • jekyll serve

Build wykonuje jednorazową przebudowę projektu. Serve buduje projekt i czeka na zmiany w plikach projektu.

Instalacja środowiska (Windows)

Najpierw instalujemy manager pakietów Chocolatey. Chocolatey można porównać do apt-get z systemów GNU/Linux lub Homebrew z Mac OS. Uruchamiamy polecenie:

@powershell -NoProfile -ExecutionPolicy unrestricted -Command "iex ((new-object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))" && SET PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin

Następnie instalujemy wszystkie niezbędne paczki oraz gemy. Gemy są paczkami języka Ruby. Uruchamiamy ponownie konsolę i wpisujemy:

choco install git ruby ruby2.devkit 7zip.commandline
(echo --- && echo - C:/tools/ruby215) > C:/tools/DevKit2/config.yml && cd C:/tools/DevKit2 && ruby dk.rb install && cd ..
@powershell -NoProfile -ExecutionPolicy unrestricted -Command "iex ((new-object System.Net.WebClient).DownloadFile('https://github.com/rubygems/rubygems/archive/v2.4.6.zip','rubygems-2.4.6.zip'))"
7za x rubygems-2.4.6.zip && cd rubygems-2.4.6 && ruby setup.rb && cd .. && rd /s /q rubygems-2.4.6 && del /s /q rubygems-2.4.6.zip

Ponownie restartujemy konsolę i wpisujemy:

gem install jekyll rouge

Przechodzimy do wybranego katalogu i tworzymy nowy projekt Jekylla:

jekyll new appName
cd appName
echo highlighter: rouge>> _config.yaml

Możemy uruchomić aplikację:

jekyll serve

W tym momencie pod adresem http://localhost:4000 działa statyczna strona WWW z przykładowym wpisem. Każda zmiana w plikach projektu spowoduje natychmiastową przebudowę projektu.

Uwaga: plik _config.yml jest ładowany jednorazowo. Żeby załadować go ponownie, wymagane jest ponowne uruchomienie polecenia jekyll serve.

Import bloga z Wordpressa

Na początek wymieńmy rzeczy, które można zaimportować:

  • wpisy,
  • statyczne strony,
  • metadane wpisów i stron.

Oznacza to tyle, że nie ma możliwości automatycznego przeniesienia layoutu, o czym wspominałem wcześniej.

Proces importowania zaczynamy od instalacji niezbędnych gemów:

gem install sequel fileutils safe_yaml unidecode mysql2 htmlentities jekyll-import

Przechodzimy do katalogu utworzonego wcześniej projektu. Następnie tworzymy plik import.rb. Wstawiamy do niego dane do Wordpressa:

require "jekyll-import";
JekyllImport::Importers::WordPress.run({
  "dbname"   => "",
  "user"     => "",
  "password" => "",
  "host"     => "localhost",
  "socket"   => "",
  "table_prefix"   => "wp_",
  "clean_entities" => true,
  "comments"       => true,
  "categories"     => true,
  "tags"           => true,
  "more_excerpt"   => true,
  "more_anchor"    => true,
  "status"         => ["publish"]
})

Teraz uruchamiamy skrypt:

ruby -rubygems import.rb

Po wykonaniu importu warto przejrzeć zawartość plików .markdown i poprawić ewentualne błędy. Przydatna będzie funcja znajdź i zastąp. ;-)

Materiały dodatkowe: