Cloudflare Pages: пошаговая инструкция по развёртыванию сайта

Cloudflare Pages — это бесплатная платформа от Cloudflare для сборки и хостинга статических сайтов и фронтенд‑приложений с интеграцией с Git‑репозиториями. Сервисы Cloudflare (CDN, SSL, защита и аналитика) автоматически используются для быстрой и безопасной доставки вашего сайта по всей сети.

Основные сценарии применения — хостинг лендингов, документации, блогов, маркетинговых страниц, а также JAMstack‑приложений, которые собираются (build) при каждом коммите в Git и автоматически разворачиваются из репозитория. Платформа особенно удобна, когда нужен быстрый деплой фронтенда без администрирования серверов, с глобальным CDN, автоматическими превью веток и поддержкой серверлесс‑функций для небольшой динамики.

Cloudflare берет код прямо из вашего GitHub репозитория.

• Создайте файл .gitignore в корне папки проекта (рядом с hugo.toml), чтобы не загружать лишний мусор. Вставьте туда:

# Hugo build output
public/
resources/
hugo_stats.json
 
# Build lock
.hugo_build.lock
 
# IDE
.vscode/
.idea/
.DS_Store

• Инициализируйте локальный репозиторий и залейте код на GitHub: (Выполните эти команды в терминале в папке проекта):

git init
git add .
git commit -m "Final release: Ready for deploy"

• Создайте новый репозиторий в сервисе GitHub (назовите, например, antidetecthub). Репозиторий можно и нужно делать приватным, если вы не хотите, чтобы кто-то скачал ваш исходный код, структуру или текстовую базу данных. Есть ли ограничения? На бесплатном тарифе GitHub и Cloudflare лимитов на приватные репозитории для таких задач практически нет.
• Свяжите и отправьте код: (GitHub выдаст вам эти команды после создания репозитория, просто скопируйте их):

  git branch -M main
  git remote add origin https://github.com/ВАШ_НИК/antidetecthub.git
  git push -u origin main

  После последней команды у вас запроси ваш логин (ник) и пароль, но это не пароль к сервису, а токен (Personal Access Token, PAT), который вы должны создать. Создай PAT: GitHub → Settings → Developer settings → Personal access tokens → Tokens (classic) → Generate new token, выдай права минимум repo, скопируй токен. Есть вариант 2 для заливки вашего кода на GitHub перейти на SSH в этом случае вам не нужен токен.

1. Зайдите в Cloudflare Dashboard.
2. В меню слева выберите Compute & AI → Workers & Pages.
3. Нажмите эту кнопку +Add и выберите Pages (Deploy websites).
4. Выберите ваш GitHub-аккаунт и репозиторий antidetecthub.
5. Нажмите Begin setup.

Здесь совершается 90% ошибок. Внимательно заполните поля:

• Project name: antidetecthub (или как хотите).
• Production branch: main.
• Framework preset: Выберите Hugo.
• Build command:

  hugo --gc --minify

  (это оптимизирует код при сборке).

• Build output directory: public (оставьте как есть).

❗ Самый важный момент (Environment Variables): Cloudflare по умолчанию использует древнюю версию Hugo. Нам нужно заставить его использовать новую.

• Нажмите Environment variables (advanced).
• Нажмите Add variable.
• В поле Variable name напишите: HUGO_VERSION
• В поле Value напишите: 0.152.2 (или новее, это та версия, на которой вы работали).
• Нажмите Save and Deploy.

Ждем сборку (Build). Это займет около 30-60 секунд. Если все пройдет успешно получаем сообщение: Success! Your project is deployed to Region: Earth

На предыдущем шаге, Cloudflare запустил ваш сайт в домене pages.dev. Вы можете исследовать его, но в моем случае часть функционала работать не будет, так как я в hugo.toml сразу задал параметр baseURL с указанием на мой личный домен.

Если на https://antidetecthub.pages.dev работает, подключаем ваш красивый домен https://antidetecthub.com

1. В Cloudflare в разделе вашего проекта (Pages) перейдите во вкладку Custom domains.
2. Нажмите Set up a custom domain.
3. Введите antidetecthub.com.
4. Нажмите Continue → Activate Domain.
5. Cloudflare автоматически настроит DNS-записи (CNAME).