Хьюго — отличный инструмент для создания блога.
Я использую Хьюго в этом блоге уже более 2 лет. У меня есть несколько причин для любви к Хьюго.
Это простой скучный гибкий быстрый .
Основная причина в том, что это просто . Вам не нужно много учиться, чтобы начать.
Вы пишете контент в Markdown, формате, который позволяет мне использовать мой любимый редактор (Bear) для написания постов.
Гюго скучен . Не поймите меня неправильно, это очень позитивная вещь. Как разработчик, я испытываю желание постоянно что-то настраивать. В основе Хьюго нет причудливых технологий. Он построен с использованием Go, одного из языков, которые я люблю больше всего, но это не значит, что я хочу погрузиться во внутренности Гюго и изменить его работу.
И в нем нет ничего классного или нового поколения, как это делают многие JavaScript-фреймворки.
Следовательно, это скучно, что дает мне много времени, чтобы делать то, что действительно полезно при работе над блогом: написание контента . Я сосредоточен на контенте, а не на контейнере контента.
Тем не менее, Хьюго довольно чертовски гибок . Я начал свой собственный блог с темой с открытым исходным кодом, а затем полностью изменил его. Иногда я хочу делать на своем сайте вещи, которые выходят за рамки простого блога, и Хьюго позволяет мне создавать такие вещи.
Наконец, еще одна причина, по которой я люблю Хьюго, в том, что он быстр . Почему? Во-первых, в его основе лежит язык Go, который, как известно, является очень быстрым языком. А в экосистеме Go нет концепции зависимостей в 100 мегабайт. Вещи сделаны, чтобы быть максимально быстрым. Кроме того, Хьюго не нужно делать какие-то модные вещи, которые нужны при использовании модных технологий. Это побочный продукт скучности.
В любом случае, хватит слов.
Уго удивителен, особенно если вы разработчик и хотите писать в Markdown. Нетехнические люди могут просто отказаться от использования Markdown, и это вполне понятно.
Кроме того, вы должны быть готовы к Git-центрированному рабочему процессу, чтобы сделать вещи по-настоящему интересными.
То, что вы делаете, это то, что вы пишете сообщение, используя Markdown, затем фиксируете свои изменения в репозитории Git, чаще всего в GitHub, и некоторые технологии склеивания внедряют изменения на сервере, на котором размещен сайт.
Содержание статьи
Хостинг веб-сайта Хьюго
Блог Хьюго полностью статичен . Это означает, что вам не нужно размещать собственный сервер или использовать для него специальный сервис.
Netlify, Now и GitHub Pages — это 3 замечательных места, где вы можете бесплатно разместить блог Хьюго.
Единственная цена, которую вы должны заплатить за доменное имя. Я не могу больше подчеркнуть важность наличия собственного доменного имени. Нет сайтов .github.io или .netlify.com или .now.sh пожалуйста.
Мои собственные сайты Хьюго размещены на Netlify.
Выберите домен
Поместите свой блог в свой домен. Выбери один. Используйте свое собственное имя. И используйте .com или .blog . Не пытайтесь быть умным, используя локализованный домен, не используйте .io . .com просто производит лучшее впечатление, и его можно использовать для всех ваших будущих проектов, а не только для размещения вашего блога. Я выбрал это.
Да, и если у вас есть старый домен, просто используйте это. Почему? Чем старше ваш домен, тем лучше.
Примечание о поддоменах: каждый поддомен для Google — это отдельный веб-сайт. Таким образом, если ваш домен flaviocopes.com и вы создаете свой блог на blog.flaviocopes.com то это совершенно новый веб-сайт для Google, и у него будет свой собственный отдельный рейтинг из основного домена.
Я предлагаю полностью избегать поддоменов.
Установите Хьюго
Чтобы установить Hugo на macOS, с вашего терминала запустите
brew install hugo
Команда
brewне существует на вашем Mac? Обратитесь к руководству по домашнему пиву
Для Windows и Linux обратитесь к официальному руководству по установке.
Создать сайт Хьюго
После установки Hugo вы можете создать сайт Hugo, запустив
hugo новый сайт myblog
Я предлагаю запустить его в папку www в вашем домашнем каталоге, потому что команда создаст новую папку myblog в которой вы ее запустите.
Выберите тему
Теперь, прежде чем начать, нужно выбрать тему. Я бы хотел, чтобы Хьюго включил тему по умолчанию, чтобы все было просто, но это не так.
На https://themes.gohugo.io есть большой выбор. Моя личная рекомендация — начать с https://themes.gohugo.io/ghostwriter/ и настроить его позже.
Я также рекомендую избегать рабочего процесса git clone который они предлагают на этой странице, потому что вы наверняка будете настраивать тему в будущем, и я считаю, что лучше всего иметь один репозиторий для обоих материалов и тема. Это упрощает развертывание.
Итак, перейдите по ссылке https://github.com/roryg/ghostwriter/archive/master.zip, чтобы загрузить текущую версию темы.
Затем распакуйте его в папку themes / ghostwriter на недавно созданном вами сайте Hugo:
Обратите внимание, что в каталоге themes / ghostwriter есть папка exampleSite . Откройте его и откройте подпапку content . Там вы можете увидеть подпапки страницы post и project .
Скопируйте страницу и post в папку content сайта:
Конфигурация
Примеры данных также предоставляют образец файла config.toml в themes / ghostwriter / exampleSite / config.toml . Это файл конфигурации Hugo, который сообщает Hugo некоторые детали конфигурации без необходимости жесткого кодирования информации в теме.
Я рекомендую вам не копировать это, потому что в нем слишком много вещей, и вместо этого использовать это:
baseurl = "/"
title = "Мой блог"
theme = "ghostwriter"
[Params]
mainSections = ["post"]
intro = true
заголовок = "Мой заголовок"
описание = "Мое описание"
github = "https://github.com/XXX"
twitter = "https://twitter.com/XXX"
email = "XXX@example.com"
opengraph = true
shareTwitter = true
dateFormat = "Пн, 2 января 2006"
[Permalinks]
post = "/: filename /"
Позже вы можете свободно настроить информацию в этом файле.
Теперь из командной строки запустите:
Гуго
Откройте http: // localhost: 1313 в своем браузере, и вы сможете увидеть сайт вживую!
Это домашняя страница сайта.
Существует список сообщений, взятых из папки content / post вашего сайта:
Щелкните по первой, называемой «Создание новой темы»:
Вы можете открыть файл content / post / creation-a-new-theme.md чтобы что-то изменить в посте.
При сохранении веб-сайт будет автоматически обновляться с новым содержанием.
Это довольно круто, верно?
Вы можете создать новую запись, создав новый файл .md добавив к нему префикс, который вы хотите. Вы можете использовать дополнительные числа, если хотите. Или используйте дату.
Если что-то выглядит не так, как вы хотите, вы можете открыть папку themes / ghostwriter / layouts и настроить ее.
Шаблон «пост» определен в themes / ghostwriter / layouts / post / single.html :
Уго использует шаблоны Go. Синтаксис может быть довольно незнакомым, но веб-сайт Hugo хорошо объясняет их во введении к шаблонам Go.
Однако, постарайтесь не смотреть сейчас на настройку вашего шаблона.
Если вы хотите настроить цвета, добавьте тег
Вместо этого сосредоточьтесь на контенте.
Удалите существующие файлы и напишите 2-3 сообщения для начала.
Слишком легко поймать себя в ловушку, чтобы сделать вещи идеально, как вы хотите, но главное - это контент.
И чем чище ваш сайт, тем лучше для ваших читателей.
Позвольте мне теперь немного написать о развертывании.
Развертывание сайта Хьюго в Netlify
Я хочу продемонстрировать, как развернуть сайт Hugo в двух службах, которые мне нравятся больше всего: Netlify и Now.
Во-первых, я собираюсь создать репозиторий GitHub для размещения сайта.
Я открываю GitHub Desktop, приложение, которым я пользуюсь каждый день и которое является частью моего рабочего процесса. Это самый простой способ использовать Git.
В меню «Файл» я нажал «Новый репозиторий»:
Этот же экран можно создать, просто перетащив папку myblog в приложение.
Я дал имя myblog хранилищу и выбрал правильный путь для репо.
Процесс автоматически делает первый коммит:
Теперь мы можем нажать кнопку «Опубликовать репозиторий», чтобы перенести репозиторий на GitHub:
Конечно, вы можете держать репо в секрете.
После того, как репо находится в GitHub:
мы можем перейти к Netlify.
На панели инструментов Netlify я нажал кнопку «Новый сайт из Git»:
Нажмите GitHub, авторизовал Netlify для доступа к моим личным репозиториям, затем я выбрал репо, который я только что создал:
Netlify автоматически определил его как репозиторий Hugo и автоматически ввел команду построения:
Нажатие «Развернуть сайт» запускает процесс развертывания:
На реальном сайте я бы настроил собственный домен. Netlify имеет возможность приобрести домен через них, и это очень (ОЧЕНЬ простой) процесс. Я очень рекомендую это. Сайт может быть запущен всего за несколько минут после покупки домена.
Случайный поддомен .netlify.com присоединен к сайту, в данном случае pedantic-engelbart-500c9a.netlify.com и HTTPS автоматически включается.
Поэтому мы можем сразу же увидеть сайт в прямом эфире:
Теперь, если вы попытаетесь что-то отредактировать в своей локальной версии, вы просто внесете изменения в GitHub, и Netlify автоматически обновит сайт. Вы можете увидеть его создание сайта на панели «Обзор» сайта:
Чтобы узнать больше о Netlify, я рекомендую вам ознакомиться с моим руководством по Netlify.
Развертывание сайта Хьюго в Zeit Now
Zeit Now - еще одна потрясающая платформа, которую вы можете использовать для своего блога Хьюго.
После того, как вы зарегистрируетесь, на панели инструментов вы нажмете кнопку New Project .
При первом развертывании с GitHub вы должны сначала установить приложение GitHub, нажав «Установить сейчас для GitHub»:
Это приводит вас на страницу GitHub для приложения, где вы можете авторизовать его для всех своих репозиториев или только для некоторых:
Вернувшись, нажмите кнопку «Новый проект из GitHub»:
Выберите проект и нажмите «Импорт»:
Тем временем перейдите в основную папку mysite и добавьте файл package.json с таким содержанием:
{
"сценарии": {
"построить": "Хьюго"
}
}
Теперь рассказывается, как развернуть сайт.
Когда вы вернетесь на панель инструментов, скоро должно начаться новое развертывание, и вы увидите, что сайт работает в режиме реального времени:
Обратите внимание, что теперь у вас есть 3 URL-адреса, которые вы можете использовать для доступа к сайту:
-
myblog.flaviocopes.now.sh -
myblog-alpha-swart.now.sh -
myblog-git-master.flaviocopes.now.sh
Вы можете выбрать тот, который вы предпочитаете.
Кроме того, каждое развертывание имеет свой собственный URL-адрес. В этом случае у меня был myblog-h8xks5jhn.now.sh но он меняется при каждом развертывании.
И, конечно, вы также можете добавить свой домен. У Zeit есть отличный сервис для покупки вашего домена непосредственно у них, доступный по адресу https://zeit.co/domains.
И если вы предпочитаете работать с командной строкой, команда now также позволяет вам покупать домены оттуда.
Я настоятельно рекомендую вам ознакомиться с моим учебником Zeit Now.
Я пишу книгу о том, как создать успешный блог в качестве разработчика. Я буду освобожден в конце февраля.
Подпишитесь на мою рассылку
для получения 2/3 бесплатных глав в вашем почтовом ящике в течение следующих нескольких недель!
Загрузка...
