Skip to content

在Netlify一站式构建你的个人网站

Posted on:2020-09-03 at 11:04

什么是 Netlify

Netlify 是美国的一家云计算公司,它的官网 Netlify 为用户提供静态网页托管功能。 简单来说,只要你准备好网页代码,不需要购买服务器甚至域名,就可以把你的页面发布到互联网上。所以从定位上来说,它非常适合个人网站搭建,因为它零经济成本、零学习成本、甚至零风险

市面上也有其他的静态网页托管网站,比如腾讯云的 WH,阿里云的 OSS,还有各种 Pages 服务,比如 Github Pages、Gitee Pages、Coding Pages 等等,多多少少我都尝试过,但总归是没有 Netlify 好用,下面是一个功能对比表格:

功能Netlify腾讯云 WH阿里云 OSSGithubPagesGiteePages
免费✔️✔️部分免费
傻瓜式✔️需要自行安装环境需要调 API✔️✔️
博客系统✔️✔️✔️✔️
HTTPS✔️✔️✔️✔️需付费
CDN✔️✔️-需要自己配置✔️
绑定域名✔️✔️-✔️需付费
国内速度✔️✔️✔️✔️
国外速度✔️--✔️-

我自己是比较喜欢 pages 服务的,但是 github 的网络环境在国内实在是太差了,码云 gitee 的 Pages 服务又做的很烂(亲身体验,3 天一小崩,5 天一大崩,访问速度很不稳定),也正好是因为之前搭建在 Gitee Pages 上的网站又崩了,我才想着去尝试一下 Netlify,那感觉就像是捡到宝了。

用 Netlify 能做些什么

最常见的就是搭建博客系统了,博客 blog 这个词虽然非常老了,但现在仍然是技术圈、摄影圈非常重要的一种分享方式,像国内的 CSDN 博客、cnblog 等等国产的老牌博客网站现在仍然有巨大的流量,但爱折腾的人们谁不想要一个属于自己的博客呢?

除了博客,任何静态网站的内容都可以挂在 Netlify 上,比如Cocos 网页游戏,打包成 html 格式就可以放到 Netlify 上让全世界的玩家来游玩。 再比如给自己的项目制作一个官网,比如我现在运行中的 Kiwano Game EngineEasy2D 游戏引擎,都可以有不错的效果。

而且 Netlify 不仅支持Hexo这样的博客系统,还支持gitbookdoxygen等等各式各样的构建工具,比如我搭建的 Kiwano 官网上的用户手册和 API 文档,就是这两种方式生成的,最爽的是完全不需要考虑环境,只要把命令行敲上去,所有的环境都给你一键配置好。

写两行简单命令就可以部署gitbook

如果你喜欢折腾,还可以配合 LeanCloud 这样的前端数据库实现各种各样的需求,比如给自己的博客加一个评论系统,或者做个游戏排行榜等等。

另外,Netlify 还支持 AWS lambda 函数(看文档居然支持 Go 代码)、静态表单等等,不过这些我还没有尝试。

学习使用 Netlify

这不是一篇手把手教学如何使用 Netlify 的博客,因为这样做没有意义。 把部署网站的过程一步一步截图解释说明,会有非常大的时间局限性,很可能过个半年,Netlify 的页面大改,这篇博客就没有参考意义了,而且一般网站都会有入门教程介绍,再不济网上一搜教程也有一大堆,所以我不会做这种手把手的教程之类。

但是有一些坑是我自己踩过来的,简单分享一下我使用时遇到的一些问题,也许可以帮到你。

部署网站的流程

分为两种情况,如果你平时不使用 git 或者 github,你的网站也是一个简简单单的本地项目,那么直接把代码文件夹拖到 Netlify 上就可以访问了。

如果你的网站放在了 Github 上,那么你需要按下面的步骤来进行

域名解析&开启 HTTPS

绑定域名的步骤本身很简单,只需要在Domain Settings里点击添加域名,然后再到购买域名的服务商那里配置 CNAME 解析就可以了。

但是如果要为你的网站配置 HTTPS,那就涉及到 Domain DNS 的配置问题了。 域名 DNS 是用来告诉你域名对应的服务器地址的,比如你访问 nomango.cn,DNS 会告诉你这个域名的服务器实际 ip 地址是 220.x.x.x。

Netlify 支持自动配置 HTTPS,要求是必须使用 Netlify 提供的 DNS 服务,因为这样才能让它为你的域名自动配置 HTTPS 证书。 一般在国内购买的域名默认使用的都是国内的 DNS,所以需要到域名管理页面去修改 DNS 服务器

修改DNS服务器

修改后Domain Settings的页面下方会出现开启 HTTPS 的提示。

是否需要备案

不需要。 域名本身是不需要备案的,只有服务器在国内的网站才需要备案。

有关备案的详细解答可以参考这篇 《腾讯云:是否需要备案》

静态资源优化

Site Settings里有一项是Asset optimization,里面可以设置 CSS、JS、图片压缩,可以节省服务商和用户流量,默认不开启的,推荐开启。