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 提供。
相关推荐
晓晓莺歌11 分钟前
vue3某一个路由切换,导致所有路由页面均变成空白页
前端·vue.js
web打印社区5 小时前
web-print-pdf:突破浏览器限制,实现专业级Web静默打印
前端·javascript·vue.js·electron·html
Amumu121386 小时前
Vuex介绍
前端·javascript·vue.js
css趣多多6 小时前
Vue过滤器
前端·javascript·vue.js
这是个栗子8 小时前
【Vue代码分析】前端动态路由传参与可选参数标记:实现“添加/查看”模式的灵活路由配置
前端·javascript·vue.js
刘一说8 小时前
Vue 动态路由参数丢失问题详解:为什么 `:id` 拿不到值?
前端·javascript·vue.js
方也_arkling9 小时前
elementPlus按需导入配置
前端·javascript·vue.js
David凉宸9 小时前
vue2与vue3的差异在哪里?
前端·javascript·vue.js
css趣多多10 小时前
this.$watch
前端·javascript·vue.js
有来技术10 小时前
ASP.NET Core 权限管理系统(RBAC)设计与实现|vue3-element-admin .NET 后端
vue.js·后端·c#·asp.net·.net