【20260619|保姆级教程】免费部署个人网站的最强组合:GitHub + Cloudflare Pages全流程详解

祝大家端午节快乐呀🎉~

想必大家都想有一个免费展示自己能力或者产品的网站,尤其现在有AI的帮忙,编程已经成为了一件门槛很低的事

小编给大家推荐一个完全免费,并且是非常经典的组合:GitHub + Cloudflare

原因

首先跟大家说一下原因,GitHub用来存储代码是免费的,但是直接使用GitHub pages去部署网站的话,在国内经常被墙,无法访问。所以我们需要借助Cloudflare的Pages去进行部署网站,就可以获得免费的CDN加速 + 赠送一个防火墙

这样可以使我们的网站完全免费,并且在国内的访问速度很快

而且部署也很简单,一篇教程就够啦~

步骤

1、准备网站源码

首先,在本地要有一个写好的网站的源码。

如果不会的话,直接交给AI就行了(小编用的Trae)

2、上传GitHub

打开GitHub并登录:https://github.com/

我们新建一个代码仓库

起个名字,记得一定要选Private(私密的),不然你的网站代码会被别人看到

然后到我们的项目根目录,按照GitHub的建议,依次执行这几个命令

当然,如果你不知道命令怎么执行的话,我们还是交给AI就好了

刷新一下,你会看到代码已经成功上传

3、Cloudflare部署

打开并登录Cloudflare:https://dash.cloudflare.com/

我们直接搜索 Workers 和 Pages------然后点击"创建应用程序"

Cloudflare功能非常强大,所以页面也比较复杂,建议直接使用搜索功能就好了

注意坑:一定不要点击上面的"Continue with GitHub"

而要选择下边的这个"想要部署Pages?开始使用"

然后选择"导入现有Git储存库"

在这里找不到刚刚新建的项目很正常,因为我们上边选择的的是"隐私模式"

我们点击下边的"去GitHub上为Cloudflare Page应用配置储存访问库权限"

然后在新页面上一直往下滑,找到"Select repositories"

选择我们刚刚创建的test项目

然后点击"save",直接保存就好了

我们再回到Cloudflare这里,就可以看到test这个新项目了

点击"开始设置"

取个名字

如果是静态网站的话,下边全部保持为空就可以了。如果你有自己的项目构建命令,记得把它填进去。然后点击"保存并部署"

我们耐心的等待它构建完成

点击这个链接去预览一下我们的网站

如果报错的话 ,也不要慌张哈。这是因为SSL证书签发的问题,稍微等个5-10分钟就好了

这样你就拥有了一个属于自己的网站(记住这个网址 https://mytest-web.pages.dev/

4、绑定域名

当然,如果你有自己的域名的话就更好了(好的域名一般是要花钱购买的,如果只想免费的话,下面就不需要再看了😂)

我们需要去域名服务商那里面添加一条记录

比如小编是在腾讯云购买的域名,所以就在腾讯云域名解析这里添加一条记录

点击"添加记录",按照下面方式填写

主机记录:myweb(自己决定)

记录类型:选择 CNAME

记录值:粘贴上一步Cloudflare给我们的访问地址(mytest-web.pages.dev)

DNS 生效也是需要一定的时间的,一般5-10分钟就好了

我们回到 Cloudflare,搜索"Workers 和 Pages",找到刚刚建立的项目------点击"自定义域"------"设置自定义域"

添加上我们的域名

当我们看到状态变为绿色的"活动",就绑定成功了

访问域名:https://myweb.dafei-python.cn/,就可以正常访问我们的网站了

以上就是关于免费部署自己网站的全部教程了。你学会了吗?

如果觉得有帮助,不要忘记 点赞和分享噢~