Netlify优秀的静态博客托管平台-自动编译部署生成Web网站可绑域名支持SSL

免费空间   2017年05月26日 21:45  

Netlify优秀的静态博客托管平台-自动编译部署生成Web网站可绑域名支持SSL

最近因为Coding对免费用户的pages服务强加跳转提示广告,让不少人不得不将自己的博客迁回Github。但是Github也有一些无法克服的缺陷:一是访问速度不是很稳定;二是想上SSL只能通过CloudFlare实现。并且CloudFlare访问速度和稳定性都不太好。

今天推荐的netlify则是国外一家提供静态网络托管服务的综合平台,专注于静态网站托管的web服务平台,可以完美的取代Coding。 Netlify完美且免费支持的ssl、域名绑定、http/2和TLS。最重要的就是,管理方式用git方法传递给github、gitlab或者是Bitbucket,然后Netlify就能自动编译并生成静态网站。

对于想要使用Jekyll、、Hugo等静态搭建网站,又害怕复杂的本地环境配置的朋友,Netlify支持自动编译Jekyll、、Hugo等常见的静态博客程序真得是太方便了。另外,Netlify也是一个非常好的静态空间,如果你有用纸小墨 inkPaper或者Html网页,直接就可以上传发布到空间上了。

如果你喜欢静态网站和博客,你可以试试以下方法:

Netlify优秀的静态博客托管平台-自动编译部署生成Web网站可绑域名支持SSL

一、 Netlify使用前准备:熟悉Github和Git

1、Github官网:

  • 1、官方网站:https://github.com/

2、Netlify代码来自于Github、Gitlab或者BitBucket,所以你需要请先在Github、Gitlab或者BitBucket上建立一个代码库,并将自己的网页内容git上传到这个代码库中。Github建库,请看这篇文章:Github空间在线写文章

3、用过Github空间的朋友,都知道Github上的Repos都是公共的,除非你愿意付费,否则你放在Github上的代码都能被所有人下载到。而Bitbucket的免费版本的用户可以有无限的私有Repos。如果想要使用Bitbucket,参考:Bitbucket免费代码托管空间

4、Git使用。Git是目前世界上最先进的分布式版本控制系统,有愿意使用静态的博客的朋友建议系统学习一下Git。如果你只时想要建立一个静态博客,也可以使用Github Desktop,它可以让你像管理FTP那样上传更新代码,新手朋友再也不用害怕命令了。

二、申请Netlify免费空间

1、Netlify官网:

  • 1、官方首页:https://www..com/

2、 首先是到netlify申请注册一个账号。这里可以使用Github、Gitlab以及Bitbucket直接授权登陆。然后登录到空间管理中心,点击右上角的“New site from Git”添加网站。

Netlify添加新的网站

3、然后根据自己的托管平台,可以选择GitHub、GitLab或者BitBucket。我们以最常用的GitHub为演示例子。(选择GitHub的同学,别忘了勾选下方的“Limit GitHub access to public repositories.”选项)

Netlify登录到Github

4、点击GitHub之后会弹出一个让你授权的窗口,然后点击“Authorize netlify”之后,就会在netlify中读取你所有的代码库。 (点击放大)

Netlify授权登录账号

5、 点击你已经建好的库,选好分支(默认master即可),然后点击“Deploy site”,系统就会自动编译你的静态页面了。同时还会给出你的页面二级域名等信息。(点击放大)

Netlify确认编译

6、点击创建后,稍等一会儿,你就可以看到Netlify免费静态空间已经创建成功了,同时你在GitHub的代码也成功在Netlify运行了。 (点击放大)

Netlify创建成功

三、快速在Netlify建立Jekyll、Hexo、Hugo静态博客

1、开源静态博客程序网站:

  • 1、网站首页:https://www.staticgen.com/

2、StaticGen是Netlify旗下另一个开源的静态博客程序网站,这里汇集了大部分开源的静态博客程序,而Jekyll、Hexo、Hugo等几款常见的博客程序则可以一键部署到Netlify空间上。

Netlify一键部署

3、这里以Hexo为例,点击后跳转到Netlify页面,登录你的Github账号。

Netlify跳转到登录

4、命令一个新的项目名称。

Netlify命名一个项目

5、稍等一会儿,Netlify就会自动编译好Hexo博客,完成后如下图所示,你可以直接访问它给的二级域名了:(点击放大)

Netlify完成博客创建

四、Netlify文件管理-用GitHub Desktop图形化管理Github

1、Netlify文件管理直接通过Git提交修改到Github,然后Netlify就会自动执行编译和部署了。不想使用Git的朋友,可以使用GitHub Desktop软件来管理Github空间代码。

3、GitHub Desktop安装后,使用你的Github账号登录,然后你就可以开始下载、修改和上传代码文件了。这个就是GitHub Desktop软件界面了。

GitHub Desktop管理界面

4、以修改Hexo主题为例,首先找到一个漂亮的Hexo主题,从Github打包下载下来。

GitHub Desktop下载主题

5、然后将你在Github与Netlify连接创建好的项目通过GitHub Desktop下载到本地,进入到theme文件夹中。

