The separation of django+vue front and back ends can definitely see this

Today is a fulfilling day. Recently, I found that the online resources were not detailed enough in the front-end and back-end projects. I summarized a reference for those who need to get started quickly. Let’s start serving.

Code download

Code portal

Resource installation

1. Python 3.6 3.6 or higher version
2. The latest version of django: pip install django installation check: python -m django --version
3. Node.js2.0 or higher: official website download: Portal Installation check: node -v
4. ElementUI : Npm install element-ui
installation steps are a lot of online demonstrations without occupying resources.
It is recommended that the virtual environment does not affect the local:

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

Catalog Introduction

As shown in the figure:
FinTesterApp: Back-
end project FinTesterWeb: Front-end project
quality_management_logic: Control layer, back-end logic is placed here
main: Path
manage: Django comes with

npm run dev

run

1. python.exe manage.py runserver 10.94.20.103:8000 (change the local ip yourself)
2. Load the resource first in FinTesterWeb: nmp install; then start: npm run dev
Insert picture description here

a brief introdction

1. The back-end defines the interface path, and configure it here:
Insert picture description here
2. Back-end logic interface writing:
remember that the interface has the same name
Insert picture description here
3. Front-end routing configuration
Insert picture description here
4. Page writing
Insert picture description here
Code introduction: Portal
5. IP configuration
This is changed to local ip
Insert picture description here

Online edit use case
view test report
separation of front and back ends

Guess you like

Origin blog.csdn.net/kairui_guxiaobai/article/details/108388770