什么？5分钟就能做出一个自己的博客

效果展示

https://blog.lijiext.vercel.app/

前期准备

1. github账号
2. vercel账号
3. git客户端
4. Visual Studio Code

步骤

1. 配置Hugo

首先需要下载Hugo，这里大部分人使用的是64位Windows系统，我将下载Hugo的64位Windows版本。打开：https://github.com/gohugoio/hugo/releases，找到最新的Releases的附件部分，点击下载适合自己的版本

下载完成后，将文件解压得到如下文件：

在这里我将此文件复制到D盘的hugo文件夹下（我的软件一般都安装在D盘）完成后如图所示：

下面需要配置系统环境变量，以便让hugo程序能够在系统任意位置运行：



配置好环境变量之后验证一下：
Win+R 输入cmd打开命令提示符输入hugo version，出现如下内容说明安装成功

2. 生成网站

在自己想要保存博客的位置打开命令行工具，输入hugo new site myblog，myblog即为文件夹的名称

下面用Visual Studio Code打开刚刚新建的文件夹：

使用git init初始化git仓库：

添加自己喜欢的主题：git submodule add https://github.com/varkai/hugo-theme-zozo.git themes/zozo
我这里使用的是zozo，在https://themes.gohugo.io/可以找到更多好看的主题：

下面需要在配置文件config.toml添加一行theme = "zozo"：

下面需要添加一篇文章，在命令行即Terminal中执行如下命令：

hugo new posts/10001.md

现在我们可以在content/posts下的10001.md文件中开始使用markdown编写我们的博客了：

文章写完后保存，然后在Terminal中执行：

hugo server -D -w -p 80 --disableFastRender

下面我们将能够在本地的80端口访问刚刚生成的网站：


到现在，网站可以在本地运行了，下面我们需要将我们的博客托管在线上，这里使用github+vercel作为托管平台：

• 新建一个github仓库
  
• 将本地文件上传到该git仓库

git add *
git commit -m "add 10001.md"
git remote add origin https://github.com/lijiext/blog.git
git branch -M main
git push -u origin main

• 部署网站
  在https://vercel.com/dashboard上New Project：
  
  一步步来然后选择：
  
  请注意，当部署完成后，会显示完成页面：
  
  但是需要注意图中的预览图和我们本地的网站并不一样，这是由于网站的资源文件无法找到所致，因为vercel在部署网站时会给我们随机分配域名，所以我们需要手动配置一下站点的URL：
  在项目的overview页面可以看到分配的随机域名：
  
  复制它，更改config.toml文件的baseURL为随机域名：
  

然后再次提交，等待半分钟后网站就会重新部署，此时在浏览器中访问域名就会正常了：

git add *
git commit -m "change baseURL"
git push

结果展示

下面就是我们刚刚弄好的博客了：