Семь лет назад я выбрал blogger как платформу для блога, потому что он поддерживал Windows Live Writer и был бесплатным. Сейчас Live Writer уже не поддерживается, стал модным “отзывчивый” дизайн и язык разметки markdown. Пришло время что-то менять.

Блог должен быть быстрым

Когда пользовался blogger меня изрядно бесило, что страницы открываются по 4-5 секунд на компьютере. На планшете можно было скроллить страницу только секунд через 10 после открытия. Хотелось, чтобы блог открывался менее чем за секунду и ничего не мешало сразу его проскроллить. Нужен был движок в котором я смогу контролировать разметку.

Блог должен быть бесплатным

Я, как и любой человек, люблю халяву. Ставить свою CMS и платить за хостинг мне не хотелось, но все бесплатные платформы - крайне медленные. Отличный вариант - GitHub Pages. По сути это бесплатный хостинг, но без бекенда. Вместо бекенда можно использовать статический генератор сайтов - Jekyll.

Jekyll и GitHub Pages

Для программистов это известная последовательность действий. Надо закидывать файлы в репозиторий на github и они автоматически превращаются в посты блога. Jekyll сам собирает список постов и rss-ленту по шаблонам.

Посты можно писать в html, markdown и textile. Этот пост, например, написан в markdown. Для публикации фрагментов кода можно использовать github-flavored markdown, например так:

window.myappName$ = window.myappName$ 
                    || jQuery.noConflict(true);
                    
(function($) {
    if (!_spBodyOnLoadCalled) {
        _spBodyOnLoadFunctions.push(pageLoad);
    } else {
        pageLoad();
    }

    function pageLoad() {
        $('#pageTitle span').text('Hello from jQuery');
    }

    RegisterModuleInit(
            _spPageContextInfo.webServerRelativeUrl 
                + '/appname/script.js', 
            pageLoad);
})(window.myappName$);

Разметка генерируется на сервере и больше не нужны javascript-библтотеки для подсветки.

В итоге удалось добиться, что страница полностью отображается и работает менее, чем за секунду. Даже на мобильном телефоне.

Дизайн блога

Я начала с выбора темы для блога. Хотел простую тему, с двумя колонками, минимумом оформления и адаптивной версткой. Оказалось не так легко найти подходящий вариант - современный блог это куча картинок и пара строк текста, а мне нужно наоборот.

Остановился на теме Clean Blog, которую нашел одной из первых. Для нее есть готовый Jekyll шаблон. Над темой пришлось пошаманить - добавить вторую колонку, сделать русские шрифты, переделать less в scss стили.

Только картинку в шапке из шаблона оставил без изменений.

Недостатки

GitHub Pages не поддерживает плагины для Jekyll, кроме небольшого набора. Из-за этого, например, нельзя сделать даты на русском яызке. Надо будет шаманить в JavaScript, это негативно скажется на скорости загрузки страницы.

Из-за того, что нет бекенда, сложно сделать поиск или просто фильтровать список постов по тегам. Надо весь функционал выносить во внешние сервисы, как disqus для комментариев.

Заключение

Если вам интересно как делать сайты без бекенда, то посмотрите курс на Pluralsight “Web Applications Without a Server”. Меня во многом вдохновил этот курс.

Теги : блог, Jekyll, GitHub