django前后端分离的项目pycharm

### 配置 PyCharm 实现 Django 前后端分离 #### 设置虚拟环境并安装依赖项 为了确保项目的独立性和稳定性，建议创建一个新的 Python 虚拟环境来管理项目所需的包。这可以通过 PyCharm 的内置工具轻松完成。 ```bash python -m venv myvenv source myvenv/bin/activate # Linux/MacOS myvenv\Scripts\activate # Windows pip install django djangorestframework ``` #### 创建 Django 项目结构 按照标准的 Django 结构初始化新项目，并调整 `settings.py` 文件中的配置以支持前端资源管理和 API 接口服务[^1]。 ```python # settings.py import os from pathlib import Path BASE_DIR = Path(__file__).resolve().parent.parent INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'rest_framework', # RESTful API support ] STATIC_URL = '/static/' MEDIA_URL = '/media/' STATIC_ROOT = BASE_DIR / "collected_static" MEDIA_ROOT = BASE_DIR / "media" CORS_ORIGIN_ALLOW_ALL = True # 开发阶段允许跨域请求 ``` #### 构建 RESTful API 后台接口 利用 Django Rest Framework (DRF) 来搭建强大的 Web APIs。定义模型、序列化器以及视图集以便于前后端交互数据处理[^2]。 ```python # models.py from django.db import models class ExampleModel(models.Model): name = models.CharField(max_length=100) # serializers.py from rest_framework import serializers from .models import ExampleModel class ExampleSerializer(serializers.ModelSerializer): class Meta: model = ExampleModel fields = '__all__' # views.py from rest_framework.viewsets import ModelViewSet from .serializers import ExampleSerializer from .models import ExampleModel class ExampleViewSet(ModelViewSet): queryset = ExampleModel.objects.all() serializer_class = ExampleSerializer ``` #### 使用 Vue.js 或 React 进行前端开发 对于前端部分可以选择流行的 JavaScript 框架如 Vue.js 或者 React 来构建单页面应用程序(SPA)，并与 DRF 提供的服务对接获取所需的数据[^3]。 #### 完成后的目录布局示意如下： ``` project_root/ ├── backend/ │ ├── manage.py │ └── project_name/ │ ├── __init__.py │ ├── settings.py │ ├── urls.py │ └── wsgi.py └── frontend/ ├── public/ │ └── index.html └── src/ ├── assets/ ├── components/ └── App.vue ```