blog-engine-04-博客引擎 hugo intro 入门介绍+安装笔记

简介: 该文是关于博客引擎的系列文章,对比了jekyll、hugo、Hexo、Pelican、Gatsby、VuePress、Nuxt.js和Middleman。文章包括jekyll的安装和SEO,hugo和Hexo的入门,Pelican和Gatsby的介绍,VuePress和Nuxt.js的特性,以及Middleman的概述。Hugo是一个基于Go语言的快速、简单的静态网站生成器,特点包括速度快、易用、灵活和跨平台。文章还提供了Hugo在Windows上的安装步骤及创建、预览和发布网站的指南。

拓展阅读

blog-engine-01-常见博客引擎 jekyll/hugo/Hexo/Pelican/Gatsby/VuePress/Nuxt.js/Middleman 对比

blog-engine-02-通过博客引擎 jekyll 构建 github pages 博客实战笔记

blog-engine-02-博客引擎jekyll-jekyll 博客引擎介绍

blog-engine-02-博客引擎jekyll-jekyll 如何在 windows 环境安装,官方文档

blog-engine-02-博客引擎jekyll-jekyll SEO

blog-engine-04-博客引擎 hugo intro 入门介绍+安装笔记

[blog-engine-05-博客引擎 Hexo 入门介绍+安装笔记]

blog-engine-06-pelican 静态网站生成 官方文档

blog-engine-06-pelican 静态网站生成 windows 安装实战

blog-engine-07-gatsby 建极速网站和应用程序 基于React的最佳框架,具备性能、可扩展性和安全性

blog-engine-08-vuepress 以 Markdown 为中心的静态网站生成器

blog-engine-09-nuxt 构建快速、SEO友好和可扩展的Web应用程序变得轻松

blog-engine-10-middleman 静态站点生成器,利用了现代 Web 开发中的所有快捷方式和工具

前言

由于个人一直喜欢使用 markdown 来写 个人博客,最近就整理了一下有哪些博客引擎。

感兴趣的小伙伴也可以选择自己合适的。

Hugo 是什么?

Hugo 是一个用 Go 语言编写的静态网站生成器。你可以把它想象成一个超级能干的建筑工人,能够迅速搭建起一个网站。

Hugo 的特点

  1. 速度快
    Hugo 以快著称,它可以在几秒钟内生成一个完整的网站,这速度比大多数动态网站生成器快多了。
  2. 简单易用
    使用 Hugo,你只需要专注于内容,其他的布局和样式都由 Hugo 帮你搞定。
  3. 灵活性高
    虽然 Hugo 是静态的,但它支持各种主题和插件,你可以定制你的网站,让它独一无二。
  4. 跨平台
    Hugo 可以在 Windows、Mac、Linux 等操作系统上运行,非常灵活。

如何使用 Hugo?

  1. 创建新网站
    打开终端或命令提示符,输入以下命令:

    hugo new site my-blog

    这里的 my-blog 是你的网站名,可以换成任何你喜欢的名字。

  2. 选择主题
    Hugo 社区提供了很多免费的主题,你可以在 Hugo 的主题网站上挑选一个你喜欢的。
  3. 添加内容
    在网站的 content 目录下创建 Markdown 文件,就可以开始写博客了。
  4. 本地预览
    输入以下命令,启动 Hugo 的本地服务器:

    hugo server

    然后在浏览器中输入 http://localhost:1313,就可以实时预览你的网站了。

  5. 发布网站
    当你的网站准备好了,可以通过 FTP 或者 Git 等方式,将网站文件上传到服务器,就可以让全世界的人看到了。

Hugo 的优缺点

优点

  • 速度快
    Hugo 的生成速度非常快,适合需要快速搭建网站的场景。
  • 简单易上手
    如果你熟悉 Markdown,那么使用 Hugo 会非常轻松。
  • 社区活跃
    Hugo 有一个非常活跃的社区,你可以找到很多教程和帮助。
  • 免费开源
    Hugo 是完全免费且开源的,你可以自由使用和修改。

