? 如何开发个人博客 :

你需要个人博客吗?

现在各大社区都可以发布自己的文章,并且非常之完善,比如掘金,比如知乎等等!

确定你的需求,可以是锻炼技术,可以是喜欢个人随心的布置等等!

如果你需要个人博客

有现成的静态站点供你选择

等等....

开箱即用,也是最受欢迎的模式,如果你对个性化定制没有非常高的要求,这些静态站点生成器对你来事已经是绝佳的了!

使用一键部署

比如

等等....

这些都是我以前使用过的,支持丰富的主题,还有很强大的社区!

如果你并不止步于此!那就跟我一起看看一个最简单的博客如何在你手中诞生!

我想要自己搭建!

技术选型

那可太多了!选你想学的就行了,不用管会不会!

我的选择是Next.js,如果你选择其他的,那就可以省流了!

选择了框架就可以选择UI了,我这里推荐shadcn-ui

如果你要发布文章,就涉及到鉴权,毕竟不是所有人都能在你的网站上发布,还涉及到存储,因此数据库就必不可少了

Next.js中鉴权可以使用NextAuth.js这个库

数据库我们可以自行选择想要的,我这里图方便选择的mongodb

画个图看看

基本链路已经走通,原来自己搭建也不是什么难事啊!

富文本编辑器

流程清楚了,如何展示文章,编辑文章呢,这里就涉及到富文本编辑器了!

富文本编辑器其实是个博客站点的灵魂了

有非常多优秀的富文本编辑器可以供大家选择,比如原作者已经暂停维护的wangeditor

这里我个人选择的是react-mde

我个人喜欢比较简洁的界面,以及这个编辑器可以自定义预览,自定义按钮等,因此定制性比较强!

我可以写一些mdx在里面,并且使用自己的预览展示mdx,这是一件很nice的事情!!就如同上面的SandPack一样!

解析mdx

这里我使用了next-mdx-remote

组合的效果非常好这是我的编辑页面

也支持暗黑模式

当然还有全屏

这是我的预览页面

可以看出我已经自定义了很多按钮

这些按钮都是我封装的一些操作和mdx组件

这样使用起来也更加方便

图片上传

这个推荐使用阿里云的oss,其实也有很多对象存储,比如七牛云的等等,我个人是用服务器搭建了开源的一个图床lsky pro

然后根据文档进行配置和使用就可以了。

最后

我目前的博客

网址 next.blackcell.fun/

支持的组件

为什么不分享其中开发细节?

可以看到 我已经将开发个人博客使用的最基本的东西已经阐述了,具体开发过程肯定是百花齐放

希望大家能够在开发个人博客时遇到一些问题,并且自己去解决一些问题,这样自己的实力才能有所提升!

其次我的个人博客也仅在试运行阶段,当其稳定,功能健全后,会将源码发布在github上,大家可以关注我的github

关于部署

这就是涉及到CI/CD的层面,有时间会发布一篇文章,来讲解我是如何进行持续部署的!

讨论

可以到评论区下讨论,进行一些问题的解答!

相关推荐
想用offer打牌5 小时前
MCP (Model Context Protocol) 技术理解 - 第二篇
后端·aigc·mcp
崔庆才丨静觅5 小时前
hCaptcha 验证码图像识别 API 对接教程
前端
passerby60616 小时前
完成前端时间处理的另一块版图
前端·github·web components
KYGALYX6 小时前
服务异步通信
开发语言·后端·微服务·ruby
掘了6 小时前
「2025 年终总结」在所有失去的人中,我最怀念我自己
前端·后端·年终总结
崔庆才丨静觅6 小时前
实用免费的 Short URL 短链接 API 对接说明
前端
崔庆才丨静觅6 小时前
5分钟快速搭建 AI 平台并用它赚钱!
前端
爬山算法7 小时前
Hibernate(90)如何在故障注入测试中使用Hibernate?
java·后端·hibernate
崔庆才丨静觅7 小时前
比官方便宜一半以上!Midjourney API 申请及使用
前端
Moment7 小时前
富文本编辑器在 AI 时代为什么这么受欢迎
前端·javascript·后端