基于React+Vite+TypeScript实现的个人官网（纯前端）

前言

        这是一个基于React+Vite+TypeScript实现的纯前端的个人官网。官网分为我的博客、音乐馆、私人图库、个人简历、个人小说和实用工具等六大模块。以下是对这六大模块的介绍：

• 我的博客：自己可以在该模块上发博客、查看博客，并且可以根据类别来筛选博客；
• 音乐馆：在这里可以听音乐，该模块有选择歌曲、播放、暂停、上下首切换、进度切换等功能；
• 私人图库：保存着自己喜欢的图片，什么时候想用时可以在这上面下载，而不再需要上网搜；
• 个人简历：该模块实现将简历通过web的形式展现给别人，并且还可以下载PDF版本的个人简历；
• 个人小说：该模块以后用来存放自己编写的小说，别人可以在上面看我写的小说；（该模块未开发，且你们用自行删除）；
• 实用工具：这里有一些自己编写的工具库，比如：JSON格式化（目前只写了这个功能）、数据加密等等；

        项目预览地址（后期会换地址，换了会更新该博客）：https://neverctrlcv.github.io/
        该项目没有具体的地址，如果有需要的朋友可以私信我，找我要源代码。当然，等后期我写的很完善时会上传到Github，需要的朋友可以自行拉取代码（上传后会更新该博客）。

技术栈

        该章节主要是讲一些相关技术栈，如果没有学相关技术栈的朋友建议先去学习一下，不然看起来估计有点困难。以下是对项目使用的相关技术或库的描述：

• React：本项目使用的是18版本，都是采用函数式组件开发；
• React-Router-Dom：本项目使用的是6版本，需要提前了解以下与之前版本的区别；
• redux：一个状态管理库，采用的是4版本；
• react-markdown：该库能够讲markdown文档解析成HTML；
• rehype和rehype-raw：这两库是能够解析markdown文档中的HTML代码；
• react-syntax-highlighter：该库可以让markdown中代码转成HTML后能够实现代码高亮、显示行数等等；

项目效果

网站首页

个人博客

音乐馆

实用工具

个人简历和小说

        该部分内容属于个人自己的东西，所以这里就不放效果图了，为了保护自己的隐私哈哈哈哈。

总结

        该项目摆脱了对后端代码的需求，一切功能都是用前端代码实现。也许有人会问，不使用后端代码那无法更新和新增博客呀。本项目采用的是配置表的形式实现，新增或修改的博客只要放在固定的路径下，然后改一下配置表，就能实现后端的功能。该项目还没有开发多久，后面会不断完善和修改的，如果需要该项目的朋友可以私信我。
        本人后期的博客会在自己的网站上发布，需要看的朋友可以通过前面的那个链接访问哦，谢谢大家的支持！！！

（编写于2023年12月5日）