fuxiaochen：个人博客网站程序，使用 Next.js + React 19 + TypeScript + Shadcn/ui + Tailwind CSS 开发，适合开发者学习和交流

本文更新于: 2024年11月10日

APP喵前言：阿喵今天要给大家带来一个超酷的个人博客项目，它用到了Next.js、React 19、TypeScript等一大堆前沿技术。这个项目特别适合那些喜欢折腾技术、爱探索新知识的小伙伴们。虽然它还在不断变化中，不太适合直接用在生产环境，但是绝对是学习交流的好材料。一起来瞧瞧吧！

项目简介

fuxiaochen是一个基于Next.js、React 19、TypeScript等技术栈构建的个人博客网站项目，它集成了多种现代Web开发技术，包括SSR、数据库操作简化、样式组件编写、图标支持、Markdown编辑预览、主题切换、SEO优化、身份验证、图片处理等功能，并提供了详细的部署和开发指南，适合开发者学习和交流。

截图

特色

1. 利用Next.js v15和React 19 hooks实现服务端渲染(SSR)。
2. 采用TypeScript提供类型安全性和提升开发体验。
3. 通过Prisma简化数据库的CRUD操作。
4. 结合Tailwind CSS和shadcn/ui进行样式和组件编写。
5. 支持多种SVG图标的iconify库。
6. 使用Bytemd实现Markdown编辑和预览，并自定义插件优化预览效果。
7. 应用next-theme实现明暗主题切换。
8. 利用next-sitemap生成全站sitemap，提升SEO友好性。
9. 集成next-auth v5支持Github登录和后台管理。
10. 使用ahooks提升开发效率。
11. 图片上传后使用sharp压缩为webp格式，减小体积。
12. 图片上传至阿里云OSS，加快访问速度。
13. 实现响应式设计，适配不同屏幕尺寸和设备。
14. 集成后台管理功能，包括博客、片段、标签、笔记管理等。

项目地址

演示：https://fuxiaochen.com/
GitHub：https://github.com/aifuxi/fuxiaochen