












你要回答 3 个核心问题:
如:
建议组合:
| 前端 | 后端 | 数据库 | 适用场景 |
|---|---|---|---|
| Vue3 + Vite | Node.js + Express | MySQL | 后台系统、业务系统 |
| React + Vite | NestJS | PostgreSQL | 大型后台、复杂业务 |
| Vue3 | Python + Django | MySQL | 管理后台、企业内部系统 |
| 静态 HTML | 无 | 无 | 官网类 |
最常见结构:
project/
├── frontend/ # Vue/React
└── backend/ # Node/Django/Flask
npm create vite@latest frontend
cd frontend
npm install
npm run dev
mkdir backend
cd backend
npm init -y
npm install express
建立基本接口:
const app = require('express')()
app.get('/api/test', (req, res) => {
res.json({ msg: 'ok' })
})
app.listen(3000)
pip install django
django-admin startproject backend
python manage.py runserver 0.0.0.0:8000
前端配置 API 地址(proxy 或 env):
// vite.config.js
server: {
proxy: {
'/api': 'http://localhost:3000'
}
}
正常按模块迭代:
✔ 登录/权限
✔ 页面布局
✔ CRUD 页面
✔ 日志系统
✔ 文件上传
✔ 报表图表
✔ 数据库表设计
必备工具:
cd frontend
npm run build
生成:
dist/
pm2gunicorn + nginx用于反向代理 + 提供 HTTPS + 多项目端口分流。
npm install pm2 -g
pm2 start backend1/app.js --name app1
pm2 start backend2/app.js --name app2
pm2 start backend3/app.js --name app3
server {
listen 80;
server_name example.com;
location / {
root D:/project/frontend/dist;
try_files $uri /index.html;
}
location /api/ {
proxy_pass http://127.0.0.1:3000/;
}
}
✔ 将多个端口整合到 Nginx
✔ 一个域名即可访问
✔ Windows Server 完美适配
Docker 可以把前端、后端、数据库全部打包。
docker build -t my-frontend ./frontend
docker run -p 80:80 my-frontend
docker build -t my-backend ./backend
docker run -p 3000:3000 my-backend
docker run -p 3306:3306 -e MYSQL_ROOT_PASSWORD=123456 mysql
生产用 docker-compose.yml 管理多个服务。
使用 Certbot 或 Win-ACME
Windows Server 推荐:
win-acme --target manual --host your-domain.com
Nginx 配置 SSL:
listen 443 ssl;
ssl_certificate /path/fullchain.pem;
ssl_certificate_key /path/privkey.pem;
自动部署流程:
例如 push 后自动:
✔ 构建前端
✔ 部署前端到 Nginx
✔ 重启 PM2
✔ 数据备份
你将完成:
告诉我你希望哪一种?
此内容由惯性聚合(RSS阅读器)自动聚合整理,仅供阅读参考。 原文来自 — 版权归原作者所有。