短视频时代,我用了半年时间开发自己的个人网站

短视频时代,我用了半年时间开发自己的个人网站

2023-07-25
暂无分类

前端➕后端➕UI设计,框架NextJS 13,开发时间-半年。现在回过头来欣赏自己的劳动成果,心情很复杂,大体是开心的(满满的成就感),也伴随着些许失落。

半年前,我决定重新搭建个人博客。为什么是重新?因为上一次搭建是在2016年,那会儿我刚工作没多久,hexo霸榜各大博客网站,有不少博主就是那个时候冒出来的,我也是其中一个。后来工作占据了绝大部分时间,不出意外的停更了。

于是在年初的时候,我开始用hexo搭建了个人网站。此一时彼一时,如今的hexo已经和当初的感觉不一样了。有可能是hexo变了,也可能是我变了~翻了一圈,没有发现令我满意的主题。要么就是页面元素太杂,要么就是功能缺胳膊少腿。思来想去,果断抛弃hexo,转战NextJS,又可以写页面,又可以写接口。

废话不多说,介绍一下主要的功能模块,以及我的一些个人想法

首页

左侧是文章列表,现在已经写了40多篇文章,是从我第一天开发这个网站开始,记录的一些工作笔记,之后会发布一些其他类型的内容

文章详情

文章采用markdown格式编写,存到数据库里,网站加载的时候实时渲染。

整个网站最花里胡哨的就是这个页面了,五颜六色的😂,调整markdown主题花了我很多时间。毕竟这个页面高频访问,总要弄的好看点,弄得丑不拉几的,别给自己看吐了。主题是掺杂了其他各个网站的主题,我给综合起来的,如果有谁觉得好看,有需要的,后面我也可以考虑将markdown.css单独开源出去

文章评论

刚开始我想着用开源的评论控件凑合一下,于是选了waline,本来用着挺好的,后面我加入了登录/注册功能,发现waline的用户体系无法嫁接我的用户体系,只能忍痛割爱,代价就是我多花了一个半月的时间开发下面的功能。现在想想其实是有点后悔的,浪费了很多时间。但是又不得不这样做

主要包含以下功能

  • 评论发布
  • 评论修改(不支持)
  • IP归属地
  • 评论时间
  • 账号标签
  • 评论置顶
  • 评论删除
  • 评论回复/引用
  • 评论站内提醒

UI是模仿waline做的,吸收了waline的精华,丢掉了waline的糟粕,所以我觉得这个评论组件比waline的更简洁好用,非常自信不接受反驳😼

评论通知

评论通知是模仿知乎app做的,对目前的UI效果也很满意(其实之前改了很多版本了)

搜索

用的是algoliasearch,我觉得官方的UI不够简约,我就自己定制了UI,过程心累

登录

做了个动画效果,眼睛👀会跟着鼠标移动

注册/忘记密码

邮箱验证码是用自己搭的邮箱服务器发送的。如果你也想自己搭建一个邮箱服务器给注册用户发验证码,可以参考邮箱搭建教程,我相信会给你省去不少麻烦,所有的坑我都帮你踩完了

用户信息

依旧是简单到不能再简单,只能修改头像和修改用户名,没有花里胡哨的功能

小结

整个网站从前到后始终贯彻”极简主义“,表面上看起来没什么难度,其实不然,背后的代码量惊人。如果时间倒流,我绝对不会再动手做这个网站,所有代码自己撸,真的很累。这半年,我产生过无数次放弃的念头,可是又不甘心,就坚持做了下来,如今终于开发完成了,总算可以松口气了。

最后留个网站的链接:wmwm.me,如果喜欢,欢迎常来~

THE END
0/500
暂无评论