使用Hugo搭建网站并部署到服务器

什么都不因为，只因为相信技术可以改变更多

使用Hugo搭建网站并部署到阿里云的ECS

第一部分

1. 在本地使用Hugo创建静态网站

相信这一部分在网上可以很容易的搜索到，这里我再啰嗦一遍，如果熟知这一部分，可以跳跃至下一部分阿里云开启ftp、上传网站
本地系统：macOS Catalina 10.15.2

1.1 安装Hugo

比较简单的方法就是使用homebrew安装，没有安装homebrew的可以参考以下网站安装
https://brew.sh/index_zh-cn.html

安装hugo

brew install hugo

确认安装

hugo version

1.2 创建一个新的网站

创建新网址

hugo new site quickstart
ps. 上面演示代码中的quickstart为自定义网站名称

添加一个主题

cd quickstart
git init
git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke

把主题写入配置文件

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

1.3 创建一篇文章

新建文章

hugo new posts/my-first-post.md

文章的格式为markdown，markdown的语法可以参考以下网址

Markdown 语法

可以使用vim编辑markdown

vim my-first-post.md

打开后的markdown是这个样子的

---
title: "My First Post"
date: 2019-03-26T08:47:11+01:00
draft: true
---

按i编辑，编辑完后按Esc退出编辑，输入:wq保存编辑并退出编辑。

1.4 开启Hugo服务

输入hugo server -D开启Hugo服务

hugo server -D

                   | EN
+------------------+----+
  Pages            | 10
  Paginator pages  |  0
  Non-page files   |  0
  Static files     |  3
  Processed images |  0
  Aliases          |  1
  Sitemaps         |  1
  Cleaned          |  0

Total in 11 ms
Watching for changes in /Users/bep/quickstart/{content,data,layouts,static,themes}
Watching for config changes in /Users/bep/quickstart/config.toml
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop

在浏览器访问http://localhost:1313/，就可以访问生成的网页。

1.5 生成静态网页

很简单，只需要输入

hugo -D

就可以把Markdown的文章自动生成相应主题的静态网页。

2. 阿里云开启ftp、上传网站

注明：我的服务器是阿里云中最便宜的轻量应用服务器（ECS的阉割版），下述所有也全部基于此进行操作，如果你的服务器不同，虽大同小异，请参考各自服务提供商。

服务器基本信息

服务器提供商	阿里云
服务器系统	CentOS 7.3
内存	2G
系统盘	40G SSD

2.1 安装vsftpd及更改配置文件

我使用的是vsftpd（very secure file transfer protocol daemon）。

1. 首先安装vsftpd。

yum -y -install vsftpd

2. 运行以下命令设置FTP服务开机自启动。

systemctl enable vsftpd.service

3. 运行以下命令启动FTP服务。

systemctl start vsftpd.service

4. 运行以下命令查看FTP服务监听的端口。

netstat -antup | grep ftp

2.2 配置vsftpd

配置这方面阿里的建站教程写的比较细致，贴在下方↓
注意关闭匿名登录上传，开启账户登录上传，可以添加新用户，并设置密码。
阿里云建站教程-手动搭建FTP（CentOS）

2.3 开启防火墙端口

上一步配置完后，尝试连接服务器的时候会发现无法连接，这是因为阿里云默认不开启21端口，这个时候我们在防火墙中开启FTP端口即可。如下图所示。

点击右上角[添加规则] → 添加FTP端口（自动，默认为21）

2.4 使用FileZilla上传网站

使用Hugo有两种方法

1. 在服务器端直接创建新网站和新网页
2. 在本地生成后上传到服务器

第一种方法和在本地新建是相同的，这里重点介绍第二种【本地生成后上传】。
（一）最原始的方法是连接到服务器后，用put的方法把文件上传到服务器。
参考——如何在命令行中使用 ftp 命令上传和下载文件
（二）使用FileZilla上传
当然还有很多软件（TFTP，CuteFTP）都能实现这一功能，这里使用较为常用的FileZilla mac。
第一步——安装FileZilla
第二步——依次点击“文件”——>“管理站点”——>填写站点和登录信息（注意选择SFTP，填写公网地址）
第三步——连接后上传网站文件

后续继续更新第二部分（关于使用Ngnix部署网站）

回到顶部