введение
Для программиста совершенно безобидно иметь свой личный технический блог, не только удобно выйти и принарядиться, но и показ адреса блога во время собеседования удвоит благосклонность интервьюера к вам. Я часто вижу это предложение в конце технических статей многих больших парней: "Приглашаю всех посетить мой блог". Каждый раз, когда я вижу это, я чувствую себя таким крутым. Это также причина, по которой люди так хороши в технологиях. А если вы хотите построить блог, то либо вы боитесь тратить деньги, либо боитесь, что процесс слишком хлопотный, и в итоге его не будет.
По просьбам фанатов, сегодня я научу вас вести свой собственный технический блог, рука об руку, из уст в уста (не волнуйтесь, мне плевать на поцелуи с вами), если у вас естьgithubТолько адрес! Чего же ты ждешь? Сан Ниан, начнем!
1. Что такое гексо?
Сегодняшний главный герой Hexo, этоNode.jsФреймворк статического блога (нет необходимости взаимодействовать с фоном, все состоит из статических страниц), меньше зависимостей, простой в установке и, что более важно, бесплатный, и вы можете легко разместить сгенерированные статические веб-страницы наGitHub,码云иCoding, один из предпочтительных фреймворков для создания блогов.
2. Подготовка
1. установка git
gitссылка для скачивания:gitforwindows.org
$ git --version
git version 2.12.2.windows.2
Уведомление:Все рекомендуемые здесь команды находятся вgitВыполнить из командной строки,cmdВыполнение команд в системе подвержено ошибкам.
2. Установка Node.js
node.jsссылка для скачивания:https://nodejs.org/en/, выберите стабильную версию,node.jsУстановка очень проста, шаг за шагом далее.
nodeЕсли установка прошла успешно, следующий дисплей успешен.
$ node -v
v12.16.1
L8000100617811+51536@L8000100617811 MINGW64 /d/myblog
$ npm -v
6.13.4
3. Hexo локальная сборка
по вашему мнению最可爱На диске создать папку специально для храненияmyblogФайлы, связанные с блогом.Щелкните правой кнопкой мыши внутри папки, чтобы открытьGit Bash Here, выполните все следующие команды в этом окне.
1. Установите Хексо
использоватьnpmУстановитьhexo, из-за высокой "стены" отечественной сети, во избежание медленной или неудачной установки переходим на али здесьNPMЗеркальное отражение, нет другого выхода, кроме как использовать обходную тактику.
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
использоватьcnpmУстановитьhexo
$ cnpm install -g hexo-cli
Установка может быть немного медленной, конечно, это зависит от вашей пропускной способности, которая будет происходить в процессеWARNИгнорируйте подсказку.
$ cnpm install hexo --save
Подойди сюдаhexoОн установлен, проверьте егоhexo -vБыла ли установка успешной
$ hexo -v
hexo-cli: 3.1.0
os: Windows_NT 10.0.18362 win32 x64
node: 12.16.1
v8: 7.8.279.23-node.31
uv: 1.34.0
zlib: 1.2.11
brotli: 1.0.7
ares: 1.15.0
modules: 72
nghttp2: 1.40.0
napi: 5
llhttp: 2.0.4
http_parser: 2.9.3
openssl: 1.1.1d
cldr: 35.1
icu: 64.2
tz: 2019c
unicode: 12.1
2. Инициализировать Hexo
HexoПосле установки требуется инициализация.
$ hexo init
Уведомление: В это время вам нужноmyblogфайл, создайте новую папку для храненияhexoФайл блога. иначе выполнитьhexo initКоманда сообщит об ошибке.
hexo文件Щелкните правой кнопкой мыши внутри папки, чтобы открытьGit Bash Here, выполнить все последующие команды в этом окне.
$ hexo init
FATAL D:\myblog not empty, please run `hexo init` on an empty folder and then copy your files into it
FATAL Something's wrong. Maybe you can find the solution here: http://hexo.io/docs/troubleshooting.html
Error: target not empty
at Context.initConsole (C:\Users\51536\AppData\Roaming\npm\node_modules\hexo-cli\lib\console\init.js:23:27)
После успешной инициализацииhexo文件В папке появятся следующие файлы:
node_modules: зависимый пакетpublic: сохранить сгенерированную страницуscaffolds: некоторые шаблоны для создания статейsource: используется для хранения ваших статейthemes: удалить загруженную тему_config.yml:Основной файл конфигурации блога (установите атрибуты, такие как тело, заголовок и т. д.)
cnpm installкоманда, или следующий запуск подскажет, что команда недопустима.
cnpm install
последнее использованиеhexo s -gкоманда для запуска установленногоhexo.
$ hexo s -g
INFO Start processing
INFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.
прямое интервьюhttp://localhost:4000Отображается следующая страница, и локальный блог успешно создан.
4. Hexo размещен на GitHub
1. Создайте репозиторий GitHub
В это время нам нужноGitHubСоздайте репозиторий на , установите имя репозитория наXXX.github.ioконец
2. Конфигурация_config.ymlдокумент
Исправлять_config.ymlфайл, добавьте созданныйGitHubАдрес склада
deploy:
type: git
repo: https://github.com/YourgithubName/YourgithubName.github.io.git
branch: master
установить команду развертыванияdeploy-git, так что вы можете развернуть наGitHub.
$ cnpm install hexo-deployer-git --save
После того, как вышеуказанная модификация будет завершена, выполните следующие команды по очереди, чтобы отправить локальныйhexoфайл вGitHub.
hexo clean
hexo generate
hexo deploy
3. Онлайн-тест
Получите доступ к репозиторию, который вы только что создали:https://chengxy-nds.github.io/, будет определенная задержка в отображении страницы после того, как файл будет отправлен на GitHub, подождите десятки секунд, чтобы снова обновить страницу, и просмотрите следующие страницы, чтобы указать, что блог успешно развернут.
4, установить личное доменное имя
Теперь адрес нашего блога:https://chengxy-nds.github.io/, но не кажется ли вам, что это немного низко, если у вас есть деньги, вы можете купить доменное имя самостоятельно. Просто купите один на облачной платформе и посмотрите, что вам нравится, например: chengxy.com.
указать доменное имя наGitHubадрес сервера,192.30.252.153и192.30.252.154.
войти в блогGitHubсклад, нажмитеsettings,настраиватьCustom domain, введите доменное имяchengxy.com
Затем в локальном файле блогаsourceсоздать файл с именемCNAMEфайл без суффикса. Напишите свое доменное имя.
chengxy.comВот и все.
hexo clean
hexo generate
hexo deploy
5. Переключение темы Hexo
Несмотря на то, что наш блог был построен, все, должно быть, обнаружили, что существующий стиль блога уродлив, В настоящее время вам нужно перейти на официальный сайт, чтобы выбрать стиль, который вам нравится.
1. Загрузите тему
hexoОсновной официальный сайт:https://hexo.io/themes/, давайте найдем тему для замены и демонстрации, тема размещена на github, просто клонируйте ее напрямую.
2. Конфигурация_config.yml
можно увидетьhexoтолько одна тема по умолчаниюtheme, теперь введитеthemeВыполнение папкиgitКоманда Clone или загрузка темы напрямую вthemeвнутри папки.
git clone https://github.com/yelog/hexo-theme-3-hexo.git
Исправлять_config.ymlв файлеthemeАтрибуты
theme: hexo-theme-3-hexo
Упакуйте и загрузите, чтобы увидеть эффект:
hexo clean
hexo generate
hexo deploy
3. Тест
Ницца! Тема успешно заменена, что намного лучше встроенной карты
6. Основные операции Hexo
После того, как блог создан, следующим шагом будет начать вести блог и управлять им~
Создайте наш первый блог, будет вsource\_postsсоздать каталог程序员内点事的第一篇博客.mdдокумент
hexo n 程序员内点事的第一篇博客
гексо базовая конфигурация
_config.ymlдаhexoОсновной файл фреймворка, конфигурация блога в основном здесь.
#博客名称
title: 我的博客
#副标题
subtitle: 一天进步一点
#简介
description: 记录生活点滴
#博客作者
author: John Doe
#博客语言
language: zh-CN
#时区
timezone:
#博客地址,与申请的GitHub一致
url: http://elfwalk.github.io
root: /
#博客链接格式
permalink: :year/:month/:day/:title/
permalink_defaults:
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
enable: true
line_number: true
auto_detect: true
tab_replace:
default_category: uncategorized
category_map:
tag_map:
#日期格式
date_format: YYYY-MM-DD
time_format: HH:mm:ss
#分页，每页文章数量
per_page: 10
pagination_dir: page
#博客主题
theme: landscape
#发布设置
deploy:
type: git
#elfwalk改为你的github用户名
repository: https://github.com/elfwalk/elfwalk.github.io.git
branch: master
Суммировать
Пока что вся нашаhexoБлог был построен, на самом деле, он относительно прост, но здесь мы сделали только первый шаг в долгом пути, и в последующих действиях есть более подробные операции, такие как: классификация блога, метки, макет, д., чтобы наш блог стал Красивее!
Заинтересованные друзья могут пожелать обратить внимание на волну!
Небольшие преимущества:
Сотни различных технических электронных книг пересылаются друг другу, тсс~,бесплатноОтправить его друзьям. Обратите внимание на ответ на общедоступный номер【666] Самовывоз