Hugo是由Go语言实现的一款静态博客生成器，具备简单、易用、高效、易扩展、快速部署的特点，本篇文章将带你一步步搭建一个基于github pages的个人博客。

安装hugo

hugo官网提供了多种的安装方式，这里仅仅提供二进制安装及Homebrew的安装方法。

二进制安装

通过hugo的github release页面下载自己平台的对应二进制文件，最好配置一下自己平台的PATH环境变量以便于全局使用

Homebrew

对于macOS用户，可以通过以下命令行完成安装

$ brew install hugo

安装完毕后，可以通过执行hugo version来验证是否安装成功，如果成功出现对应版本号则说明安装成功。

生成站点

通过执行以下命令，即可在指定目录初始化生成一个站点

$ hugo new site blog

上述命令的blog可以自定义为任意的目录，执行成功后将会得到以下的目录结构

archetypes
config.toml
content
data
layouts
static
themes

添加主题

hugo的主题页面里面的主题非常丰富，这边以本博客使用的hello-friend-ng 为例子，展示如何安装主题

$ cd blog
$ git init
$ git clone https://github.com/rhazdon/hugo-theme-hello-friend-ng.git themes/hello-friend-ng
$ git submodule add https://github.com/rhazdon/hugo-theme-hello-friend-ng.git themes/hello-friend-ng

其中第四行的意思是将主题对应仓库当作子模块，从当前仓库中独立，当前仓库并不干预这个子仓库的内容

配置主题

将config.toml替换为以下内容，其中博客名字等都可在配置文件中自定义，这里就不加赘述

baseurl      = "localhost"
title        = "My Blog"
languageCode = "en-us"
theme        = "hello-friend-ng"
paginate     = 10

[params]
  dateform        = "Jan 2, 2006"
  dateformShort   = "Jan 2"
  dateformNum     = "2006-01-02"
  dateformNumTime = "2006-01-02 15:04 -0700"

  # Subtitle for home
  homeSubtitle = "A simple and beautiful blog"

  # Set disableReadOtherPosts to true in order to hide the links to other posts.
  disableReadOtherPosts = false

  # Metadata mostly used in document's head
  description = "My new homepage or blog"
  keywords = "homepage, blog"
  images = [""]

  # Directory name of your blog content (default is `content/posts`)
  contentTypeName = "posts"

  # Default theme "light" or "dark"
  defaultTheme = "dark"

[taxonomies]
    category = "blog"
    tag      = "tags"
    series   = "series"

[languages]
  [languages.en]
    title = "Hello Friend NG"
    subtitle = "A simple theme for Hugo"
    keywords = ""
    copyright = '<a href="https://creativecommons.org/licenses/by-nc/4.0/" target="_blank" rel="noopener">CC BY-NC 4.0</a>'
    readOtherPosts = "Read other posts"

    [languages.en.params.logo]
      logoText = "hello friend ng"
      logoHomeLink = "/"
    # or
    #
    # path = "/img/your-example-logo.svg"
    # alt = "Your example logo alt text"

  # And you can even create generic menu
  [[menu.main]]
    identifier = "blog"
    name       = "Blog"
    url        = "/posts"

生成博客

执行以下命令即可创建一篇新的博客文章，其中文件名可以自行决定

$ hugo create posts/first-blog.md

打开新的博文会得到以以下内容开头的文章：

---
title: "first blog"
date: 2020-05-14T08:47:11+01:00
draft: true
---

不要将其删除，否则博客列表将不会显示标题等元信息

启动hugo的开发服务器

$ hugo server -D

执行上述命令会启动一个服务器，根据命令行提示进入http://localhost:1313将会显示博客页面，本地编辑博客内容会实时反映到页面上，于是可以愉快的写博文了

构建并部署到github pages

创建github pages的仓库

github pages是github提供的网页寄存服务，它会提供一个域名([用户名].github.io)供用户访问静态网页，下面是创建github pages的步骤

我们在自己的github账户上新建一个名为[用户名].github.io的仓库，如我的就是rust404.github.io

修改config.toml文件

将配置文件中baseurl这一项变更为自己对应github pages的域名，如我的就是https://rust404.github.io/，这一步必须执行，否则资源文件将会访问出错

构建并提交

执行以下命令

$ hugo -D

执行完毕后得到public目录，这个目录即我们需要提交到远程仓库（[用户名].github.io）的目录，以我的博客为例，提交过程如下：

$ cd public
$ git init
$ git add .
$ git commit -m "第一次提交"
$ git remote add origin git@github.com:rust404/rust404.github.io.git ## 这部分需要改为自己的仓库
$ git push -u origin master

执行完毕后，在[用户名].github.io即可看见自己刚刚写的博客了