Установка и использование Hugo на Debian 11

Что такое Hugo в одной строке: Hugo — это генератор статических сайтов с открытым исходным кодом, написанный на Go; он собирает шаблоны и контент в статические HTML-файлы без необходимости в базе данных.

Перед началом

• Сервер с Debian 11 (Bullseye).
• Настроен пароль root или учётная запись с sudo-доступом.

Важно: Hugo генерирует статические файлы — это снижает поверхность атаки по сравнению с традиционными CMS, но всё равно планируйте безопасный процесс деплоя и обновления.

Установка Hugo на Debian 11

По умолчанию пакет Hugo доступен в репозитории Debian 11. Установите командой:

apt-get install hugo -y

Проверьте версию Hugo:

hugo version

Ожидаемый вывод (пример):

Hugo Static Site Generator v0.80.0/extended linux/amd64 BuildDate: 2021-07-18T09:31:51Z (debian 0.80.0-6+b5)

Примечание: версия в репозиториях может отличаться. Если вам нужна последняя версия или расширённая сборка с поддержкой SCSS/JS, рассмотрите установку из релизов GitHub или сборку из исходников.

Создание сайта с Hugo

Создадим сайт с именем hugo.example.com:

hugo new site hugo.example.com

Пример вывода после создания сайта:

Congratulations! Your new Hugo site is created in /root/hugo.example.com.

Just a few more steps and you're ready to go:

1. Download a theme into the same-named folder.
   Choose a theme from https://themes.gohugo.io/ or
   create your own with the "hugo new theme " command.
2. Perhaps you want to add some content. You can add single files
   with "hugo new /.".
3. Start the built-in live server via "hugo server".

Visit https://gohugo.io/ for quickstart guide and full documentation.

Посмотреть содержимое каталога проекта:

ls -l hugo.example.com

Пример вывода:

drwxr-xr-x 2 root root 4096 Nov 13 09:27 archetypes
-rw-r--r-- 1 root root   82 Nov 13 09:27 config.toml
drwxr-xr-x 2 root root 4096 Nov 13 09:27 content
drwxr-xr-x 2 root root 4096 Nov 13 09:27 data
drwxr-xr-x 2 root root 4096 Nov 13 09:27 layouts
drwxr-xr-x 2 root root 4096 Nov 13 09:27 static
drwxr-xr-x 2 root root 4096 Nov 13 09:27 themes

Создание страницы “About” и примера поста

Перейдите в папку сайта:

cd hugo.example.com

Создайте страницу About:

hugo new about.md

Пример вывода:

/root/hugo.example.com/content/about.md created

Отредактируйте content/about.md (используйте ваш любимый редактор, в примере — nano):

nano content/about.md

Содержимое файла:

---
title: "About Us"
date: 2021-11-13T09:28:18Z
draft: false
---

This is About Us page for this website.

Создаём пример поста:

hugo new post/page.md

Пример вывода:

/root/hugo.example.com/content/post/page.md created

Отредактируйте content/post/page.md:

nano content/post/page.md

Содержимое примера:

---
title: "Page"
date: 2021-11-13T09:29:29Z
draft: true
---

# Hugo Page

This is my first hugo website page!

Оставьте черновик (draft: true) до тех пор, пока не будете готовы публиковать.

Установка темы для сайта

Hugo отображается с темой; скачайте и настройте одну из тем с https://themes.gohugo.io/.

Перейдите в папку themes:

cd themes

Скачиваем тему (пример с GitHub):

wget https://github.com/digitalcraftsman/hugo-strata-theme/archive/master.zip
unzip master.zip
mv hugo-strata-theme-master hugo-strata-theme

Скопируйте пример конфига темы в конфигурацию сайта:

cat hugo-strata-theme/exampleSite/config.toml > ../config.toml

Отредактируйте ../config.toml и измените или добавьте пункты меню:

nano ../config.toml

Добавьте или измените строки:

baseurl = "/"

[[menu.main]]
  name = "About"
  url  = "about"
  weight = 5

Создайте файл layouts/index.html, если тема не предоставляет нужного шаблона:

cd ../
nano layouts/index.html

Пример содержимого шаблона главной:

{{ define "main" }}
        {{ if not .Site.Params.about.hide }}
                {{ partial "about" . }}
        {{ end }}

        {{ if not .Site.Params.portfolio.hide }}
                {{ partial "portfolio" . }}
        {{ end }}

        {{ if not .Site.Params.recentposts.hide }}
                {{ partial "recent-posts" . }}
        {{ end }}

        {{ if not .Site.Params.contact.hide }}
                {{ partial "contact" . }}
        {{ end }}
{{ end }}

