Установка Hugo и хостинг на GitPages

Максим Девятов
Web
Содержимое страницы

Интро

Блог полезный инструмент маркетинга, удобный способ вести дневник а также отличный вариант сохранения инструкций для последующего воспроизведения. Душа радуется когда находишь хорошо структурированную документацию или how-to. Давно убежден в том, что знаниями обязательно нужно делиться, так что будем считать что пришло время внести и свой вклад.

Что такое Hugo?

Hugo это генератор статических сайтов, который упрощает и ускоряет создание сайта за счет предварительно созданной схемы взаимодействия страниц и блоков информации. В дополнение к этому существует множество готовых тем, которые легко использовать с вашим контентом. Более того, даже написание и оформление статей не требует знания разметки HTML/CSS, контент можно оформлять, используя разметку markdown.

Установка Hugo

  1. На Mac установка происходит с помощью homebrew, который при остутствии в системе можно установить с помощью:
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)"
  1. Установка Hugo:
brew install hugo
  1. Создать и перейти в папку где будете размещать проект:
mkdir projects
cd projects
  1. Запускам Hugo для генерации структуры папок:
hugo new site [имя_проекта]

Настройка интеграции с GitHub

Необходимо создать два репозитория: один для публичной части сайта, то есть той части которая будет обслуживаться хостингом Git Pages и второй репозиторий, в котором останутся исходники сайта. Такой способ позволит изолировать набор данных который содержит служебную информацию и заготовки статей от видимого пользовтелями сайта.

Настройка Git/GitHub репозитория для исходных файлов

В папке проекта создаем локальный репозиторий и настраиваем его:

# 1.1 Инициализация git в текущем каталоге
git init

# 1.2 Добавляем ссылку на внешний репозиторий 
# username - ваш профиль в github
git remote add origin https://github.com/[username]/blog_source     

# 1.3 Добавляем отслеживаемые файлы в локальном репозитории
git add .

# 1.4 Начальный коммит
git commit -m 'Initial commit. Source files.'

# 1.5 Переименование локальной ветки под грядущие стандарты отказа от слов типа "master", "blacklist" и тд
git branch -M main

# 1.6 Загружаем локальный репозиторий на github
git push -u origin main

Настройка git submodule

Использование git submodule дает нам возможность создать внутри проекта сабмодуль который будет иметь независимую ветку и историю обновлений.

# В корневой папке вашего проекта:
git submodule add https://github.com/[username]/blog public

Создаем индекс для каталога public

# Генерируем каталог с контентом
hugo

# Генерируем индекс git для public
cd public
git add .
git commit -am 'Add public'
cd ..

Обновляем индекс для всего проекта

git add .
gir commit -m 'Update submodule link'

Отправляем весь апдейт на Github

git push -u origin main --recurse-submodules=on-demand

Логика обновления блога на GitPages

Все необходимые шаги мы рассмотрели. Итоговая памятка по последовательности размещения постов:

1. После сохранения новых файлов/постов из корневого каталога делаем генерацию контента:
hugo
2. Обновляем индекс в сабмодуле:
cd public
git add .
git commit -m 'Update some post'
cd ..
3. Обновляем индекс всего проекта
git add .
git commit -m 'Update site'
git push -u origin main --recurse-submodules=on-demand

Полагаю, что все это можно для удобства поместить в скрипт и навесить на удобный хоткей в Neovim.