Гид по технологиям

Как создать блог на Jekyll и разместить его на GitHub Pages

6 min read Web Обновлено 01 Dec 2025
Создать блог на Jekyll и GitHub Pages
Создать блог на Jekyll и GitHub Pages

Зачем использовать Jekyll и GitHub Pages

Если вы хотите начать блог, первое, что приходит в голову многим — WordPress. Он мощный, но не всегда нужен: для простого блога лёгкое, быстрое и недорогое решение лучше. Jekyll — генератор статических сайтов: он превращает Markdown в готовый HTML. GitHub Pages позволяет бесплатно хостить такой сайт и автоматически публиковать его из репозитория.

Коротко: минимальные расходы, простое обновление через git, быстрая загрузка страниц и высокая отказоустойчивость благодаря статическим страницам.

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

Вы будете запускать Jekyll на своём компьютере. Официально поддерживаются macOS и Linux. Инструкции ниже охватывают обе ОС; инструкции для Linux часто работают и в Windows через WSL (Ubuntu), но это не тестировалось официально.

Вам также нужен текстовый редактор. Простые редакторы вроде TextEdit или GEdit подойдут, но удобнее использовать VS Code, Sublime Text или другой мощный кроссплатформенный редактор.

Что нужно знать

Нужно базовое знание командной строки и git/GitHub. Если вы ещё не знакомы с git — пройдите вступительный туториал по git. Jekyll использует Markdown для записи статей: это простой синтаксис для форматирования текста.

Иллюстрация: запуск Jekyll и GitHub Pages на локальной машине

Установка Jekyll и зависимостей

Дальнейшие шаги тестировались на macOS Mojave и Ubuntu 18.04. На других версиях возможны отличия — проверяйте официальную документацию Jekyll при необходимости.

macOS

  1. Установите инструменты командной строки Xcode:
xcode-select --install
  1. Установите Jekyll и Bundler (рекомендуется устанавливать в директорию пользователя):
gem install --user-install bundler jekyll
  1. Если при установке Ruby-гемов вы увидите предупреждение о том, что путь к gem-бинарникам не в PATH, добавьте его в профиль. На macOS Catalina и выше по умолчанию используется zsh, поэтому правьте ~/.zshrc; на старых macOS — ~/.bash_profile или ~/.bashrc.

Пример для bash (замените версию на вашу, если требуется):

echo 'export PATH=$HOME/.gem/ruby/2.6.0/bin:$PATH' >> ~/.bash_profile
source ~/.bash_profile

Пример для zsh:

echo 'export PATH=$HOME/.gem/ruby/2.6.0/bin:$PATH' >> ~/.zshrc
source ~/.zshrc

Важно: у вас может быть другая версия Ruby (2.5.x, 2.6.x и т. п.). Подставьте фактическую директорию из вывода предупреждения.

Ubuntu

  1. Установите необходимые инструменты сборки и библиотеки:
sudo apt-get update
sudo apt-get install ruby-full build-essential zlib1g-dev
  1. Настройте установку гемов в домашнюю папку (чтобы не использовать root):
echo 'export GEM_HOME="$HOME/gems"' >> ~/.bashrc
echo 'export PATH="$HOME/gems/bin:$PATH"' >> ~/.bashrc
source ~/.bashrc
  1. Установите Jekyll и Bundler:
gem install jekyll bundler

Проверка установки

Проверьте, что Jekyll доступен:

jekyll -v

Если команда возвращает версию, установка прошла успешно. Если вы видите “command not found”, проверьте переменные PATH и повторите шаги настройки.

Создание нового блога

Создать сайт просто:

jekyll new blog

Здесь “blog” — имя директории; вы можете выбрать любое другое. Перейдите в неё и запустите локальный сервер:

cd blog
bundle exec jekyll serve

Просмотр локального сайта Jekyll в браузере

