# recite-interview

**Repository Path**: make-it-easy/recite-interview

## Basic Information

- **Project Name**: recite-interview
- **Description**: 一个基于 Vue 3 + Vite 的面试题目背诵系统，帮助你系统化地准备面试。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-10-19
- **Last Updated**: 2026-10-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 面经背诵系统

一个基于 Vue 3 + Vite 的面试题目背诵系统，帮助你系统化地准备面试。

## 功能特性

### 📚 分类浏览模式
- 按分类查看所有面试题目
- 支持搜索和筛选
- 实时显示学习进度
- 可标记每道题目的掌握状态

### 🎴 卡片模式
- 翻转卡片查看答案
- 随机抽题练习
- 流畅的动画效果
- 快速标记掌握程度

### 📝 背诵模式
- 顺序背诵：按题目顺序逐一背诵
- 随机背诵：随机打乱题目顺序
- 显示/隐藏答案切换
- 实时进度跟踪

### 📊 进度跟踪
- 自动保存学习进度
- 三种状态标记：已掌握、学习中、未开始
- 分类进度统计
- 数据本地存储，永不丢失

## 数据分类

系统包含以下面经分类（数据在每次构建时自动从网站爬取更新）：

- 🤖 **AI面经** - 大模型、RAG、Spring AI 等相关题目
- 🎨 **前端面经** - HTML/CSS/JS、Vue、Vite 等前端题目
- ☕ **JavaSE面经** - Java 基础语法、OOP、异常处理等
- 🔄 **IO流/多线程** - IO流、多线程、并发编程等
- ⚙️ **JVM面经** - JVM 内存、GC、类加载机制等
- 📚 **综合面经** - 计算机网络、MySQL、SSM 框架等
- 💼 **初级JAVA开发** - 初级 Java 开发面试题
- 🏗️ **SSM框架** - Spring/SpringMVC/MyBatis 框架
- 📋 **业务面经** - 业务相关面试题
- 📄 **简历面经** - 简历相关面试题

## 数据爬取

项目支持构建时自动爬取最新面经数据：

```bash
# 手动运行爬取脚本
npm run scrape

# 构建时自动爬取（prebuild 钩子）
npm run build
```

爬取脚本位于 `scripts/scrape.js`，会自动从 https://muyi.ltd/categories/面经/ 获取所有面经文章，解析题目和答案，并生成 `src/data/interviewData.js` 数据文件。

## 技术栈

- **Vue 3** - 组合式 API
- **Vite** - 极速开发体验
- **Vue Router 4** - 路由管理
- **Pinia** - 状态管理
- **LocalStorage** - 数据持久化

## 快速开始

### 安装依赖
```bash
npm install
```

### 启动开发服务器
```bash
npm run dev
```

访问 http://localhost:5173

### 构建生产版本
```bash
npm run build
```

### 预览生产版本
```bash
npm run preview
```

## 项目结构

```
recite_interview/
├── scripts/
│   └── scrape.js               # 构建时爬取脚本
├── src/
│   ├── data/
│   │   └── interviewData.js    # 面经数据（自动生成）
│   ├── router/
│   │   └── index.js            # 路由配置
│   ├── stores/
│   │   └── progress.js         # 进度状态管理
│   ├── views/
│   │   ├── HomeView.vue        # 首页（分类列表）
│   │   ├── CategoryView.vue    # 分类浏览页
│   │   ├── ReciteView.vue      # 背诵模式页
│   │   └── CardView.vue        # 卡片模式页
│   ├── App.vue                 # 根组件
│   └── main.js                 # 入口文件
└── package.json
```

## 使用说明

### 首页
- 查看所有面经分类
- 查看总体统计信息
- 点击分类卡片进入分类详情
- 可直接进入背诵模式或卡片模式

### 分类浏览页
- 查看该分类下的所有题目
- 使用搜索框搜索题目或答案
- 使用状态筛选器过滤题目
- 点击状态按钮标记题目掌握程度

### 背诵模式
- 切换顺序/随机模式
- 查看题目，点击显示答案
- 使用导航按钮切换题目
- 标记题目掌握状态

### 卡片模式
- 点击卡片翻转查看答案
- 使用导航按钮切换卡片
- 标记掌握状态后自动进入下一题
- 到达最后一题后可重新开始

## 数据来源

所有面经数据来自：https://muyi.ltd/categories/面经/

感谢原作者的整理和分享！

## License

MIT