# wang-blog

**Repository Path**: no-trifling/wang-blog

## Basic Information

- **Project Name**: wang-blog
- **Description**: 一款基于SpringBoot + Vue3 + TypeScript的个人博客系统，采用前后端分离架构。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 2
- **Forks**: 0
- **Created**: 2025-07-10
- **Last Updated**: 2026-02-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

<div align="center">
  <h1>📝 Wang Blog</h1>
  <h2>一款基于SpringBoot + Vue3 + TypeScript的个人博客系统</h2>
  <p>采用前后端分离架构，提供博客浏览和后台管理功能</p>
</div>

## 📚 项目介绍

Wang Blog是一个功能完善的个人博客系统，包含前台博客展示和后台管理两大模块。系统采用前后端分离架构，后端基于SpringBoot实现RESTful API，前端使用Vue3+TypeScript开发响应式UI界面。

## 🏗️ 系统架构

项目分为两个主要部分：

- **wang-blog-admin**: 后端服务，基于SpringBoot开发
- **wang-blog-web**: 前端应用，基于Vue3+TypeScript开发

## 💻 技术栈

### 🔧 后端技术栈

- **核心框架**: SpringBoot 3.0.5
- **ORM框架**: MyBatis-Plus 3.5.12
- **数据库**: MySQL 8.0+ (mysql-connector-j)
- **Java版本**: JDK 17
- **API文档**: Knife4j 4.5.0
- **工具库**: Hutool 5.8.38
- **模板引擎**: Velocity 2.3
- **认证授权**: JWT (自定义实现)
- **异常处理**: 全局异常处理机制

### 🎨 前端技术栈

- **核心框架**: Vue 3.5.17
- **开发语言**: TypeScript 5.8.0
- **状态管理**: Pinia 3.0.3
- **UI组件库**: Element-Plus 2.10.3
- **路由管理**: Vue Router 4.5.1
- **HTTP客户端**: Axios 1.10.0
- **构建工具**: Vite 7.0.0
- **Markdown编辑器**: Vditor 3.11.1
- **图标库**: @element-plus/icons-vue 2.3.1

## ✨ 功能特性

### 🌐 博客前台
- ✅ 文章浏览
- ✅ 分类查询
- ✅ 标签查询
- 🚧 按条件筛选文章 **(未实现)**
- 🚧 登录后评论 **(未实现)**
- 🚧 点赞功能 **(未实现)**

### ⚙️ 博客后台
- ✅ 用户管理
- ✅ 分类管理
- ✅ 标签管理
- ✅ 文章管理
  - ✅ 文章创建
  - ✅ 文章编辑
  - ✅ 文章发布/下架
- 🚧 评论管理 **(未实现)**
- 🚧 数据统计与分析 **(未实现)**

## 📋 待实现功能

以下是计划实现的功能：

1. 💬 **评论系统**：实现用户评论功能，包括评论发表、回复、审核等
2. 📊 **数据统计**：实现管理后台的数据统计图表，显示文章阅读量、用户活跃度等
3. 👍 **点赞功能**：实现文章点赞功能

## 📦 安装部署

### 🚀 后端部署
```bash
# 进入后端目录
cd wang-blog-admin

# 编译打包
mvn clean package

# 运行应用
java -jar target/wang-blog-admin.jar
```

### 🚀 前端部署
```bash
# 进入前端目录
cd wang-blog-web

# 安装依赖
npm install

# 开发环境运行
npm run dev

# 生产环境构建
npm run build
```

## 🗄️ 数据库配置

项目使用MySQL数据库，初始化SQL脚本位于 `wang-blog-admin/sql/wang-blog.sql`。

默认数据库配置：
```yaml
spring:
  datasource:
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://localhost:3306/wang_blog
    username: root
    password: root
```

## 📷 系统截图

### 博客前台
#### 博客首页
![博客首页展示](docs/screenshots/blog-home.png)

#### 分类浏览
![分类页面展示](docs/screenshots/blog-category.png)

### 博客后台
#### 管理员登录
![后台登录界面](docs/screenshots/admin-login.png)

#### 文章管理
![文章列表管理](docs/screenshots/admin-article.png)

#### 内容编辑
![文章编辑页面](docs/screenshots/admin-editor.png)