Vue、Django前后端分离项目实战：学生管理系统V4.0

前端开发

课程简介

这门课解决的核心问题是：如何用 Vue 和 Django 搭建一个可落地的前后端分离项目，并解决从接口对接到表单校验的工程化细节。课程不是单纯演示功能，而是通过学生管理系统这一完整案例，把前后端分离的工程结构、数据流、异常处理和可复用模块讲透。适合什么基础建议读者具备 Python 基础和前端基础（HTML/CSS/JS 至少熟悉一版），最好有少量项目…

已有 1 人浏览发布 2026-09-24 更新 2026-09-27

这门课解决的核心问题是：如何用 Vue 和 Django 搭建一个可落地的前后端分离项目，并解决从接口对接到表单校验的工程化细节。课程不是单纯演示功能，而是通过学生管理系统这一完整案例，把前后端分离的工程结构、数据流、异常处理和可复用模块讲透。

适合什么基础

建议读者具备 Python 基础和前端基础（HTML/CSS/JS 至少熟悉一版），最好有少量项目经验。课程不会从零教语法，而是聚焦于前后端分离的工程协作模式、Element UI 组件用法、Axios 请求处理和表单校验逻辑这些实战模块。

建议先看哪几块

第一块是项目整体结构和前后端分离的工程约定，理解目录组织和 API 约定。第二块是后端接口的增删改查实现，掌握 Django REST Framework 的基本用法。第三块是前端页面与接口的对接，重点看 Axios 请求封装、跨域处理和表单校验流程。这三块是后续所有功能模块的基础。

学完能独立做什么

课程结束前，读者应能独立搭建一个前后端分离的学生管理系统，包括后端模型设计、接口开发、前端页面布局、表格与表单交互、分页与查询功能，以及增删改查的完整流程。更重要的是，读者能将这些模块拆解成可复用的组件和工具函数，应用到其他业务场景中。

资料怎么配合练习

课程配套源码和练习，建议边学边动手：每完成一个模块就对照源码修改一个简单功能（如调整表格样式、增加一个查询接口），再写对应的前端页面。重点不是完成所有练习，而是通过“改代码”加深对数据流和组件复用逻辑的理解。

课程目录

01、Vue、Django前后端分离实战实战，项目的基本介绍[06:12]
02、学习管理系统项目实现的功能演示[10:06]
03、开发前的总体介绍，通过本案例你能学到哪些东西呢？[12:03]
04、后端项目创建和数据库准备[14:44]
05、前端Vue项目的初始化[14:16]
06、引入Element UI和页面结构的布局[11:35]
07、使用Element UI实现侧边栏[08:07]
08、使用Element UI实现表单的布局[16:52]
09、使用Element UI中表格展示数据[11:07]
10、使用Element UI实现分页展示[10:07]
11、实现获取所有学生的后端接口[15:27]
12、Vue中使用Axios请求后端接口的数据[13:06]
13、解决Ajax的跨域请求[10:17]
14、把后端接口返回的数据展示在表格[09:03]
15、实现表格展示数据的分页功能[15:00]
16、实现学生信息查询的后端接口[10:56]
17、完成学生信息查询的功能[13:01]
18、学生管理系统增删改查的总体概述[09:07]
19、使用Element UI实现弹出框的表单[11:42]
20、美化Element UI弹出框表单[10:14]
21、使用弹出框表单展示学生明细[09:04]
22、浅拷贝和深拷贝[10:37]
23、三种状态加载同一个表单[12:00]
24、表单提交前的校验[16:37]
25、校验学号是否存在后端代码的实现[08:02]
26、完成学号的是否存在的校验[12:37]
27、表单的校验和重置[08:53]
28、实现添加学生的后端接口[09:10]
29、完成学生添加的功能[12:18]
30、完成学生修改的功能[08:24]
31、完成学生删除的功能[10:38]
32、完成学生批量删除的功能[14:34]
33、使用Element完成表单中照片展示[08:56]
34、照片上传、存储、展示的过程分析[10:09]
35、完成上传照片后端接口[14:53]
36、实现照片的上传和展示[20:53]
37、实现照片存储在数据库[14:59]
38、读取Excel文件数据到Python[09:52]
39、实现Excel批量导入数据的后端接口[12:18]
40、完成Excel批量导入的功能[15:57]
41、完成导出到Excel的功能[14:05]
42、学生管理系统课程总结[07:58]