Откройте URL, указанный в терминале (обычно http://127.0.0.1:4000) чтобы посмотреть сайт локально. Нажмите Ctrl+C в терминале, чтобы остановить сервер.

Настройка и редактирование контента

Чтобы изменить параметры сайта (название, описание, автор и т. п.), откройте файл _config.yml в корне вашего проекта и отредактируйте значения. Главная страница обычно хранится в index.md или index.html.

Пример редактирования файла _config.yml в редакторе

Чтобы написать пост, откройте папку _posts и отредактируйте существующий файл или создайте новый с именем в формате YYYY-MM-DD-title.md. Внутри файла обязательно укажите YAML-метаданные (front matter), например:

---
layout: post
title:  "Мой первый пост"
date:   2020-01-01 12:00:00 +0000
categories: jekyll update
---

Текст поста в Markdown...

Развертывание на GitHub Pages

  1. Зарегистрируйтесь на GitHub и установите git на компьютере, если он не установлен.
  2. Создайте новый репозиторий с именем username.github.io (замените username на ваш логин).

Создание репозитория username.github.io на GitHub

  1. В терминале, находясь в папке проекта, выполните команды:
git init
git add --all
git commit -m "initial commit"
git remote add origin https://github.com/username/username.github.io.git
git push -u origin master

Примечание: по умолчанию GitHub теперь использует ветку main. Если ваш репозиторий настроен на main, замените master на main в команде git push. Альтернатива — создать ветку main локально (git branch -M main) и затем push.

Теперь откройте https://username.github.io — сайт должен появиться в течение нескольких минут.

Что ещё делать после публикации

  • Активируйте HTTPS в настройках репозитория (GitHub Pages) — обычно это можно сделать в Settings → Pages.
  • Привяжите собственный домен через файл CNAME или через настройки репозитория; GitHub предоставляет подробную инструкцию.
  • Подбирайте тему оформления (темы Jekyll) или создавайте свою.
  • Всегда проверяйте изменения локально перед коммитом: bundle exec jekyll serve.

Когда Jekyll + GitHub Pages не подойдут

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

Альтернативы и сочетания

  • Hugo + Netlify/Vercel — быстрее генерация и простая интеграция CI/CD.
  • Eleventy + Vercel — гибкость шаблонов и современный стек.
  • CMS как WordPress, Ghost — для динамики и расширенной функциональности.

Выбор зависит от приоритетов: скорость и простота — Jekyll + GitHub Pages; масштаб и динамика — CMS или серверные решения.

Важно: бесплатный план GitHub Pages ограничивает пользовательские плагины Jekyll — GitHub выполняет сборку сайта на своей стороне и поддерживает только набор официальных плагинов. Если вы используете нестандартные плагины, собирайте сайт локально и пушьте сгенерированный _site в репозиторий, либо используйте CI.

Быстрый чеклист (playbook) для первой публикации

  1. Установить зависимости (см. раздел установки).
  2. Создать сайт: jekyll new my-blog.
  3. Настроить _config.yml и проверить локально: bundle exec jekyll serve.
  4. Создать репозиторий username.github.io на GitHub.
  5. git init → add → commit → remote add → push.
  6. Проверить сайт по адресу username.github.io и активировать HTTPS.

Шпаргалка команд (cheat sheet)

# создать новый сайт
jekyll new my-blog

# запустить локально
cd my-blog
bundle exec jekyll serve

# собрать в статическую папку _site
bundle exec jekyll build

# git — базовые команды
git init
git add --all
git commit -m "initial commit"
git remote add origin https://github.com/username/username.github.io.git
# при необходимости заменить master на main
git push -u origin master

Ролевые чеклисты

Разработчик:

  • Убедиться в корректности сборки локально.
  • Настроить CI/CD, если используются плагины или сложная сборка.

Автор контента:

  • Писать посты в Markdown.
  • Проверять front matter в _posts.
  • Проверять форматирование локально и исправлять ошибки.

Сопровождающий (Maintainer):

  • Обновлять зависимости (Bundler, Jekyll).
  • Проверять безопасность (HTTPS, зависимости).
  • Мониторить ссылочный бит-порог и время отклика.

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

  • Сайт собирается локально без ошибок (bundle exec jekyll build).
  • Публикация на GitHub Pages доступна по адресу username.github.io.
  • HTTPS включён и работает.
  • Минимальный набор страниц (главная, 1–3 поста, about) отображается корректно.

Частые проблемы и способы их решения

  • “command not found” для jekyll — проверьте PATH и правильность установки гемов в домашнюю директорию.
  • Ошибки сборки, связанные с плагинами — либо используйте поддерживаемые GitHub-плагины, либо собирайте локально и пушьте сгенерированные файлы.
  • Проблемы с веткой master/main — проверьте настройки репозитория и используйте ту ветку, которую ожидает Pages.

Ответы на часто задаваемые вопросы

Нужно ли знать Ruby, чтобы использовать Jekyll?

Нет. Для базового использования достаточно Markdown и понимания структуры проекта. Ruby нужен только для установки Jekyll и плагинов.

Можно ли использовать собственный домен?

Да. Добавьте файл CNAME в корень репозитория с вашим доменом или настройте домен через настройки репозитория на GitHub.

Что делать, если я хочу комментарии на сайте?

Для статического сайта можно подключить сторонние сервисы комментариев (Disqus, Staticman) или использовать решения с клиентским JavaScript.

Можно ли автоматически деплоить из другой ветки?

Да. Настройки GitHub Pages в репозитории позволяют выбрать ветку и папку (например, gh-pages ветку или папку /docs).

Небольшой справочник терминов

  • Markdown — лёгкий язык разметки для форматирования текста.
  • Front matter — блок YAML-метаданных в начале файла поста.
  • Static site — сайт, который состоит из готовых HTML-файлов без серверной генерации на каждый запрос.

Итог

Jekyll и GitHub Pages — отличный старт для личного блога или документации: дешёво, быстро и надёжно. Установите зависимости, создайте сайт, протестируйте локально и опубликуйте на GitHub. Для более сложных задач есть множество альтернатив и подходов.

Ключевые шаги: установить, создать, настроить, протестировать локально, запушить на GitHub и включить HTTPS.

Поделиться: X/Twitter Facebook LinkedIn Telegram
Автор
Редакция

Похожие материалы

Не удалось инициализировать Direct3D — решения
Техподдержка

Не удалось инициализировать Direct3D — решения

Исправить Data Retrieval в Diablo 4 на Steam
Игры

Исправить Data Retrieval в Diablo 4 на Steam

Open Graph в WordPress — настройка мета‑тегов
WordPress SEO

Open Graph в WordPress — настройка мета‑тегов

getconf: адаптивные скрипты для разных Linux
Linux

getconf: адаптивные скрипты для разных Linux

Проверка входов в Windows — успешные и неудачные попытки
Безопасность Windows

Проверка входов в Windows — успешные и неудачные попытки

Исправить ошибку DistributedCOM (DCOM) в Windows
Windows

Исправить ошибку DistributedCOM (DCOM) в Windows