主题
【哥飞推荐】新人友好完全无需数据却有管理后台,可以动态更新网站内容的开源CMS
公众号: 哥飞 发布时间: 2024年8月11日 22:11 原文链接: https://mp.weixin.qq.com/s?__biz=MjM5OTIzMzYyMA==&mid=2650083483&idx=1&sn=7a28e634adff62df78946ec0eeea259b&chksm=bf3f21a08848a8b6feaafd141a2867beab78f572664d5c96a058394135c40e88c0e93c2804be#rd
大家好,我是哥飞。
如果你不会 Next.js ,如果你不知道怎么配置数据库,却想部署一套自己的网站,那么今天哥飞开源的这套代码,绝对值得你拥有。
这个周末,哥飞借助 Claude.ai 的帮助,做出来了一个网站,目前网站长下面这样,还是挺简洁的是吧。
<table style="visibility: visible;"><tbody style="visibility: visible;"><tr style="visibility: visible;"><td width="557" valign="top" style="word-break: break-all; visibility: visible;"><p style="text-align: center; visibility: visible;"><img class="rich_pages wxw-img" data-galleryid="" data-imgfileid="502599825" data-ratio="0.8862491000719942" data-s="300,640" data-src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPsOrZPqgib1DqUFcdrvkECw1ic1230iaibaRhiaE1hicuibDZticZ3qUjib5icPiaw/640?wx_fmt=png&from=appmsg#imgIndex=0" data-type="png" data-w="2778" style="height: auto !important; visibility: visible !important; width: 654.992px !important;" data-original-style="" data-index="3" src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPsOrZPqgib1DqUFcdrvkECw1ic1230iaibaRhiaE1hicuibDZticZ3qUjib5icPiaw/640?wx_fmt=png&from=appmsg#imgIndex=0" _width="677px" alt="图片" data-report-img-idx="0" data-fail="0"></p></td></tr></tbody></table>
这个网站目前具有资源导航和博客两大功能。
如果仅仅只有这些功能,其实这个网站一点儿也不稀奇,很多网站都有类似功能。
不过哥飞做的这个网站有些不太一样的地方,那就是这个网站完全不需要数据库。
很多朋友都会有这样的困扰,我就想快速上线个网站走完全流程,结果又要配置各种接口,又要配置各种数据库,还得去配置数据库,好麻烦啊,好多卡点啊。
哥飞昨天突发奇想,既然大家有这样的困扰,哥飞是否可以帮助大家解决这个困扰呢?
能不能开源一套网站代码,可以一键部署到 Vercel ,不用数据库,不用复杂的配置,就让大家快速上线一个导航+博客网站。
说干就干,哥飞借助 Claude.ai 肝了一天半,搞出来了目前这些功能,终于在周日晚上把网站第一版代码开源了。
这套代码的潜力仅仅只是不需要数据库吗?
当然不是! 基于这个框架,甚至可以实现接入AI之后,让AI自己修改代码,让AI自己增加新功能,让AI自己增加网站内容。
这一切,都得益于哥飞设计了一套在线数据更新和网站代码自动部署机制。
当然,要做到这些,离不开 Github 提供的方便的 API,以及 Vercel 提供的自动检测代码变化自动部署机制。
下面哥飞给大家介绍一下这套代码的运行机制。
一、网站前台
网站前台可以简单理解为纯静态的,打开看下下面的性能测试报告,100分,说明性能还是很不错的,打开速度特别快。

