基于hugo搭建个人站点

Python015

基于hugo搭建个人站点,第1张

以前使用wordpress搭建网站,插件太多,完善起来比较费时费力。现在,静态博客也很受欢迎,hugo就是GO语言开发的一个静态博客生成器。

mackbook上直接使用 brew install hugo 安装hugo,安装完成后使用 hugo version 来查看hugo的版本。

在Github目录下打开终端,或者cd到Github目录下:

hugo new site site_name

其中,si te_name为github账号名称加上 .github.io ,例如:

hugo new site gary-hertel.github.io

创建成功后会显示一些信息,诸如:

这就表示站点已经创建成功了。

然后进入到站点目录:

cd gary-hertel.github.io

使用 tree 查看目录结构如下:

接下来需要为我们的网站指定一个主题,这里我们选择 even 这个主题:

git clone https://github.com/olOwOlo/hugo-theme-even themes/even

将该主题增加到网站的配置文件中,这样才能生效:

echo 'theme = "even"' >>config.toml

测试下是否成功,运行:

hugo serve

这里是按照别的教程操作的,但是发生了报错,查看even这个主题的文档后发现有如下内容:

这里提示我们查看 themes/even/exampleSite 目录下有一个示例的 config 配置文件,我们需要将这个文件复制到站点根目录,覆盖原文件,这样才能够使站点生效。配置文件中的信息可以查看一下,然后进行相应的修改。

在站点根目录:

hugo new post/first_article.md

查看 gary-hertel.github.io/content/post 目录下新增了一个 first_article.md 的markdown文档,打开之后对其进行编辑即可,注意将 draft:true 修改为 false .

撰写文章的方法就是通常开发者常用的markdown格式。

在站点根目录下:

Hugo serve

然后就可以在浏览器中输入 http://127.0.0.1:1313/ 进行查看了,在撰写文章或者进行配置修改等等操作时,内容会自动更新。

hugo -d docs

静态页面会保存至站点根目录下的docs文件夹。

每次更新后我们都需要执行一下这条命令。

在github上新建一个公开仓库,名为github用户名加上 .github.io ,例如 gary-hertel.github.io

在仓库的settings的pages设置中,Source那里设置为:

说明如下:

使用hugo搭建个个人博客还是不错的,一开始要花些时间折腾和摸索,后续就使用起来比较方便了,也不需要购买服务器去部署,部署在github上可能国内访问较慢,可以考虑部署到gitee.

前段时间使用docker搭建了一个wiki的网站,用于记录日常学习中的笔记,用了一段时间,功能很强大,但是编辑器不太熟悉,网站使用java开发的,功能很全面,插件多的时候就感觉越来越臃肿。曾经有段时间就不想使用它了,最近偶然发现一个静态网站的生成工具hugo,可以将markdown直接生成网站,部署到站点上作为自己的知识库或者博客,hugo是使用go语言开发的,使用起来非常方便,生成的网站可直接部署在Nginx、IIS等中间件上面供其他人访问,hugo还有很多漂亮的主题,大家可以选择自己喜欢的进行使用,下面介绍下 我安装使用hugo的经历和方法。

1)使用brew install命令安装

我的电脑是mac的,所以最方便的是直接用brew install hugo命令安装最为方便:

执行安装完成后执行hugo version 命令查看版本,确保安装成功

2)官网下载二进制包:解压后将二进制文件加入环境变量的方式安装。大家可以根据自己的操作系统,下载适合的安装包。

3)也可以下载源码 编译 运行,由于我本地的go版本是1.17的,而hugo的最新代码的最低要求是1.18,暂时还不想升级,所以源码编译的方式这里就不过多介绍,感兴趣的可以下载源码编译试试。

进入要创建网站的目录,执行一下命令

这样名称为test-blog的网站就建好了 ,

下载一个主题 可以在 官网上找到各种各样的主题

将主体添加至配置文件

打开content/posts目录下的index.md 文件进行编辑,页面的配置项说明参见官网

执行下面命令

成功以后就可以访问http://localhost:1313/就可以访问网站了。

执行命令hugo -D 即可生成一个public的文件夹,其下面的内容即为静态网站的所有文件

这里使用nginx的docker镜像 进行部署,执行以下命令:

执行成功后就能通过http:localhost访问到静态网站了。

这个工具还有很多需要研究的地方,这里只是将简单的使用方法记录了一下,以后怎样使用才能使网站更加的方便,快捷、美观,还要花时间研究。有兴趣的小伙伴可以私信我一块研究。

一直想做一个自己的网站(非博客),但是又不知道做什么内容的好,又一次看到了w3schools,就萌发了开发一个在线java学习的网站,最好可以像w3schools网站一样可以在线执行,想法是很好,就是要填的坑有点多。

技术选择

使用过wordpress和jekyll两个工具。wordpress是需要php的支持,由于没有php开发经验的,没有很强烈的使用意愿。

jekyll是使用ruby开发的静态博客生成系统,阅读完官网上的文档之后开始搭建环境,过程还是很顺利,但是在使用jekyll提供的功能开发模板的时候感觉不是很顺手,又开始了漫无目的的搜索。

搜索“static website generator” 意外的发现了两个比jekyll更新更潮流的静态网站生成器,一个是hexo,一个是hugo。

hexo台湾人使用nodejs开发的,hugo是外国人使用go语言开发的,两者都很轻量级,由于最近买了一本《深入浅出node.js》

对nodejs比较熟, 就先试验hexo,发现确实很好用, hexo的插件系统很方便就能编写自己的插件,由于代码写的不是很成熟,