Как настроить сайт разработки Jekyll в Ubuntu 16.04

Jekyll - это генератор статических сайтов, который предоставляет некоторые преимущества системы управления контентом (CMS), избегая при этом проблем с производительностью и безопасностью, создаваемых такими сайтами на основе баз данных. Он «осведомлен о блогах» и включает в себя специальные функции для обработки организованного по дате контента, хотя его полезность не ограничивается блог-сайтами. Jekyll хорошо подходит для людей, которым необходимо работать в автономном режиме, предпочитают использовать легкие редакторы веб-форм для обслуживания контента и хотят использовать контроль версий для отслеживания изменений на своем веб-сайте.

В этом руководстве мы установим сайт разработки Jekyll 3.7.3 в Ubuntu 16.04. В последующих руководствах мы рассмотрим сгенерированный здесь контент, опубликуем статический сайт на том же сервере и, в конечном итоге, развернем его в производственном месте.

Чтобы следовать этому уроку, вам понадобится:

Выполнив это предварительное условие, вы готовы установить Jekyll и его зависимости.

Мы начнем с обновления нашего списка пакетов, чтобы быть уверенными, что у нас есть самая свежая информация о новейших версиях пакетов и их зависимостях:

Затем мы установим Ruby и его библиотеки разработки, а также + make + и + build-essential +, чтобы библиотеки Jekyll скомпилировались после установки Jekyll:

Когда это будет завершено, мы перейдем к добавлению двух строк в файл + .bashrc, чтобы дать указание менеджеру пакетов Ruby` + gem` размещать гемы в домашней папке нашего пользователя. Это позволяет избежать сложностей, которые могут возникнуть при общесистемных установках, а также добавляет локальную команду + jekyll + к пользовательской + PATH +.

Откройте + .bashrc +, набрав следующее:

Внизу файла добавьте следующие строки:

Сохраните и закройте файл. Чтобы активировать экспорт, выполните следующее:

Когда это будет завершено, мы будем использовать + gem + для установки самого Jekyll, а также Bundler, который управляет зависимостями Gem:

Далее мы позаботимся о том, чтобы в настройках вашего брандмауэра трафик поступал на и с веб-сервера разработки Jekyll.

Начнем с проверки состояния брандмауэра, чтобы узнать, включен ли он. Если это так, мы обеспечим, чтобы трафик на наш сайт был разрешен, чтобы мы могли просматривать наш сайт для разработки в веб-браузере.

В этом случае только SSH разрешен через:

У вас могут быть другие правила или вообще нет правил брандмауэра. Поскольку в этом случае разрешен только трафик SSH, нам нужно открыть порт 4000, порт по умолчанию для сервера разработки Jekyll:

Давайте еще раз проверим статус:

Теперь наши правила брандмауэра выглядят так:

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

Из нашего домашнего каталога мы будем использовать команду Jekyll + new + для создания строительных лесов для сайта в подкаталоге с именем + www +:

Команда + jekyll new + инициирует + bundle install + для установки необходимых зависимостей и автоматически устанавливает тему под названием Minima. После успешной установки вы должны увидеть результат, подобный следующему:

Команда + new + Jekyll создает следующие каталоги и файлы:

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

Встроенный в Jekyll облегченный веб-сервер предназначен для поддержки разработки сайтов, отслеживая файлы в каталоге и автоматически восстанавливая статический сайт при каждом сохранении изменения. Поскольку мы работаем на удаленном сервере, мы будем указывать адрес хоста, чтобы просматривать сайт с нашего локального компьютера. Если вы работаете на локальной машине, вы можете запустить + jekyll serve + без настройки хоста и подключиться к + http: // localhost: 4000 +.

Когда мы вызвали + jekyll serve +, Jekyll проанализировал файлы конфигурации и содержимого в новый каталог + _site + и начал обслуживать содержимое в этой папке + _site +:

Также началось наблюдение за текущим каталогом + www + на предмет изменений. Как только изменение в записи или странице будет сохранено, статический сайт будет автоматически перестроен, поэтому важно не вносить изменения непосредственно в файлы в папке + _site +.

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

Сайт теперь доступен. В веб-браузере мы можем посетить его по адресу и порту сервера, указанному в выходных данных + jekyll serve +:

изображение: http: //assets.digitalocean.com/articles/jekyll-1604/jekyll_home_update.png [Снимок экрана с домашней страницей Jekyll]

В этом руководстве мы установили Jekyll и создали сайт для разработки с автоматически сгенерированным контентом. В нашем next мы рассмотрим этот контент, чтобы проиллюстрировать, как Jekyll преобразует исходные файлы в статический сайт, и информировать решения о наших настройках конфигурации.