网站发展史

记录笔记

个人博客发展经历

因为不是开始建设网站的时候写的,所以有一些照片找不到了,例如刚开始的一些照片, 还有刚开始的一些内容也不太准确,Today is 2025-12-29 ,快过年了,是网站建设的 第3周了,我现在开始写这个网站的一步一步更新的内容,在这里先祝大家新年快乐!

1.建站初衷

刚开始只是想要倒腾一下这个fastAPI的路由是怎样实现的,就简单写了一个index.html, 然后写了路由,启动了一下,感觉还挺有意思的,就写了css,排版了一下,截图好像没截 不过没关系,后面就开始打算写一个博客了,就想了一下技术栈,打算就是fastapi + html + css + markdown 做一个展示文章的网站,还是现在网站的核心功能,就开始做了,刚开始做还是 比较复杂的,路由写错,忘记挂载css,html写错,css写的也是一坨答辩,就去问ai,让ai去 帮我把排版画好一点,然后在浏览器里慢慢微调,差不多就是打算写一个展示文章的博客,平时写的 一些markdown,一些学习的东西,我的学习目标,心路历程,发牢骚,闲聊,或者是一些我的心里话 或者一些有意思的东西都可以通过这个表现出来,差不多就这样

发展过程

第一部分

写了一个路由main.py,刚开始只有首页和文章列表页 文章列表页是通过获取了md的存放位置,然后写了一个排序md的路由,读到了md的文件名,返回一个字典 然后写了posts.html,获取了items,然后列表就搞出来了, 放了个测试的.md就是Hello.md,本网站的第一个md,然后就可以显示列表了,差不多就搞了这些

第二部分

开始做那个markdown的文章页面了,上网搜了一下,发现用来markdown是可以转html的, 我直接开始做,先在文章列表页写了一个slug,获取一下点了哪个文章,然后去写路由 差不多就是遍历md目录,看看有没有文章,有文章就把文章从markdown转html, 然后返回一个html回去给网页,然后写了文章页post.html,把路由返回的URL和转好的 html展示出来,就差不多这样

简单讲讲

中间能也没这么流畅,很多时候的css都不是我自己写的,基本上是ai输出的,我再修修改改, html有时候也是,不过html我写一些基础的也比较快,在这些过程里,我感觉我学到最多的 是这个文件的管理,以前我文件都是统一放同一个目录下,通过这个我已经完全养成分类的相关了 还有就是对这一些的网页的路由和网页样式,又了更加多的了解,感觉越做越有劲(后面可不是这样想的) 还有就是pycharm的fastapi直接启动,配置一直搞不懂,pycharm刚刚开始用不太熟悉, 之前用vscode用多了,后面不停上网搜,终于搞好了(感觉自己好蠢)

第三部分

写完了这些内容了,后面想了一下,一个网页也应该有个导航栏吧,就打算写个导航栏, 本来还不确定怎么写的,上网问了一下,才知道原来可以写应该html做父类,其他统一继承的, 本来还想全部html都写一个导航栏的(幸亏我没去这样做),后面就写了一个base.html,把那几个 都继承这个父类了,然后在里面写了一个导航栏,然后优化了一些内容,修修改改了一些css样式 把页面搞的底色是白色的,按钮是蓝色的,没有截图,只能留在记忆里了,网站最初的样子

第四部分

后面就是一些改css,美化网页啊,把背景改成了img,挂载了照片,然后在base.html用这个照片 做背景啊,后面突发奇想,写一个时钟和时间表,我一点经验没有,就是想写,JavaScript我 写都没写过,但是我就是想实现,硬着头皮边问ai边写,时钟部分就更加折磨了,写的我云里雾里的 写完还发现,css样式没修改,就又硬着头皮改了一晚上,真的折磨,写这些自己不会的东西,就是 那个clock.js全站的时钟,写完就歇菜了

第五部分

