django+vue前后端分离看这个绝对可以

今天是充实的一天,最近在整前后端项目,发现网上资源不够详细,总结了一份给有需要快速上手的小白一个参考。开始上菜吧。

代码下载

代码传送门

资源安装

1、python 3.6 3.6以上版本
2、django最新版:pip install django 安装检查:python -m django --version
3、node.js2.0以上:官方网站下载:传送门 安装检查: node -v
4、ElementUI: npm install element-ui
安装步骤网上一大把就不占用资源演示了。
推荐虚拟环境不影响本地:

1、python3 -m venv venv  ; cd bin; source activate
2、安装django: pip install Django
3、安装node.js  :Node.js 官方网站下载:[传送门](https://nodejs.org/en/)
4、利用npm安装vue相关
npm install -g cnpm --registry=https://registry.npm.taobao.org

目录介绍

如图:
FinTesterApp:后台项目
FinTesterWeb:前端项目
quality_management_logic:控制层,后台逻辑这块放在这里面
main:路径
manage:django自带

npm run dev

运行

1、python.exe manage.py runserver 10.94.20.103:8000(本地ip自己改)
2、FinTesterWeb里面执行先加载资源:nmp install ;然后启动:npm run dev
在这里插入图片描述

简单介绍

1、后端定义接口路劲,在这里配置:
在这里插入图片描述
2、后台逻辑接口编写:
记得接口同名
在这里插入图片描述
3、前端路由配置
在这里插入图片描述
4、页面编写
在这里插入图片描述
代码介绍:传送门
5、ip配置
这个改成本地ip
在这里插入图片描述

在线编辑用例
查看测试报告
前后端分离

猜你喜欢

转载自blog.csdn.net/kairui_guxiaobai/article/details/108388770