Поднимаем собственный блог на Hugo

Для ведения личного блога технаря существует масса взрослых платформ. Весьма хорош Medium или высококармический аккаунт на Хабре. Мне же лично хочется побольше контроля, поэтому чужие платформы не подоходят.

Очевидным и наиболее удобным решением является GitHub Pages, который, удовлетворяя почти всем моим желаниям, требует привязки домена к github.io и не позволяет контролировать хостинг.

Ничего сложного в том, чтобы повторить фукнционал GitHub Pages самостоятельно, нет. Если вам, разумеется, не жалко лишних 5 $ в месяц на хостинг и пары часов свободного времени.

В конце поста дана инструкция по созданию как бесплатного блога на GitHub Pages, так и платного на собственном хостинге.

Чего мне хотелось от блога и чем я это решал:

• Редактирование постов голым текстом без лишней разметки:

  Для этой цели идеален Markdown, позволяющий простыми ключами добавлять необходимую верстку.

• Версионный контроль текстов:

  Разумеется, git. Работа с текстом без сохранения истории, мягко говоря, непрактична. Отдельное спасибо продуктивному отпуску Линуса Торвальдса.

• Отсутствие необходимости вникать в нюансы работы с фронтендом, адаптивной версткой, динамикой и дизайном:

  Я выбрал статическую генерацию страниц с помощью Hugo. Генераторов статики написано величайшее множество, ввиду сравнительной простоты задачи и внутренней любви разработчиков к велосипедостроению. Тем не менее, для блога нужна не только голая структура разметки, но и дизайн, и верстка (и вкус). Лучшим выбором будет популярный продукт с большим сообществом и набором готовых шаблонов оформления. Hugo предлагает широкий выбор тем, а главное радующее душу гика решение по их хранению в качестве git submodules.

• Контроль над доменом и хостингом, аналитика:

  Домен у меня куплен уже давно, а в качестве хостинга прекрасно подошел самый маленький дроплет на DigitalOcean. Аналитику взял от Google.

  Именно в этом аспекте GitHub Pages мне не подошел. Но если вам достаточно использования домена исключительно под блог, либо домен покупать не хочется — отличный выбор.

• Безопасность (HTTPS):

  Let’s Encrypt! Бесплатный и проверенный Certificate Authority со взрослыми средствами автоматизации дает возможность в пару команд получить заветный сертификат и подключить его к любому популярному веб-серверу. Сертификаты выдаются на 90 дней, но есть возможность автоматизировать их перевыпуск (рекомендуется интервал в 60 дней).

Поднимаем блог за 3 простых шага:

Шаг первый: Hugo и GitHub

• Установить Hugo для своей рабочей ОС.

• Создать сайт, выбрать тему оформления и написать тестовый пост.

  В результате quickstart guide вы получите новый git репозиторий с подключенной через git submodules темой ananke и одним пустым постом в директории content/posts. Там же можно будет поднять локальный веб-сервер, поиграться с блогом в браузере и выбрать тему оформления.

• Создать аккаунт на Google Analytics и подключить его к Hugo.

  Единственный нетривиальный процесс.

  После создания учетной записи скопируйте ваш идентификатор отслеживания вида UA-XXX-XXX и добавьте его в конфигурацию Hugo:

  echo 'googleAnalytics = "UA-XXX-XXX"' >> config.toml
  

  Далее необходимо добавить шаблон трекера к вашей теме. Менее красивая, но более полезная инструкция. Вам необходимо скопировать layout выбранной темы в корень репозитория, оставить в нем только страницу или ее часть, отображаемую везде (в зависимости от темы она может быть разной) и вставить в нее:

  {{ template "_internal/google_analytics.html" . }}
  

• Создать два репозитория на GitHub для хранения исходников блога и готового сайта.

  Важный момент — если вы будете публиковать блог на GitHub Pages, то репозиторий вида <YOUR_NAME>.github.io должен быть публичным, если только на своем сайте — то можно сделать приватным.

  Репозиторий с исходниками блога логично сделать приватным. В инструкции важно:

  • выполнить команду для подключения основного репозитория к репозиторию <YOUR_NAME>.github.io в качестве submodule;
  • скопировать в основной репозиторий скрипт deploy.sh для публикации сайта из исходников.

• Сохранить созданные исходники блога и выгрузить их в основной репозиторий:

  git add .
  git commit -m "Blog - initial commit"
  git remote add origin https://github.com/<YOUR_NAME>/<YOUR_REPO>.git
  git push -u origin master
  

• Опубликовать блог:

  chmod +x deploy.sh
  ./deploy.sh
  

  Если вы опубликовали блог на GitHub Pages — на этом все, приятного использования.

  Следующие два шага нужны для самостоятельного хостинга блога.

Шаг второй: домен, хостинг и DNS

• Купить собственный домен — в среднем, цена на хорошее имя около 20-30 $ в год, но GoDaddy обычно дает ощутимые скидки на первый год, а также позволяет выполнить приватную регистрацию домена.
• Создать аккаунт на DigitalOcean — любезно предложу ссылку с промокодом на 10 $, которой хватит на оплату первых двух месяцев.
• Купить минимальный дроплет за 5 $ в месяц с Ubuntu, сгенерировать большой и надежный пароль для пользователя и сохранить его в 1Password (или любой другой менеджер паролей по вкусу).
• Выставить на дроплете публичный ipv4 адрес и добавить его в A record в панели управления DNS на GoDaddy.

После внесения A record потребуется некоторое время (от пары минут до пары дней), прежде чем DNS записи обновятся и позволят обращаться к нашему сайту по доменному имени.

Шаг третий: настройка портов, веб-сервера и сертификата для HTTPS

• Открыть доступ на дроплет по SSH.

• Установить nginx и открыть доступы к портам HTTP и HTTPS.

• Установить Let's Encrypt, получить сертификат и подключить его к nginx. В процессе настройки утилита предложит создать принудительный редирект HTTP трафика на HTTPS, что весьма рекомендую принять.

• Установить Hugo на дроплет.

• Склонировать на дроплет репозиторий <YOUR_NAME>.github.io:

  git clone https://github.com/<YOUR_NAME>/<YOUR_NAME>.github.io.git
  cd <YOUR_NAME>
  pwd
  

• Указать nginx директорию со статикой, полученную в предыдущем пункте.

Voilà! Наш блог готов. Остается самое сложное — придумать, что в него писать.

Как насчет статьи о том, как поднять собственный блог?