缺点

  • 静态网站
    Hugo 生成的是静态网站,不支持动态功能,如用户登录、数据库交互等。
  • 需要一定的技术基础
    虽然 Hugo 简单易用,但对于一些没有编程背景的用户来说,可能还是需要一定的学习成本。

hugo windows 入门例子

require

Git

λ git --version
git version 2.33.1.windows.1

Go

λ go version
go version go1.21.5 windows/amd64

Dart Sass: 用于做 sass 转换为 css

install

  1. 安装 Hugo。你可以从 Hugo 官网 下载 Hugo 的二进制文件,然后将其解压到你的电脑上。

windows 的话:

https://gohugo.io/installation/windows/

release 地址:

https://github.com/gohugoio/hugo/releases/tag/v0.121.1

这里选择了:

https://github.com/gohugoio/hugo/releases/download/v0.121.1/hugo_0.121.1_windows-amd64.zip

下载之后解压,这是一个可执行的 exe

比如解压到:

C:\Users\dh\Downloads\hugo_0.121.1_windows-amd64

quick start

使用 WSL 或者 git bash,我们在文件夹 C:\Users\dh\Downloads\hugo_0.121.1_windows-amd64 下打开命令行

hugo new site quickstart
cd quickstart

git init
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke
echo "theme = 'ananke'" >> hugo.toml

hugo server

PS: 这里 hugo.toml 估计会报错。

建议手动修改:

baseURL = 'https://example.org/'
languageCode = 'en-us'
title = 'My New Hugo Site'
theme = 'ananke'

如果配置了 path,就可以直接执行 hugo server。

没配置,可以指定全路径

C:\Users\dh\Downloads\hugo_0.121.1_windows-amd64\hugo server

主题

https://themes.gohugo.io/

access

访问你的博客。你可以在浏览器中访问以下地址:

http://localhost:1313/

你应该会看到你的博客页面,不过默认这里 pages 是空的。

添加 page 页面

hugo new content posts/my-first-post.md

or

C:\Users\dh\Downloads\hugo_0.121.1_windows-amd64\hugo new content posts/my-first-post.md

创建一个新的文件。

修改文件内容

---
title: "My First Post"
date: 2022-11-20T09:03:20-08:00
draft: true
---
## Introduction

This is **bold** text, and this is *emphasized* text.