GitHub Desktop本地文件

6、将下载下来的Hexo主题文件解压放在theme文件夹中。

GitHub Desktop进入主题文件夹

7、然后,修改配置文件_config.yml,将里面theme修改为你的主题,保存。

GitHub Desktop修改配置文件

8、现在打开GitHub Desktop软件,你会在Changes中看到文件变化,提示你提交变化。(点击放大)

GitHub Desktop提示变化

9、输入描述,点击提交。

GitHub Desktop确定提交

10、点击GitHub Desktop右上角的同步按钮,将文件上传到GitHub中,稍等一会儿,你就可以在Netlify那边也看到代码执行后的结果了。

GitHub Desktop执行成功

五、Netlify绑定域名方法

1、点击Netlify页面左上角netlify的logo,你便可以进入静态空间的设置中心。然后请先记录下系统默认给你分配的二级域名,稍后会用到。在接下来点击“set up domain”,输入你要绑定的域名,点击“save”保存即可。

Netlify绑定域名

2、输入你想要绑定的域名。

Netlify输入自己的域名

3、确认后,你就可以看到域名已经成功绑定上了。你可以随时修改域名绑定。

Netlify绑定成功

4、到你的域名DNS解析处,修改域名的CNAME记录,记录值就是刚刚你记下的Netlify二级域名。

Netlify作域名DNS记录

5、域名绑定完成。

Netlify解析完成

六、Netlify添加免费SSL证书

1、设置完成域名绑定之后,设置中心的选项会有少许变化。会增加一个Enable HTTPS的选项。

Netlify开启Https

2、点进去,然后选择“Let’s Encrypt Certificate”按钮,系统会自动签发Let’s Encrypt证书给你的站点。

Netlify签发域名

3、不过前提条件是你的域名已经解析生效了。如果解析还没有生效,那么体会提示“签发失败”的错误。

Netlify生成证书成功

4、如果你想一直使用Https访问的话,可以勾选强制所有的访问转为Https。

Netlify强制跳转

5、Netlify添加免费SSL证书成功。

Netlify添加证书成功

6、Netlify空间演示:

  • 1、博客演示:https://blog.ps/
  • 2、主页演示:https://preacher-chipmunk-31460.netlify.com/freehao123/
  • 3、绑定域名:https://netlify.freehao123.info/

七、Netlify空间使用技巧

1、Netlify可以直接添加html代码。在Netlify面板可以直接一键添加html代码到你的网站</body></head>之前,这样你就可以很方便的把网站统计代码加到网站上了。

Netlify添加代码

2、Netlify可以设置变量及命令。Netlify的免费用户可以为自己的网站设置环境变量、hooks等等。而付费用户则可以为网站设置更加详细的SEO优化。(点击放大)

Netlify设置变量

3、Netlify的访问速度不错。在首页的地图标注上,是有国内节点的(当然也有可能是宣传画而已)。实测大陆访问全部解析到Amazon日本东京节点上,速度表现尚可。

Netlify速度快

文章出自:blog.ps博主投稿,由免费资源部落编辑整理,版权所有。本站文章除注明出处外,皆为作者原创文章,可自由引用,但请注明来源。

域名注册
购买VPS主机

您或许对下面这些文章有兴趣:                    本月吐槽辛苦排行榜

