Vue与Django结合打造前后端分离项目实战教程

需积分: 8 3 下载量 165 浏览量 更新于2024-10-15 1 收藏 1.46MB RAR 举报
资源摘要信息:"Vue、Django前后端分离项目实战课程" Vue.js 是一款流行的前端JavaScript框架,专为构建用户界面而设计,由尤雨溪(Evan You)创建。它的核心库只关注视图层,易于上手,同时通过其灵活性和组件化的特点,可以很方便地与各种库或现有项目集成。Vue采用数据驱动和组件化的思想,通过数据绑定将DOM和数据自动关联起来,使得开发者能够专注于数据和逻辑的变化,而无需直接操作DOM。 Django 是一个高级的Python Web框架,它鼓励快速开发和干净、实用的设计。Django遵循模型-视图-控制器(MVC)的架构模式,但主要采用模型-模板-视图(MTV)的模式。Django提供了丰富的内置功能,包括数据库访问、用户认证、内容管理、RSS feeds等。它适合需要快速开发和迭代的项目,特别是对于拥有大量内容的网站来说,是一个非常强大的工具。 前后端分离是一种开发模式,它将前端展示层和后端数据层分开,前端主要负责展示和交互,而后端则负责数据处理和业务逻辑。这种模式可以使得前后端开发者并行工作,提高了开发效率,并且使得前端更容易实现跨平台的部署。 在本课程中,我们将结合Vue.js和Django框架来构建一个完整的前后端分离项目。课程内容可能包括以下知识点: 1. Vue.js基础:了解Vue的基本原理,学习其响应式数据绑定、组件系统、指令、事件处理等核心概念。 2. Vue.js项目结构:掌握如何搭建Vue项目,使用Vue CLI创建项目骨架,了解单文件组件的结构。 3. Vue.js高级特性:学习使用计算属性、侦听器、插槽、自定义指令等高级特性。 4. Vue.js路由管理:掌握Vue Router的配置和使用,为应用添加页面路由,实现单页面应用(SPA)。 5. Vue.js状态管理:学习Vuex的原理和使用,对应用状态进行集中管理。 6. Django基础:学习Python Web开发的基础知识,掌握Django的模型定义、数据库迁移、ORM操作。 7. Django视图和模板:理解Django MTV架构中的视图(View)和模板(Template)的作用,学习如何编写视图逻辑和模板标记。 8. Django表单处理:学习如何在Django中处理表单,包括表单的创建、验证、显示和提交。 9. Django认证系统:了解Django内置的用户认证系统,掌握用户注册、登录、权限控制和会话管理。 10. Django REST框架:学习如何使用Django REST framework(DRF)来构建Web API,实现前后端分离的项目架构。 11. 前后端分离实战:将Vue前端项目与Django后端项目进行整合,通过API接口进行数据交互,实现项目的前后端分离。 12. 项目部署:学习如何将前后端分离的项目部署到服务器上,包括静态文件的收集、数据库的配置以及服务器的部署和安全设置。 通过本课程的学习,学员不仅能够掌握Vue.js和Django框架的使用,还能通过实战项目理解前后端分离的架构模式,提高开发前后端分离项目的能力。
2022-01-12 上传
本项目是一个简单的django问卷调查系统,拥有完善的权限机制,以及答卷功能,可扩展性强,用户相关登录、退出、改密等功能均在users应用中,course应用为问卷应用,采用vue+django+sqlite3开发,但后期可配置连接到MySQL数据库! 非常适合大学生作为毕业项目进行改造! 上线部署请自行参考django官方文档!如有部署需求可单独咨询报价! 调试步骤: 1、创建虚拟环境,这里只以python默认创建虚拟环境的方式说明 python3 -m venv venv 2、激活虚拟环境 win: venv\Script\activate linux: source venv/bin/activate 3、安装依赖 pip3 install -r requirements.txt 4、启动调试服务器 python3 manage.py runserver 前台所有页面默认均需要登录后方可访问 学生登录后直接进入选择问卷页面,选择问卷确认后直接进入问卷答题页面,成功跳转到个人中心,失败会有失败提示,问卷所有选项在没提交问卷之前均可修改,提交后选项不能修改,一个问卷一个学生只能作答一次,不能重复作答! 老师登录后跳转到个人中心,可修改密码,查看问卷结果,通过问卷结果的学生名可访问该问卷该学生的作答详细信息! 前台登录功能,学生、老师、超管均可登录,登录成功根据角色类型显示不同页面对应不同操作。 超管前台登录权限和老师基本一致,只是查看问卷结果为全员的问卷结果,而老师只能查看自己名下关联课程的问卷! 超管后台登录拥有所有权限,可在后台导出问卷结果及课程详情结果,格式为csv! 超管拥有批量导入用户信息权限! 超管可在后台修改任何用户的密码! 学生及教师均可在前台修改密码、姓名和用户名, 姓名和用户名修改时默认显示在修改框! 超管后台功能列表 用户管理 - 学生、教师信息增删改查! 开课时间 - 【增删改查】添加课程之前必须设置,因为在添加课程是需要选择开课时间,依赖该项! 课程管理 - 【增删改查】添加课程,课程需关联老师及开课时间,请提前创建! 问题管理 - 【增删改查】问题维度已经内置直接选择,问题、权重可修改,问题选项在对应的问题下添加,请注意选择选项多对应的选项号! 问卷管理 - 【增删改查】问卷可多选题库,关联教师,关联课程,请提前创建! 问卷结果 - 【管理员可删除】 可批量导出,可按课程及教师筛选查看! 课程结果 - 课程列表依赖添加的课程,已经有学生答题的课程,在删除课程前需谨慎,会导致之前的结果无法查看! 超管导入用户数据地址:http://127.0.0.1:8000/course/loaddata/user/ 用户数据录入说明: 老师和学生录入信息字段基本一致,id[值唯一]、username[值唯一]、password、code[值唯一,并且不能以0开头]为必填。 user_type字段为用户类型,需要在导入前指明用户类型。【学生类型:XS】【教师类型: TC】【超管类型:CG】。 dept字段为学院类型,因为系统已经固定了几个学院选项,所以不能随意填写,需要与选项中的对应。 # 选项类型 DEPT = ( ('计算机科学学院', '计算机科学学院'), ('文学院', '文学学院'), ('外国语学院', '外国语学院'), ('数学学院', '数学学院'), ) code字段为老师或学生的学号,必须唯一,也是必填项,不能以0开始,不能以0开始,不能以0开始,否则编辑信息不可用excel,只能用txt文本管理器打开编辑! 项目根目录有个01.csv的文件为导入用户信息模板,里边录入的几个用户不能删除,除id之外,其余均可修改, id可以从2开始,1的id是超级管理员的id,可以剔除在外!【目前超管的信息已经在文件中,如果系统创建了超管之后再去导入,文件中的超管id=1的信息会被覆盖】 【文件编码格式必须为: 【CSV UTF-8(逗号分割) 】的.csv文件】 前台登录地址:http://127.0.0.1:8000/users/login/ 后台登录地址:http://127.0.0.1:8000/admin/ 学生测试账户: 账号:studentA 密码:123456 教师测试账户: 账号:teachA 密码:123456 超级管理员: 账号:admin 密码:admin123zxc