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 提供。
相关推荐
揣晓丹23 分钟前
JAVA实战开源项目:校园失物招领系统(Vue+SpringBoot) 附源码
java·开发语言·vue.js·spring boot·开源
顽疲40 分钟前
从零用java实现 小红书 springboot vue uniapp (11)集成AI聊天机器人
java·vue.js·spring boot·ai
派小汤1 小时前
Springboot + Vue + WebSocket + Notification实现消息推送功能
vue.js·spring boot·websocket
阿珊和她的猫3 小时前
Webpack Dev Server的安装与配置:解决跨域问题
vue.js·webpack
醋醋3 小时前
Vue2源码记录
前端·vue.js
艾克马斯奎普特3 小时前
Vue.js 3 渐进式实现之响应式系统——第四节:封装 track 和 trigger 函数
javascript·vue.js
敲代码的玉米C3 小时前
Vue Draggable 深入教程:从配置到实现的完整指南
vue.js
frontDeveloper3 小时前
Vue3基础使用概览
vue.js
南城猿3 小时前
Pycharm中Django框架使用{% load static %}模板,HTML报错
ide·pycharm·django
frontDeveloper4 小时前
Vue2基础原理概览
vue.js