个人主页一直部署在阿里云用最便宜的云服务器ECS上,用了五年多,还差几个月就要到期了,以前用最低配置512M内存的云服务器,已经不能按这个配置续费了。

image-20200629210546820

这台服务器前段时间被强制升级成了1G内存,以后阿里云最便宜的ECS云服务一年大概500多元,云服务平时没有特别大的作用(因为性能实在有限),于是准备弃用。

考虑到各种平衡:性能,成本,方便,实现难度等因素,最终定下改成用阿里云OSS(云文件存储服务)提供个人主页。通过笔记本生成静态页面发布,上传到OSS上。方案示意如下。

image-20200629202030884

本来一直在云服务器上使用Hexo【hexo官方主页】生成静态文件与提供web服务,这次打算换成HugoHugo中文文档】实现。这两款工具都是基于Markdown语法编辑文章的内容,正好可以迁移以前写的一点流水账。

看到不少人用Github+Hugo,或者其他网站工具来部署个人博客,感觉很有技术感,纯游戏心理也想摆弄下。

但是,既然是个人博客,那就是追求个性化,当然用个人域名更好。

因此我以前才会掏钱购买 域名+服务器 部署,而没有在各种技术论坛写内容。

PS:看着这类技术博客中水平参差不齐,很多人将内容不全的技术基础文档复制转发,许多内容实在没有任何价值。发现一个问题,免费的技术博客服务才是最贵的,剥夺了一个富有创意的职业的自由度,同时记流水账对个人技术提升没有任何好处,凭白消耗精力,不如思考下自己缺什么。

所以还是自己整活来一套,如果没有个人域名,需要申请个。

  • 21世纪了,个人域名就是一个人的电子门面(特别是搞技术的)。
  • 建议阿里云,管理使用很方便 通过此链接注册看能不能领到红包
  • 域名服务三、五十块一年,非.com域名才十几块,甚至几款,也就一道菜钱。难怪蔡文胜喜欢囤积域名,发家致富。

方案中要用到的几个素材:

  1. Hugo本地服务,Hugo是个开源项目,可以快速建站生成个人主页、公司门户,不仅能生成静态页面,而且本身还带有web服务可以快速部署。

  2. 个人域名(需要备案)+云文件存储服务。推荐 阿里云域名+OSS,或者,其他域名服务+云文件存储服务。

  3. markdown编辑器,推荐typora

  4. 文件上传工具,如果用的阿里云oss推荐直接上工具ossbrowser【下载地址】,或者写个小脚本。

网站页面生成,基于Hugo

如果有熟悉Hexo或者其他工具的可以避免学习,hugo的高级使用需要参看文档。

准备工作

Mac自带Go,如果Mac还没有安装brew,参考正常网络在Mac上安装brew

如果Mac还没有安装git,可以手动下载或者

1
brew install git

安装Hugo ,生成一个网站

1
2
3
4
brew install hugo
hugo new site io97.com 
cd io97.com
ls 

包括如下文件目录

archetypes content layouts themes

config.toml data static

选个喜欢的样式,这个太省心了,如果样式不完善可以在基础上手动调整

Hugo中文网站各种样式

Hugo官网各种样式

选择了一个样式后下载到themes文件夹

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

新建关于页面,打开编辑器编辑内容

1
hugo new about.md

在conf.toml配置menu(支持菜单的主题才会生效)

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
[[menu.main]]             # config your menu              # 配置目录
  name = "首页"
  weight = 10
  identifier = "home"
  url = "/"
[[menu.main]]
  name = "文章"
  weight = 20
  identifier = "archives"
  url = "/post/"
 [[menu.main]]
  name = "关于"
  weight = 20
  identifier = "about"
  url = "/about/"  

启动查看下效果,指定服务ip与端口

1
hugo --theme=even server --bind 192.168.72.9  -p 8080

生成静态文件。

添加一些其他的文章内容后

1
 hugo --theme=even  #在新建网站目录执行

生成的站点静态文件在public目录下

主题样式或者细节无法完全满足个人完全需要,需要个性化的,可以在主题基础上自行修改。

这里有详细的官方技术文档,https://gohugo.io/variables/taxonomy/

文件服务与域名配置

登录阿里云-控制台-对象存储oss

新建一个bucket,选择公共读

image-20200702224020879

设置OSS,开启静态页面

image-20200702225458172

上传网站

将生成的public目录下所有文件上传,上传到存储的根目录下。

可以使用上传工具,或者直接登录阿里云管理页面支持100个文件同时拖拽。

更新时,重新覆盖public中生成页面即可。

上传后的结构如下

image-20200702224631718

配置域名

直接在oss管理下绑定域名,注意勾选 自动添加CNAME记录

image-20200702230059853

访问一下测试用的域名

image-20200702230233450

到这里,整个配置已经通了。

剩下就是将Hexo的文章内容迁移,将正式域名绑定到Oss。


本文地址
本文采用 知识共享署名 4.0 国际许可协议进行许可,欢迎转载内容,并请注明出处。