Skip to content

calla-27/MoZhiCourse

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

MoZhiCourse 在线课程平台

📌 项目简介
MoZhiCourse 是一个基于前后端分离架构的在线课程学习平台,支持学生注册、课程学习、视频播放、社区讨论、教师管理、学习行为分析等功能。


🛠️ 技术栈

后端技术栈

  • Node.js + Express
  • MySQL 数据库
  • JWT 身份验证
  • RESTful API 设计
  • Sequelize ORM(可选,根据实际使用)

前端技术栈

  • Vue 3 + Vue Router + Vuex/Pinia(根据实际使用)
  • Axios 网络请求
  • Element Plus 或自定义 UI 组件
  • Vite 或 Webpack 构建工具

📁 项目结构

后端目录结构 (backend/)

backend/
├── config/                 # 配置文件
├── controllers/            # 控制器
│   ├── community/          # 社区相关控制器
│   ├── coursevideo/        # 课程视频控制器
│   ├── authController.js   # 认证控制器
│   ├── courseController.js # 课程控制器
│   └── ...                 # 其他控制器
├── models/                 # 数据模型
│   ├── community/          # 社区相关模型
│   ├── coursevideo/        # 视频相关模型
│   ├── Course.js           # 课程模型
│   ├── userModel.js        # 用户模型
│   └── ...                 # 其他模型
├── routes/                 # 路由定义
│   ├── community/          # 社区路由
│   ├── auth.js             # 认证路由
│   ├── courses.js          # 课程路由
│   └── ...                 # 其他路由
├── middleware/             # 中间件
│   ├── auth.js             # 认证中间件
│   └── errorHandler.js     # 错误处理中间件
├── services/               # 业务逻辑层
├── utils/                  # 工具函数
├── data/                   # 静态数据
├── .env                    # 环境变量配置
├── index.js                # 应用入口(可选)
├── server.js               # 服务器入口
├── package.json
└── package-lock.json

前端目录结构 (frontend/)

frontend/
├── public/                 # 静态资源
│   ├── videos/             # 视频文件
│   └── index.html          # HTML 入口
├── src/
│   ├── api/                # API 接口定义
│   │   ├── auth.js         # 认证相关 API
│   │   ├── courses.js      # 课程相关 API
│   │   └── ...             # 其他 API
│   ├── assets/             # 静态资源
│   │   ├── student.css     # 学生端样式
│   │   └── teacher.css     # 教师端样式
│   ├── components/         # 组件
│   │   ├── course/         # 课程相关组件
│   │   ├── layout/         # 布局组件
│   │   └── ...             # 其他组件
│   ├── views/              # 页面视图
│   │   ├── Home.vue        # 首页
│   │   ├── Login.vue       # 登录页
│   │   ├── CourseDetail.vue# 课程详情
│   │   └── ...             # 其他页面
│   ├── router/             # 路由配置
│   ├── store/              # 状态管理
│   ├── utils/              # 工具函数
│   ├── App.vue             # 根组件
│   ├── main.js             # 应用入口
│   └── README.md
├── package.json
└── package-lock.json

🚀 快速开始

环境要求

  • Node.js(建议版本 16.x 或更高)
  • MySQL(建议版本 8.0 或更高)
  • Git

克隆项目

# 克隆项目到本地
git clone https://github.com/calla-27/MoZhiCourse.git 
cd MoZhiCourse

数据库设置

  1. 创建数据库
CREATE DATABASE mzcourse CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;
  1. 导入数据库文件
# 导入 SQL 文件(确保 mzcourse.sql 文件位于根目录或指定路径)
mysql -u root -p mzcourse < mzcourse.sql

后端启动

  1. 安装依赖
cd backend
npm install
  1. 配置环境变量
    backend/ 目录下创建或修改 .env 文件和config/database.js 文件:
# 服务器配置
PORT=4000
NODE_ENV=development

# 数据库配置
DB_HOST=localhost
DB_PORT=3306
DB_USER=root
DB_PASSWORD=your_password
DB_NAME=mzcourse

# JWT 配置
JWT_SECRET=your_jwt_secret_key
JWT_EXPIRE=7d

# 文件上传配置
UPLOAD_PATH=./uploads
MAX_FILE_SIZE=50MB
const dbConfig = {
  host: '127.0.0.1',       
  port: 3306,
  user: 'root',
  password: '123456',
  database: 'mzcourse',
  charset: 'utf8mb4',
  connectionLimit: 10,
};
  1. 启动后端服务器
# 开发模式
npm run dev
# 或生产模式
npm start

后端服务默认运行在:

前端启动

  1. 安装依赖
# 返回项目根目录
cd ..
cd frontend
npm install
  1. 配置 API 基础 URL
    检查 frontend/src/api/ 目录下的 API 文件,确保 baseURL 指向正确的后端地址:
// 例如在 request.js 或 axios 配置中
const baseURL = 'http://localhost:4000/api';
  1. 启动前端开发服务器
npm run dev
#
npm run serve

前端服务默认运行在:


👥 测试账号

用户名 密码 角色 说明
student 123456 学生 学生端账号
teacher 123456 教师 教师端账号

📊 功能模块

学生端功能

  • ✅ 用户注册/登录
  • ✅ 课程浏览与搜索
  • ✅ 课程学习(视频播放)
  • ✅ 学习进度跟踪
  • ✅ 社区讨论与评论
  • ✅ 个人中心
  • ✅ 学习行为分析

教师端功能

  • ✅ 课程管理(增删改查)
  • ✅ 章节与视频管理
  • ✅ 学生管理
  • ✅ 成绩统计分析
  • ✅ 教学中心

公共功能

  • ✅ 响应式布局
  • ✅ 用户认证与授权
  • ✅ 实时讨论
  • ✅ 文件上传(头像、视频等)

🔧 常见问题

数据库连接失败

  1. 检查 MySQL 服务是否启动
  2. 确认 .env 文件和config/database.js中的数据库配置正确
  3. 确保数据库用户有足够权限

前端无法访问 API

  1. 检查后端服务是否正常启动
  2. 确认前端 API 配置的端口与后端一致
  3. 查看浏览器控制台是否有 CORS 错误(需要在后端配置 CORS)

视频无法播放

  1. 确保视频文件已正确上传到 public/videos/ 目录
  2. 检查视频文件的访问权限
  3. 确认视频格式支持(建议使用 MP4 格式)

📁 数据库备份与恢复

备份数据库

mysqldump -u root -p mzcourse > mzcourse_backup.sql

恢复数据库

mysql -u root -p mzcourse < mzcourse_backup.sql

🔗 相关链接


📝 开发说明

代码规范

  • 使用 ES6+ 语法
  • 遵循 RESTful API 设计原则
  • Vue 组件使用 Composition API

提交规范

git add .
git commit -m "feat: 添加新功能"  # 新功能
git commit -m "fix: 修复BUG"      # 修复问题
git commit -m "docs: 更新文档"     # 文档更新
git commit -m "style: 代码格式化"  # 代码样式

📄 许可证

本项目仅供学习和演示使用。

最后更新: 2025年12月
维护者: calla-27

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •