技术文章

前言 在搭建博客时，知道了有静态博客和动态博客的存在，而静态博客和动态博客最主要分别就是静态博客不需要数据库的参与，hugo和hexo也是属于静态博客。静态博客最大的优势就是不需要额外购买云服务器和虚拟主机，单纯买一个个性化域名即可。在部署方案上，做了很多功课，大体上可以采取以下几种方式： 1、github page。应该是最简单和最方便的部署方式，但这种方式在国内的访问速度不太友好，另外部署在github的博客会拒绝百度的数据爬取，这意味著你的博客内容不能被其他人通过关键字搜索的方式去知道你的博客存在。（单纯只为记录，没有一点杂念可以考虑）。 2、gitee。服务器在大陆，访问速度自然没得说，优势就是访问速度快，但是自定义域名需要收费。 3、腾讯云和阿里云等对象存储oss。这个部署方式访问速度也是很快的，但是要收费，按照流量计费，对于访问量不大的个人博客费用估计一年10元也不到。但劣势也很明显，选择国内的oss域名需要备案才能绑定。 4、vercl，netlify等国外免费容器。最大优势免费，访问速度比托管在github要快，而且这两个容器也是自带ssl证书，不用另外为域名申请。 5、此外，静态博客还可以托管在cloudfare page、coding等，大家可以自行探索研究下。 不同的部署方式对比如下： github page gitee 对象存储oss vercel，netlify 是否免费 是 是 否 是 是否支持免 费自定义域名 是 否 是 是 优势 便捷 免费，访问速度快 访问速度快 免费，自带ssl证书，部署方便 劣势 访问速度慢，不能被百度爬取 自定义域名收费 收费，容易被人恶意刷流量，域名需要备案 暂时未发现，假设真要说的话访问速度还有提升空间 环境搭建 网上教程很多是通过github推送到vercel的，我这个教程是hugo直接部署到vercel。部署到vercel需要npm安装，所以必须为系统搭建Node.js。 打开node.js官网，下载安装node.js，全部默认选项即可。安装完成后，打开cmd，输入： node -v 如果有版本号输出，证明node已经安装成功 账户注册 注册vercel账户，打开https://vercel.com/，点击右上角的sign up先注册一个vercel账户。 安装vercel 输入： npm install -g vercel 开始部署 安装完成后，我们输入:hugo，生成一个public文件夹，这个文件夹就是我们需要部署的内容。 cd public 进入到public文件夹 再次输入： vercel 若出现报错，可输入：vercel login 输入后会提示你登录。让你选择登录方式，用上下方向键选择。我是直接用邮箱注册的，所以选择第三个选项。输入之后后Vercel会给这个邮箱发一封邮件，控制台程序也会等待验证完成，打开这个邮件点击验证（VERIFY）按钮，点击之后就显示验证完成，控制台程序也会提示登录成功。 登录成功后，再次输入： vercel --prod 然后就按照操作指示做就行了： 第一个问题：Set up and deployxxxxxxxxxx?选择Y 第二个问题：Which scope do you want to deploy to? 输入自己的注册邮箱 第三个问题：Link to existing project? 问你是否链接到一个存在的项目，因为我们还没创建，选择N， 第四个问题：What’s your project’s name?让你为项目命名，自己取一个名字即可。 第五个问题：In which directory is your code located? 直接回车 然后等待博客上传成功。 ...

前言 这里说的小白是指没有任何编程基础的人，就像鄙人一样。一直来，很想拥有一个属于自己的博客，直至前段时间才开始把这个想法变成了现实。一开始看不上wordpress一键搭建个人网站，喜欢有点技术门槛和挑战的，然后选择了HEXO框架，后来几经折腾，安装插件经常报错就玩不下去了，经过一番研究,最终选择了hugo框架，至于为什么选择hugo框架，我认为有以下几点优势： 优势 1、生成速度快。hugo是一个用 Go 语言编写的静态 HTML 和 CSS 网站生成器。它针对速度、易用性和可配置性进行了优化。因为我HEXO我也用过，所以在生成速度上上有一定的发言权，虽然没有用计时器严谨地统计过，但是在感官上hugo的确是比hexo要快，这还是建立在我的博客文章不是太多的情况下的，如果文章多了这个优势可能会更加明显。 2、安装简单，不需要太多依赖。hexo基于Node.js环境，npm安装经常出现依赖报错的情况，如果动手能力差点，没有一点编程基础，很容易玩坏。而安装hugo就容易多了，直接把它的二进制安装下载下载下来设置以下环境变量就完事，而且重新安装也不会耗费太多时间，只要把重要的文件夹备份好。 3、在最重要一点：省心。虽然hugo在主题和插件拓展上不如hexo，但是在实际实用过程中会省心很多，基本上很少出现报错，对于我这类不是程序员出身额小白实在是太友好了。 劣势 说了这么多hugo的优势，也来说以下它的劣势吧。的确，由于hexo用户群体比hugo占有优势，在社区支持和网上的解决方案资料的确不如人意，我在实用过程中遇到的问题在百度查了一下，基本上没有相关资料，而hexo能查到解决方案的机率也有60%左右。另外hexo的主题和插件比hugo资源丰富，可能把自己的网站搭建得很漂亮，只要怎么选择，相信各位看官心里已经有了自己的答案。好了废话少说，现在把我折腾hugo的流水说以下吧。 前期准备 由于我是在win系统下安装的，这里用win系统做演示 1、安装git 2、前往hugo官网，下载安装文件，这里推荐下载extend版本的，因为这个版本拓展性丰富一些，个别主题也需要在extend版本才能运行。 3、下载完成后，解压文件，会得到一个exe的二进制文件。注意：这个exe运行不用双击安装，只需要解压出来就行。解压后把它放在你想hugo博客的安装位置，我把它安装在D盘，我在D盘新增一个hugo文件夹，把这个exe文件放在hugo文件夹中。 3、配置系统的环境变量。右键“我的电脑”-“属性”-“高级系统设置”-“环境变量”-“path”-“编辑环境变量”-“新建一个D:\HUGO”的环境变量。 4、打开cmd，输入"hugo version"，如果有版本提示，没有报错表示已经安装成功。 本地生成博客 进入D盘中，鼠标右键“git bash here”(要安装git才有这个选项),demo是实例名称，可根据自己的实际情况输入，输入以下命令： hugo new site demo 这时已经生成一个名字为’demo’的文件夹，这个文件夹就是用来存放你的博客内容的了，其结构如下： ├── archetypes │ └── default.md ├── config.toml # 博客站点的配置文件 ├── content # 博客文章所在目录 ├── data ├── layouts # 网站布局 ├── static # 一些静态内容 └── themes # 博客主题 下载主题 由于hugo自身没有主题的，需要下载主题才能运行，前往hugo官网挑选一款合适的主题，把下载好的主题放在博客文件夹中的“themes”，然后进行解压。 我们将exampleSite 目录中的内容，复制到博客根目录demo中，在demo目录中执行命令： cp themes/themes（这里替换为你自己所下载的主题名称）/exampleSite/* ./ -r 启动博客 hugo server 这时，你就可以打开http://localhost:1313查看自己本地生成的博客了。 生成自己的第一篇文章 hugo new post/hello word.md 这个时候你就可以在博客content文件中多了一个post文件夹，里面有个叫"hello world",md格式的文件，这个时候就可以愉快在这个文件中写文章了。编辑这个md格式文件我自己使用的vscode。 ...