不知道是不是写上瘾了,还是脑子坏了,又想写一个音乐播放器,刚开始本来打算,音乐播放器就 放在时钟下面的,把左边变成一竖的功能栏,后面发现这样好像不是很好写css,就打算 写成模块化,一块一块好了,然后就是先画了播放器的样子,本来想地很美好,就是一个 唱片在上面旋转,下面一个播放键等等的,音量等等的,后面发现,我好像在自己为难自己 哈哈,放过自己一马,就写了一个文本样式的,写了一个按钮的css,然后就是写路由和js, 两边同时开始写,把音乐放到了目录下,写完音乐链接的路由,去调试,???wdt,为什么 音乐列表返回了空,不应该啊,开始排查,🆗这一排查,整整1个半小时,还是找不到为什么, 去看fastapi文档,看到了覆盖两个字,我终于意识到,是不是css和music在同一个目录下,我 重复挂载了static把路径给覆盖了,我把music挂载放到前面,路由也写到最前面,🆗这一改, 音乐列表终于有内容了,哈哈哈,你不知道我多高兴,我快跳起来了,不是快是直接跳起来了, 挣扎了3个小时,问ai问了一万次,上网搜了3个小时,终于后端有返回了,就这样开始写js 哈哈,刚刚从地狱回来,又掉进火葬场了,js又是边ai边写,基本逻辑了解了,又是修修改改, 缝缝补补,写出了基本的雏形了,字幕的滚动,按钮的逻辑实现(就是当时那个字幕滚动,是从 框外面进到里面,又飞出框外),我又调试了半天,改到在框里滚动,🆗啊,这一部分真的折磨 特别久,休息了一段时间

第六部分

继续开始写代码啊,后面操作网页的时候发现,只有跳转后,播放的音乐就停了,闹完了 一个接一个,哈哈,有什么办法,自己写成这样了,就继续吧,修!!后面上网找原因,原来不是 我代码问题,是浏览器的问题,就是会自动暂停的,后面找了一下怎么搞,说是做一个独立小窗口 又是一顿改,服了,又改了好久,不过还好搞好了,具体过程不记得了,反正就是把样式改了,html 改了,js基本没变,写了pjax.js,来控制全站的刷新方式,改完这个后,去逛了一下别人的博客 发现一个很有意思的,就是鼠标的拖尾,我也想搞,就开了个mousetrail.js,去CSDN找了个别人的 模板 ,修修改改,差不多是一模一样,写进了我的网站里,感谢分享,算是让我知道了这个实现逻辑, 怎么监听鼠标移动,怎么渲染

随便讲讲

写到这里,我发现我居然是没有备份的,居然没上传到GitHub上,也没放到git仓库,就这样死改 有点后怕了,我居然也不怕写爆了,乱改功能,到时候改不回去了,也是紧急上传了,网页也写的差不多 了,就是一些其他的网页了,功能就这些,后面还打算添加一个切换主题背景的功能,还有就是 一个留言板的功能,(打赏功能)开玩笑的,感觉挺有意思,打算搞完这些功能就部署服务器了, 买个域名,服务器,好好玩玩,试了一下功能,看到网站的高亮又不见了,填补齐了pjax.js去 把这些样式内容快速拉取,然后就没有然后了

第七部分

就是写了一个切换主题的功能,先写了一个单独页面的主题切换功能,打算写到我的网站里, 就先写了css样式和html,把它放在了导航栏上面,然后开始写js,后面想了想,要不切换背景照片 试试看,然后又是问ai,自己修修改改,改了一遍css,把js写完了,然后修改了,按钮的大小 就完成了,然后发现主题颜色改变的有的字体颜色不清晰了,我又修改了字体颜色,发现我的 全局css写的太史山了,很多地方都是继承前面的,有的html里面,自己也有css,导致不停的 颜色被覆盖,我也是懒地改了,直接 !important; 了,改好了字体颜色,还挑了半天, 感觉自己的色感好差,居然不知道什么颜色好看,就改了这些,差不多

第八部分

没想到这么快就到第八部分了,看了一眼未完成表单,感觉这个留言板应该很快完成,去GitHub找了 一下,给我找到了一个开源的评论区项目--Artalk, 有兴趣的可以了解一下源码,我看了md,写很详细,配置起来很快,轻量化的插件 就配置了一下里面的密码和数据库,差不多搞了一天,本来是想写个文章页的评论的 但是想了想,我文章又不是什么大文章,没什么好评论的,免得被别人骂文笔不好, 就写一个留言板得了,反正可以审核内容,骂的难听的就给他删了得了,本来做这个文章也 图一乐,配置完了,就去写路由,路由很简单,没什么好说的,然后看了技术文档,模仿的写了 html,和css,然后就差不多搞定了,没写链接就去测试了,结果回了个404,报错空了, 哈哈,第一次出现404,我才想起来,我好像应该写一个接受异常的网页,不然404一个大报错 吓死别人,就去CodePen,找了个好看的,修修改改,加进去了 写了个接受404异常的路由,其他异常就抛出就好了,反正不怎么常见,就把这个小漏洞补上了 ,然后任务完成,功能又实现一个,结束