Visit the [Hugo](https://gohugo.io) website!

重新执行

hugo server -D

# 若要显示 draft 为 true 的草稿,则用下命令
# 若要在之后网页中显示文章,则要把 draft 改为 false

or

C:\Users\dh\Downloads\hugo_0.121.1_windows-amd64\hugo server -D

界面还是很不错的。

hugo

部署

你可以将你的 Hugo 网站部署到任何 Web 服务器上。

例如,你可以使用 NginxApache 来部署你的 Hugo 网站。

或者 github pages

相关文章
|
12月前
|
Go 开发工具 git
CF+hugo部署要点随记
本文介绍了使用Hugo搭建静态博客的方法,Hugo是一款用Go语言编写的静态站点生成器。文中详细描述了在Windows环境下安装Go、Git和Hugo的步骤,并提供了快速启动指南。此外,还介绍了如何通过Git子模块引入主题,以及如何在本地创建和编辑文章。最后,给出了常用Markdown语法示例,帮助用户轻松撰写博客内容。
372 6
|
6月前
|
机器学习/深度学习 传感器 数据采集
基于机器学习的数据分析:PLC采集的生产数据预测设备故障模型
本文介绍如何利用Python和Scikit-learn构建基于PLC数据的设备故障预测模型。通过实时采集温度、振动、电流等参数,进行数据预处理和特征提取,选择合适的机器学习模型(如随机森林、XGBoost),并优化模型性能。文章还分享了边缘计算部署方案及常见问题排查,强调模型预测应结合定期维护,确保系统稳定运行。
625 0
|
Shell Go 开发工具
使用 Hugo 快速搭建一个云博客系统
使用Hugo快速搭建博客,Hugo是基于Go的静态站点生成器,以其简单、高效著称。[官网](https://gohugo.io/) 提供多种主题,如[m10c](https://themes.gohugo.io/themes/hugo-theme-m10c/)等。在Mac上可通过`brew install hugo`安装。创建站点`hugo new site ~/hugo-blog`,
237 0
使用 Hugo 快速搭建一个云博客系统
|
10月前
|
安全 前端开发 API
反向海淘客户案例:hoobuy淘宝代购集运系统搭建攻略介绍
这份攻略详细介绍了如何搭建 Hoobuy 淘宝代购集运系统。首先,通过市场调研与定位,明确目标客户和竞争态势,确定市场定位。接着,选择合适的技术栈,包括后端、前端和数据库,构建稳定高效的系统架构。核心功能涵盖 API 集成、商品展示、购物车管理、物流追踪等,确保用户体验。此外,注重安全与合规,保障用户数据和支付安全,遵守相关法律法规。最后,通过 SEO 优化、社交媒体营销和建立合作伙伴关系,推动系统的推广与运营。
|
人工智能 数据挖掘 大数据
538个代码示例!麻省理工教授的Python程序设计+人工智能案例实践
Python简单易学,且提供了丰富的第三方库,可以用较少的代码完成较多的工作,使开发者能够专注于如何解决问题而只花较少的时间去考虑如何编程。 此外,Python还具有免费开源、跨平台、面向对象、胶水语言等优点,在系统编程、图形界面开发、科学计算、Web开发、数据分析、人工智能等方面有广泛应用。 尤其是在数据分析和人工智能方面,Python已成为最受开发者欢迎的编程语言之一,不仅大量计算机专业人员选择使用Python进行快速开发,许多非计算机专业人员也纷纷选择Python语言来解决专业问题。 由于Python应用广泛,关于Python的参考书目前已经有很多,但将Python编程与数据分析、人工智
|
人工智能 数据挖掘 大数据
538个代码示例!麻省理工教授的Python程序设计+人工智能案例实践
Python简单易学,且提供了丰富的第三方库,可以用较少的代码完成较多的工作,使开发者能够专注于如何解决问题而只花较少的时间去考虑如何编程。 此外,Python还具有免费开源、跨平台、面向对象、胶水语言等优点,在系统编程、图形界面开发、科学计算、Web开发、数据分析、人工智能等方面有广泛应用。 尤其是在数据分析和人工智能方面,Python已成为最受开发者欢迎的编程语言之一,不仅大量计算机专业人员选择使用Python进行快速开发,许多非计算机专业人员也纷纷选择Python语言来解决专业问题。 由于Python应用广泛,关于Python的参考书目前已经有很多,但将Python编程与数据分析、人工智
|
前端开发 Go iOS开发
如何通过hugo部署一套技术博客
一步一步带你搭建一个完成的技术播客
|
算法 Python
打造高效生产排程:Python在APS解决方案中的应用
打造高效生产排程:Python在APS解决方案中的应用
643 2
|
人工智能 数据安全/隐私保护
如何实现AI检测与反检测原理
AI检测器用于识别AI生成的文本,如ChatGPT,通过困惑度和爆发性指标评估文本。低困惑度和低爆发性可能指示AI创作。OpenAI正研发AI文本水印系统,但尚处早期阶段。现有检测器对长文本较准确,但非100%可靠,最高准确率约84%。工具如AIUNDETECT和AI Humanizer提供AI检测解决方案,适用于学生、研究人员和内容创作者。
|
前端开发 NoSQL Docker
分享46个Python博客源代码总有一个是你想要的
分享46个Python博客源代码总有一个是你想要的
562 1