Vue的后端之一,Django

1. 安装 Django

在虚拟环境激活状态下,执行:

bash 复制代码
pip install django

安装完成后,可以用下面命令查看 Django 版本:

复制代码
bash 复制代码
python -m django --version

如果显示 4.x.x5.x.x 即表示安装成功。


2. 创建 Django 项目

  1. 使用 Django 提供的 django-admin 命令行工具来初始化新项目:

    复制代码
    bash 复制代码
    django-admin startproject mysite

    这会在当前目录下创建 mysite 文件夹结构,包含如下主要文件:

    复制代码
    bash 复制代码
    mysite/
    ├── manage.py
    └── mysite/
        ├── __init__.py
        ├── settings.py
        ├── urls.py
        └── wsgi.py
  2. 进入项目目录:

    复制代码
    bash 复制代码
    cd mysite

3. 运行开发服务器

  1. mysite 目录下(与 manage.py 同级),执行:

    复制代码
    bash 复制代码
    python manage.py runserver
  2. 如果一切正常,终端会显示类似:

    复制代码
    bash 复制代码
    Watching for file changes with StatReloader
    Performing system checks...
    
    System check identified no issues (0 silenced).
    
    You have 18 unapplied migration(s). Your project may not work properly until you apply the migrations for app(s): admin, auth, contenttypes, sessions.
    Run 'python manage.py migrate' to apply them.
    January 06, 2025 - 16:00:31
    Django version 5.1.4, using settings 'mysite.settings'
    Starting development server at http://127.0.0.1:8000/
    Quit the server with CTRL-BREAK.
  3. 打开浏览器访问 http://127.0.0.1:8000/,你会看到 Django 默认欢迎页面(火箭图案)。


4. 创建应用 (App)

在 Django 中,项目 (Project) 可以包含多个应用 (App)。每个应用通常对应一个相对独立的功能模块。

  1. mysite 目录下,执行:

    复制代码
    bash 复制代码
    python manage.py startapp myapp

    这会生成一个 myapp 文件夹,其中包含 views.py, models.py, apps.py 等文件。

  2. mysite/mysite/settings.py 中的 INSTALLED_APPS 列表里添加 'myapp',启用该应用:

    bash 复制代码
    INSTALLED_APPS = [
        'django.contrib.admin',
        'django.contrib.auth',
        'django.contrib.contenttypes',
        'django.contrib.sessions',
        'django.contrib.messages',
        'django.contrib.staticfiles',
        'myapp',  # <-- 这里
    ]
  3. 接下来,就可以在 myapp/views.py 中写视图函数,在 myapp/models.py 中定义数据模型,然后在 urls.py 中注册路由等等,进一步开发。


5. 使用数据库 & 迁移

Django 默认使用 SQLite 数据库(适合开发或小型应用),也可切换为 MySQL、PostgreSQL 等。

  1. mysite/mysite/settings.py 中,查看或修改 DATABASES 配置:

    复制代码
    bash 复制代码
    DATABASES = {
        'default': {
            'ENGINE': 'django.db.backends.sqlite3',
            'NAME': BASE_DIR / 'db.sqlite3',
        }
    }
  2. 如果你定义或修改了 models.py 中的模型,需要执行数据库迁移:

    bash 复制代码
    python manage.py makemigrations
    python manage.py migrate

    这会在数据库中创建/更新对应的数据表结构。


6. 创建超级管理员并使用 Django Admin

Django 提供了自带的后台管理系统 (Admin) 供你快速进行数据的查看和管理。

  1. 创建管理员账号:

    复制代码
    bash 复制代码
    python manage.py createsuperuser

    按提示输入用户名、邮箱和密码。

  2. 运行服务器 python manage.py runserver 后,访问 http://127.0.0.1:8000/admin/,输入刚才创建的超级管理员账号登录。

  3. 如果你在 myapp/admin.py 中注册了模型,也能在后端管理这些数据。


7. 常见的下一个步骤

  • 前后端分离 :如果你打算用 Vue 做前端,可以在 Django 中通过 Django REST Framework (DRF) 来编写 API,前端调用这些 API 获取/提交数据。
  • 部署上线 :开发完成后,可以使用 Gunicorn + NginxuWSGI + Nginx 等方式在云服务器上部署;也可使用 Docker 容器化部署,简化环境配置。
  • 收集静态文件 (collectstatic) :若使用 Django 模板或 Admin 的静态文件,需要执行 python manage.py collectstatic 将静态文件统一收集到指定目录,以便在生产环境中由 Nginx 或 CDN 提供。
相关推荐
计算机毕设VX:Fegn08951 天前
计算机毕业设计|基于springboot + vue图书商城系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·后端·课程设计
哆啦A梦15881 天前
商城后台管理系统 03 登录布局
javascript·vue.js·elementui
LYFlied1 天前
Vue2 与 Vue3 虚拟DOM更新原理深度解析
前端·javascript·vue.js·虚拟dom
小飞侠在吗1 天前
vue shallowRef 与 shallowReacitive
前端·javascript·vue.js
by__csdn1 天前
微前端架构:从理论到实践的全面解析
前端·javascript·vue.js·架构·typescript·vue·ecmascript
小福气_1 天前
自定义组件 vue3+elementPlus
前端·javascript·vue.js
是谁眉眼1 天前
vue环境变量
前端·javascript·vue.js
鹏北海-RemHusband1 天前
Vue 组件解耦实践:用回调函数模式替代枚举类型传递
前端·javascript·vue.js
海上彼尚1 天前
vite+vue3 ssg预渲染方案
前端·javascript·vue.js
北辰alk1 天前
Vue 数组响应式原理深度解析:这些方法为何能被监听到?
vue.js