还是随便说说

刚刚发现了文章列表页面的大小,和进入到文章页面的大小居然不一样,刷新后大小又变的不一样了, 看麻木了,肯定是我写的史山代码发力了,我就去看了css,发现全局css和文章页面的css,宽度居然 不一样,改到一样,删去一个,然后再去调试,怎么没变化?我又去看了一遍css, 发现文章列表页面的css也写了宽度为900px,我估计是900px大小打开了文章页面,然后 浏览器没又修改大小,按这个大小进入了文章页面,然后刷新了一下页面后就变成宽度800px的了 我又去把两个改成900px了,想了想,直接删掉一个好了,哈哈,有时候突然发现自己,写的代码 真的是一环扣一环啊,我是说这个代码写的真史,css不停的别其他地方覆盖,果然人甚至不能共情 过去的自己,又是服我自己的一天

第九部分

今天是打算完成网站的建设了,因为打算在过年前部署上线网站,写完了关于里面的内容,然后本来想加再加一个功能的 就是一个普通的抽签功能,但是我写完后,功能是可以实现的,不过跳转页面后,不知道什么原因就不能抽签了 估计是页面的继承不一的原因,反正我懒得改了,本来就是一个可有可无的功能,大不了以后再添加吧,就这样 把这个功能砍掉了,然后就是检查代码漏洞了,写了一个用来处理文章白名单的,写了个正则表达式来判断文章, 防止乱写,本来说怕之前那个挂载给覆盖的问题再一次出现,打算重构一下代码的,结果bug还越写越多,呵呵, 还是不动了,果然不能过早地重构代码,无非是增加自己的工作量罢了,然后写了个脚本,测试一下本地运行的怎么样 测试完都通过了,我打算就先这样了,把代码推送到main上,就是完整版了,现在是晚上3点23,改到现在也差不多了 困了,先睡了(附:脚本和测试结果)

脚本 测试结果

第十部分

我的服务器环境配好了,终于拿到我的公网IP了,全部打包到我的服务器上,我的服务器选择的镜像源是Linux的CentOS 7.9 配置环境就花了我一段时间,因为上传之前先把依赖文本打包好了,主要是我的反向代理的配置搞了很长时间,本来artalk使用 二进制文件直接配置的,结果artalk的版本过高,这台机子的Linux版本过低了,我就改成docker来配置了,捣鼓了很久的Nginx 反向代理,修修改改,终于是可以看到页面了,修改了一下端口放行,有时候打不开网页,就是因为端口没放行,然后去买了个域名 配好了DNS,然后就去备案了,交了一堆的材料,然后现在静静等待结果,SSL证书的话先等域名下来再说,申请完证书就可以用https链接了, 公网IP是有了,页面也可以打开,不过移动端的适配还没写好,当时也没打算写,也没想到要写,这个还是后面在维护再说吧,暂时有 PC端看才美观一点,后面再写一下吧,就是这么多,以后就在这个什么写文章了

讲讲上线后的变化

主要是留言板区域artalk的变化,从二进制文件变成了docker容器来部署,因为版本号原因,还有就是修改了留言板的前端页面 把原本的背景去掉了,因为有一些地方,把本来的样式给覆盖掉了,导致,页面的功能不完全,所以做了修改, 剩下的时间就是等待备案的完成了,备案好就要改里面的域名了,我们20天后见!

已经上线了!

今天是2026-01-08,我的域名备案完成,接下来就是收尾工作,我的第一个服务器,第一个域名,第一个网页,就在今天正式上线了, 花了很长时间,自己一个人写代码,写好了代码,一个人花时间琢磨服务器,花时间配置反向代理,花了很长时间,不过很有成就感 比起一个人玩游戏,我更喜欢一个写代码,写代码是一种创造的过程,是一个很奇妙的过程,距离我有建站的打算已经过去半个月了, 看这自己一个人琢磨出来一个简陋的网站,很开心,这个就是我的网站,我的学习生涯,如果你觉得有意思,对你有帮助,或者你想 和我交朋友,都可以,你也可以打赏我,资助我继续维护我的服务器,后续我还会继续完成移动端的适配,和后续的功能添加,或者有时间 我把代码重构一次,感谢你的阅读!

返回列表