网站有两种数据,一是资源导航列表,二是文章列表,前者数据来自于代码里的 json 文件,后者数据暂时来自于后端代码扫描出来的 markdown 文章列表,后面也可以修改成直接读取 json 文件,进一步加快打开速度。
因为完全没有读取数据库的操作,所以读取数据的速度就特别快,网站打开也就特别快。
下面是在一个隐私窗口首次打开时的加载速度,可以说做到了秒开。
<table><tbody><tr><td width="557" valign="top" style="word-break: break-all;"><p style="text-align: center;"><img class="rich_pages wxw-img js_img_placeholder wx_img_placeholder" data-galleryid="" data-imgfileid="502599827" data-ratio="0.6988984088127295" data-s="300,640" data-src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPchDBUAUov0FDPd2ibSpVH8Gunyw5VNGyoyelFJeyKemgRHf1w90UKVQ/640?wx_fmt=png&from=appmsg#imgIndex=2" data-type="png" data-w="1634" style="aspect-ratio: calc(1.43082) / 1; width: 655px !important; height: auto !important;" data-original-style="" data-index="5" src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPchDBUAUov0FDPd2ibSpVH8Gunyw5VNGyoyelFJeyKemgRHf1w90UKVQ/640?wx_fmt=png&from=appmsg#imgIndex=2" _width="677px" alt="图片"></p></td></tr></tbody></table>
二、网站后台
没错,虽然这套代码没有数据看,但却提供一个在线管理后台,你可以在这个后台里编辑资源导航列表,查看、修改、创建文章。
下图是资源列表管理后台,可以查看资源列表,修改资源信息,添加新的资源。
<table><tbody><tr><td width="557" valign="top" style="word-break: break-all;"><p style="text-align: center;"><img class="rich_pages wxw-img js_img_placeholder wx_img_placeholder" data-galleryid="" data-imgfileid="502599828" data-ratio="0.5775673707210488" data-s="300,640" data-src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPCRaXofbtEP2Bw3Khsv5xE82nlELSh5BU2AK9WKpHWyauNXxbsDDCog/640?wx_fmt=png&from=appmsg#imgIndex=3" data-type="png" data-w="2746" style="aspect-ratio: calc(1.7314) / 1; width: 655px !important; height: auto !important;" data-original-style="" data-index="6" src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPCRaXofbtEP2Bw3Khsv5xE82nlELSh5BU2AK9WKpHWyauNXxbsDDCog/640?wx_fmt=png&from=appmsg#imgIndex=3" _width="677px" alt="图片"></p></td></tr></tbody></table>
说资源大家可能不好理解,说成导航就好理解了。你可以用这套代码轻松上线一个导航网站。
刚才说了,你甚至可以接入AI,达到AI来自动挖掘新的需要收录的导航数据,实现完全由AI驱动的自我更新的导航网站。
下面是文章管理后台,你可以查看文章列表,修改旧的文章,或者添加新的文章。
<table><tbody><tr><td width="557" valign="top" style="word-break: break-all;"><p style="text-align: center;"><img class="rich_pages wxw-img js_img_placeholder wx_img_placeholder" data-galleryid="" data-imgfileid="502599829" data-ratio="0.4392857142857143" data-s="300,640" data-src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPvjicQ7rFZC3D1UbKUReBqaAKWd4O7FtL1rSEicStTicJqNW5lKkEkVznQ/640?wx_fmt=png&from=appmsg#imgIndex=4" data-type="png" data-w="2800" style="aspect-ratio: calc(2.27642) / 1; width: 655px !important; height: auto !important;" data-original-style="" data-index="7" src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPvjicQ7rFZC3D1UbKUReBqaAKWd4O7FtL1rSEicStTicJqNW5lKkEkVznQ/640?wx_fmt=png&from=appmsg#imgIndex=4" _width="677px" alt="图片"></p></td></tr><tr><td valign="top" colspan="1" rowspan="1" style="word-break: break-all;"><p style="text-align: center;"><img class="rich_pages wxw-img js_img_placeholder wx_img_placeholder" data-galleryid="" data-imgfileid="502599830" data-ratio="0.46747676912080055" data-s="300,640" data-src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPl0H2oSUxF6NBwlOtibrQxIgL1D8LZd6hr0FymEJ6oedKXRas3jP5P9A/640?wx_fmt=png&from=appmsg#imgIndex=5" data-type="png" data-w="2798" style="aspect-ratio: calc(2.13914) / 1; width: 655px !important; height: auto !important;" data-original-style="" data-index="8" src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPl0H2oSUxF6NBwlOtibrQxIgL1D8LZd6hr0FymEJ6oedKXRas3jP5P9A/640?wx_fmt=png&from=appmsg#imgIndex=5" _width="677px" alt="图片"></p></td></tr><tr><td valign="top" colspan="1" rowspan="1" style="word-break: break-all;"><p style="text-align: center;"><img class="rich_pages wxw-img js_img_placeholder wx_img_placeholder" data-galleryid="" data-imgfileid="502599831" data-ratio="0.6710402999062793" data-s="300,640" data-src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPj3xGnEibJm4OYA1Ov2HaLm53Jibwc1VdUvFC4OlmV3VtowodFeNsefEA/640?wx_fmt=png&from=appmsg#imgIndex=6" data-type="png" data-w="2134" style="aspect-ratio: calc(1.49022) / 1; width: 655px !important; height: auto !important;" data-original-style="" data-index="9" src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVPj3xGnEibJm4OYA1Ov2HaLm53Jibwc1VdUvFC4OlmV3VtowodFeNsefEA/640?wx_fmt=png&from=appmsg#imgIndex=6" _width="677px" alt="图片"></p></td></tr></tbody></table>
同样的,文章你也可以在接入AI之后,让AI帮你去写。
不过暂时今天周日发布的第一版,还没有接入AI。
那么要如何基于这套代码,快速上线,部署一个网站呢?
请关注哥飞公众号,明天更新部署教程。
开源代码: https://github.com/qiayue/GitBase 演示网站: https://gitbase.app/ 如果你能够看懂英文的话,其实演示网站里写了好几篇英文版的教程,可以去看一看。
<table><tbody><tr><td width="557" valign="top" style="word-break: break-all;"><p style="text-align: center;"><img class="rich_pages wxw-img js_img_placeholder wx_img_placeholder" data-galleryid="" data-imgfileid="502599832" data-ratio="0.6695736434108527" data-s="300,640" data-src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVP6ROsVWmdthG3zjtqEh2Cj6esGW9AAk3ZMvd1oeUpzDg5ctmIoPOibBA/640?wx_fmt=png&from=appmsg#imgIndex=7" data-type="png" data-w="2064" style="aspect-ratio: calc(1.49349) / 1; width: 655px !important; height: auto !important;" data-original-style="" data-index="10" src="https://mmbiz.qpic.cn/sz_mmbiz_png/LBrX00GQeictGXLVUEugNicByIMBX0mBVP6ROsVWmdthG3zjtqEh2Cj6esGW9AAk3ZMvd1oeUpzDg5ctmIoPOibBA/640?wx_fmt=png&from=appmsg#imgIndex=7" _width="677px" alt="图片"></p></td></tr></tbody></table>
好了,今天的文章就到这里了,请关注哥飞公众号,期待明天的中文版部署教程吧。
相关链接
- 服务器部署]
- Semrush]