介绍
项目概述
Kevi Blog 是一个基于 Nuxt 4 开发的现代化全栈个人博客和作品展示平台。系统集成了前端展示和后台管理功能，不仅支持传统的博客文章管理，还创新地加入了项目管理、技能展示、图库系统等多种功能。
核心特性
前台展示功能
- ✅ 个人主页 - 精美的个人信息展示和英雄区域，支持轮播图
- ✅ 项目作品集 - 分类展示项目作品，支持详细技术栈介绍和状态管理
- ✅ 技能系统 - 可视化技能展示，支持技能等级和分类管理
- ✅ 在线简历 - 专业的简历展示页面，支持 PDF 下载和打印
- ✅ 博客文章 - 丰富的博客文章展示，支持 Markdown 渲染和浏览量统计
- ✅ 图库系统 - 精美的图片展示，支持分类管理、评论和浏览统计
- ✅ 资源下载 - 资源下载页面，支持下载码保护和分类管理
- ✅ 留言板 - 互动留言功能，支持颜色标签和点赞系统
- ✅ 响应式设计 - 完美适配桌面端、平板和移动设备
- ✅ 暗色/亮色主题切换 - 支持主题自由切换
- ✅ 流畅动画效果 - 精心设计的过渡动画和微交互
后台管理功能
- ✅ 仪表盘 - 实时数据统计和可视化图表（ECharts）
- ✅ 系统监控 - 实时的系统资源监控和性能分析
- ✅ 项目管理 - 完整的项目管理功能，支持技术栈配置、状态管理和排序
- ✅ 文章管理 - 博客文章的增删改查，支持 Markdown 编辑器
- ✅ 分类管理 - 内容分类的层级管理，支持图标和颜色配置
- ✅ 技能管理 - 技能分类和技能项管理，支持技能等级设置
- ✅ 用户管理 - 用户权限和角色管理
- ✅ 文件管理 - 支持本地文件系统和 S3 兼容对象存储，批量文件操作
- ✅ 图库管理 - 图片上传、分类管理和统计分析
- ✅ 资源管理 - 资源文件管理和下载码配置
- ✅ 首页内容管理 - 首页轮播图和内容的可视化编辑
- ✅ 系统设置 - 网站基本信息和 SEO 配置
技术栈
前端技术
- 框架: Nuxt 4.2.1, Vue 3.5.25
- 语言: TypeScript (严格模式)
- UI 组件: Element Plus 2.12.0, Tailwind CSS 6.14.0
- 图标: Nuxt Icon 2.1.0, Element Plus Icons
- 主题: @nuxtjs/color-mode 4.0.0
- 编辑器: MD Editor V3 6.2.0
- 图表: ECharts 6.0.0
后端技术
- 运行时: Node.js (Nuxt Nitro)
- 数据库: MySQL 8.0+, mysql2 3.15.3
- 缓存: Redis 5.10.0
- 认证: JWT Token 9.0.3 + bcrypt 6.0.0
- 文件存储: AWS S3 SDK 3.721.0 (兼容 MinIO), 本地文件系统
开发工具
- 构建: Vite
- 包管理: pnpm
- 代码规范: ESLint 9.39.1
- 容器化: Docker + Docker Compose
在线演示
| 访问入口 | 链接 |
|---|---|
| 🏠 前端演示 | https://kevi-blog-v2.ruanguokj.cn |
| 🔧 后台演示 | https://kevi-blog-v2.ruanguokj.cn/admin |
| 🔑 演示账号 | admin / 123456 |
项目亮点
设计特色
- 磨砂玻璃效果 - 现代化的设计语言
- 渐变色彩方案 - 精心设计的配色系统
- 流畅动画 - 精心设计的过渡效果
- 主题切换 - 完整的暗色/亮色主题支持
功能特色
- 完整的作品展示系统 - 项目、文章、图库、资源一体化管理
- 强大的后台管理 - 数据统计、系统监控、权限管理、轮播图管理
- 丰富的互动功能 - 留言板、颜色标签、点赞系统、下载码保护
- 响应式设计 - 完美适配各种设备
- 高性能优化 - SSR 渲染、懒加载、Redis 缓存策略
技术特色
- 现代化技术栈 - Nuxt 4 + Vue 3 + TypeScript 严格模式
- 企业级架构 - 模块化设计、100+ API 接口、可扩展性强
- 安全可靠 - JWT 认证、路由级权限控制、SQL 注入防护、滑动验证码
- 容器化部署 - Redis + 应用双容器架构、Docker 支持、一键部署
- 灵活存储 - 支持本地文件系统、Docker 卷持久化、S3 兼容对象存储
许可证
MIT License - 详见项目根目录的 LICENSE 文件