在这个部落村庄里,已经有41 位神马家族成员冒出泡来在农场开始干活了
  • 洛克 14

    紫薯补丁

    这是农场的第 1 块农田,部落批准 [洛克] 在[2017-5-26 22:07]开垦完成.
  • RR233CY 18

    静态博客是巨坑,慎入

    这是农场的第 2 块农田,部落批准 [RR233CY] 在[2017-5-26 22:22]开垦完成.
  • 静态博客玩不转……

    qi 回复:

    @雪丫头, 这个空间是一键帮助生成静态博客的,只要在Github更新就好了。

    雪丫头 回复:

    @qi, GitHub的desktop似乎只支持64位的系统啊?我32位的没安装成功。

    qi 回复:

    @雪丫头, 我的就是在32位的,下载页面最下方的测试版本的,支持32的。

    雪丫头 回复:

    @qi, 我试试看。还想请教下,这个SSL是半程的还是全程的?会不会跟Cloudflare一样是半程的?我昨天刚搞定,不知道三个月之后,证书会不会自动续期?

    qi 回复:

    @雪丫头, 是全程的。三个月后会自动续期。另外,Cloudflare的免费SSL现在也有全程的了。

    雪丫头 回复:

    @qi, 这个真好,能自动续期。使用这个免费的SSL完全没压力。

    qi 回复:

    @雪丫头, 是的,很不错的。

    这是农场的第 3 块农田,部落批准 [雪丫头] 在[2017-5-26 22:53]开垦完成.
  • EQ 4

    :grin: 还是动态的比较好。。不习惯奇葩的第三方评论框

    qi 回复:

    @EQ, 第三方评论容易挂掉。

    这是农场的第 4 块农田,部落批准 [EQ] 在[2017-5-27 00:37]开垦完成.
  • Kreen 3

    靜態還是比較需要手動能力,轉出也不是很方便,曾經跳去玩 hexo 又跑回用 wordpress。
    工程師朋友老愛說我寫個 blog 用 wordpress 是殺雞用牛刀,但我覺得簡單使用挺好的,指甲刀也可以殺雞,但不挺累人的嘛。

    qi 回复:

    @Kreen, WP就是功能强大,易用好。

    这是农场的第 5 块农田,部落批准 [Kreen] 在[2017-5-27 02:56]开垦完成.
  • qiuyming 7

    搬#瓦工又开始闹动静了:全面调整配置,加机房,调整了配置

    qiuyming 回复:

    最后那句不要,再附上机房列表

    这是农场的第 6 块农田,部落批准 [qiuyming] 在[2017-5-27 12:47]开垦完成.
  • qiuyming 7

    手机没法发图了

    qi 回复:

    @qiuyming, KVM终于开始卖了。

    qiuyming 回复:

    @qi, 原来的洛杉矶变成QuadraNet和MultaCom两个机房了,另外上了加拿大机房

    qi 回复:

    @qiuyming, 哦,我以前用他们家的,貌似现在便宜了。

    这是农场的第 7 块农田,部落批准 [qiuyming] 在[2017-5-27 12:50]开垦完成.
  • 蜗牛科技 2

    求博主写个digitalocean安装window教程

    qi 回复:

    @蜗牛科技, 官方不支持windows,虽然说强行安装也可以,但是总感觉不怎么稳定,还不如直接用那些支持Windows的KVM VPS。这里发现有一个非常详细的教程:https://www.whatuptime.com/installing-microsoft-windows-onto-digitalocean-droplet/

    蜗牛科技 回复:

    @qi, 这个需要支付5美元才能看全部步骤啊

    qi 回复:

    @蜗牛科技, 不是吧。我看到了所有的步骤。这里还有一个中文的教程,也是可以的:https://techcat.me/archives/409

    蜗牛科技 回复:

    @qi, 感谢

    李毅哲 回复:

    @蜗牛科技, 要安裝Windows应该用Vultr比较理想

    蜗牛科技 回复:

    @李毅哲, 因为有优惠嘛,利用一下

    RR233CY 回复:

    @蜗牛科技, Vultr比digitalocean更优惠

    这是农场的第 8 块农田,部落批准 [蜗牛科技] 在[2017-5-27 16:11]开垦完成.
  • 静态博客不是很容易备份吗?不过我是玩不转。
    话说,我之前(几个月前吧)投稿了postach.io的文章,没信儿啊

    qi 回复:

    @Unee Wang, 是去年吧。postach.io这个资源已经有读者投稿过了:https://www.freehao123.com/pancake-io-postach-io/,你发来时一看已经收费了。就没有发出来了。

    这是农场的第 9 块农田,部落批准 [Unee Wang] 在[2017-5-29 01:06]开垦完成.
  • Qi,Coding的404页面是默认的,我们自己可以加入一个404.html

    ZFirst 回复:

    @ZFirst, 你可以看看我的网站

    ZFirst 回复:

    @ZFirst, 难怪我没有跳转广告,原来是Coding送了我两个月金牌用户…

    这是农场的第 10 块农田,部落批准 [ZFirst] 在[2017-5-29 16:58]开垦完成.
  • 好久没来了,没想到注册还要邀请码,哈哈,给你Q留言了
    有个疑问,想请教一下,有没有搜索引擎或什么公司,提供搜索结果的服务的?比如,我有个app,想增加一个快速显示需要的内容的搜索功能,面向整个互联网的!有没有这种服务的?

    qi 回复:

    @耳屎网, 有的,用这个:Swiftype,有企业版本的,是付费的。Algolia,这个有免费的。

    这是农场的第 11 块农田,部落批准 [耳屎网] 在[2017-6-1 01:12]开垦完成.
  • 我们网站最近有免费的香港空间可以领取。。。有兴趣可以看看,非广告

    这是农场的第 12 块农田,部落批准 [香港服务器] 在[2017-6-12 15:36]开垦完成.
  • fa

    qi请问出现Build script returned non-zero exit code: 127是什么原因?

    fa 回复:

    @fa, 我刚刚重新部署了,没有填build command,但为什么网站显示的是模板源码呢?

    这是农场的第 13 块农田,部落批准 [fa] 在[2017-6-22 06:43]开垦完成.
  • 2

    还是动态的比较好

    这是农场的第 14 块农田,部落批准 [缘] 在[2017-10-19 19:46]开垦完成.
  • 2

    e3a0be8fd0c8f6e413735cc513c9b315fd24p安装时出现乱码,怎么办

    这是农场的第 15 块农田,部落批准 [缘] 在[2017-10-28 16:13]开垦完成.
  • 2

    已经好了,谢谢

    这是农场的第 16 块农田,部落批准 [缘] 在[2017-10-28 16:13]开垦完成.
看贴要回贴有N种理由!看帖不回贴的后果你懂得的!


评论内容 (*必填):
(Ctrl + Enter提交)   

部落快速搜索栏

各类专题梳理

网站导航栏

X
返回顶部