Сохраните и закройте файл.

Сборка и запуск сайта

Соберите статические файлы командой:

hugo

Пример вывода сборки:

    {{ with .OutputFormats.Get "RSS" }}{{ .RelPermalink }}{{ end }}

                   | EN  
-------------------+-----
  Pages            |  8  
  Paginator pages  |  0  
  Non-page files   |  0  
  Static files     | 26  
  Processed images |  0  
  Aliases          |  2  
  Sitemaps         |  1  
  Cleaned          |  0  

Total in 48 ms

Запустите встроенный сервер разработки и привяжите по IP сервера (замените IP на ваш):

hugo server --bind=0.0.0.0 --baseUrl=http://104.245.34.233 -D -F

Пример запуска сервера:

    {{ with .OutputFormats.Get "RSS" }}{{ .RelPermalink }}{{ end }}

                   | EN  
-------------------+-----
  Pages            | 11  
  Paginator pages  |  0  
  Non-page files   |  0  
  Static files     | 26  
  Processed images |  0  
  Aliases          |  3  
  Sitemaps         |  1  
  Cleaned          |  0  

Built in 42 ms
Watching for changes in /root/hugo.example.com/{archetypes,content,data,layouts,static,themes}
Watching for config changes in /root/hugo.example.com/config.toml
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://104.245.34.233:1313/ (bind address 0.0.0.0)
Press Ctrl+C to stop

По умолчанию разработческий сервер слушает порт 1313.

Доступ к сайту

Откройте в браузере:

http://ваш-ip-сервера:1313

Вы должны увидеть страницу, сгенерированную Hugo:

Нажмите на ссылку About в левой панели, чтобы увидеть страницу “About”:

Альтернативы и когда Hugo не подходит

• Если вам нужна динамика на стороне сервера (пользовательские формы, аутентификация, персонализованный контент), лучше использовать CMS с серверной логикой (например, WordPress, Django).
• Если проект требует частых мелких изменений от нетехнических редакторов, рассмотрите headless CMS + CI/CD, чтобы скрыть сборку сайта от пользователей.

Советы по деплою и безопасности

• Генерируйте сайт локально или в CI и деплойте статические файлы на CDN или static host (Netlify, GitHub Pages, Vercel, S3 + CloudFront).
• Обновляйте Hugo и зависимости темы для получения исправлений безопасности.
• Настройте HTTPS (Let’s Encrypt) перед открытием сайта в продакшн.
• Ограничьте доступ к серверу разработки — он предназначен только для локальной разработки.

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

Чеклист для развёртывания

• Установлен и протестирован hugo (hugo version)
• Сайт собирается без ошибок (hugo)
• Конфигурация темы настроена (config.toml)
• Черновики переведены в опубликованные или исключены (draft: false)
• HTTPS настроен на продовом домене
• Автоматизированный деплой через CI настроен (опционально)

Критерии приёмки

• Сайт открывается по https и не возвращает ошибок 4xx/5xx.
• Контент отображается корректно: меню, страницы, посты, медиа.
• Производительность удовлетворяет требованиям (быстрая загрузка без серверной обработки).

Простая методология работы с Hugo

1. Разработка локально: git clone, создать branch, править контент и шаблоны.
2. Сборка в CI: запуск hugo, тестирование результата.
3. Деплой: выгрузка /public на CDN или static host.

Mermaid-диаграмма выбора способа деплоя:

flowchart TD
  A[Генерация статического сайта] --> B{Где хостить?}
  B --> C[CDN / Static host]
  B --> D[Сервер + Nginx]
  C --> E[Netlify / Vercel / GitHub Pages / S3+CloudFront]
  D --> F[Разместить /public в /var/www и настроить Nginx]

Краткие рекомендации по темам и кастомизации

• Выбирайте тему, у которой есть пример сайта (exampleSite) — это ускоряет настройку.
• Если нужна поддержка SCSS, используйте extended-версию Hugo.
• Для больших сайтов организуйте структуру контента по разделам и используйте мульти-ленгв для переводов.

Заключение

Поздравляем — вы установили Hugo и создали базовый сайт на Debian 11. Hugo подходит для быстрых, безопасных и масштабируемых статических сайтов. Следуйте чеклисту и настройте автоматический деплой, чтобы превратить локальную сборку в стабильный продакшн-процесс.

Ключевые действия для следующего шага: выберите хостинг для статических файлов, настройте HTTPS и интегрируйте CI для автоматического билда и деплоя.