Django + Vue（项目篇）
Prerequisite
【完结】项目地址：xxx
相关文章：
- TypeScript
- VUE 3【基本实现了项目的前端】
- Django
- AI 相关笔记
技术栈：
后端：Python3 + Django（Ninja）
前端：TypeScript + Vue3 + VueRouter + Vuex + Vue-Vben-Admin + Element-Plus-UI
数据库：SQLite3
项目构建工具：Vite + Pnpm
数据模拟：MockJS
AI：ChaGPT-3.5 + Stable Diffusion + MODNet + VITS + Mubert
总结：Django 开发后端 + Vue 开发前端，内容为 AI 故事生成【展现用游戏引擎，No】
相关命令：
- 创建前端：
mkdir front - 创建后端：
mkdir back - 创建后端环境：
django-admin startproject ai【back】 - 创建后端应用程序：
python manage.py startapp core【back/ai】 - 创建后端迁移文件：
python manage.py makemigrations【back/ai】 - 更新后端数据库：
python manage.py migrate【back/ai】 - 启动后端：
python manage.py runserver【back/ai】 - 后端接口测试：http://127.0.0.1:8000/api/docs
- 创建前端环境：
npm create vite@latest【front】 - 下载前端所需库：
pnpm install【front/ai】 - 运行前端项目：
pnpm serve【front/ai】 - 打包前端项目：
pnpm build【front/ai】
所需软件
- Node.js
- Node.js 官方下载地址：https://nodejs.org/zh-cn/ 【选择长期维护版；下载过程最后的选项，打个勾】
- 查看 NPM 是否安装成功：
npm --version
- pnpm
- 下载命令：
npm install -g pnpm【前置是已经下载 Nodejs】 - 查看版本：
pnpm --version
- 下载命令：
- Element-Plus-UI
- 下载命令1：
pnpm install element-plus -w - 下载命令2：
pnpm install -D unplugin-vue-components unplugin-auto-import -w - 下载命令3：
pnpm install @element-plus/icons-vue -w
- 下载命令1：
- Django
- 下载 Django
pip install django django-cors-headers
- 下载 Django
碎碎念
- 数据库本来想用 MySQL 的，结果后端死活显示不出数据（查了好几个小时资料后放弃，改用 SQLite3）
- 前端本来想用 Three.js 构建炫酷主页，也可惜挺复杂的，抄都抄不明白（找的资料）
基于 Django 框架的 AI 故事生成技术与实现
项目前端
基础内容详情这篇文章，本篇基于此进行补充和延申
待完善：
- 启动项目不进入登入页，想让其直接进入剧本页
- emm
剧本页
生成图像页
生成语音页
人物抠图页
背景音乐页
整体演示页
项目后端
Django + AI + 数据库
喜欢划水摸鱼的废人
