204 lines
4.0 KiB
Markdown
204 lines
4.0 KiB
Markdown
|
|
# React + Django Full-Stack Project
|
|||
|
|
|
|||
|
|
## 项目信息
|
|||
|
|
|
|||
|
|
**项目名称:** 城市手册(CityWiki)
|
|||
|
|
**项目定位:** 地方志兼本地生活服务平台
|
|||
|
|
**技术栈:** React + Django + PostgreSQL + Docker
|
|||
|
|
|
|||
|
|
## 功能特性
|
|||
|
|
|
|||
|
|
- ✅ 用户认证系统(注册、登录、JWT)
|
|||
|
|
- ✅ 版块层级管理(省→市→县→乡镇→村)
|
|||
|
|
- ✅ 文章管理(创建、审核、发布)
|
|||
|
|
- ✅ 特色服务(衣食住行娱乐旅游文化)
|
|||
|
|
- ✅ 交互功能(评论、评分、点赞、收藏)
|
|||
|
|
- ✅ 版主管理(申请、权限、审核)
|
|||
|
|
- ✅ 内容审核流程(版主初审 + AI 审核)
|
|||
|
|
|
|||
|
|
## 技术栈
|
|||
|
|
|
|||
|
|
### Backend
|
|||
|
|
- Django 4.2
|
|||
|
|
- Django REST Framework
|
|||
|
|
- JWT Authentication (djangorestframework-simplejwt)
|
|||
|
|
- GraphQL (graphene-django)
|
|||
|
|
- PostgreSQL
|
|||
|
|
|
|||
|
|
### Frontend
|
|||
|
|
- React 18 (Create React App)
|
|||
|
|
- MobX (状态管理)
|
|||
|
|
- styled-components (CSS-in-JS)
|
|||
|
|
- React Router
|
|||
|
|
|
|||
|
|
### Deployment
|
|||
|
|
- Docker & Docker Compose
|
|||
|
|
- Nginx (反向代理)
|
|||
|
|
|
|||
|
|
## Project Structure
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
.
|
|||
|
|
├── backend/ # Django project
|
|||
|
|
│ ├── config/ # Settings and configuration
|
|||
|
|
│ ├── apps/ # Django apps
|
|||
|
|
│ ├── static/ # Static files
|
|||
|
|
│ └── media/ # Media files
|
|||
|
|
├── frontend/ # React project
|
|||
|
|
│ ├── src/
|
|||
|
|
│ │ ├── components/
|
|||
|
|
│ │ ├── stores/ # MobX stores
|
|||
|
|
│ │ ├── services/ # API calls
|
|||
|
|
│ │ └── styles/
|
|||
|
|
│ └── public/
|
|||
|
|
├── docker-compose.yml
|
|||
|
|
└── .env.example
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 快速开始
|
|||
|
|
|
|||
|
|
### 1. 克隆项目
|
|||
|
|
|
|||
|
|
```bash
|
|||
|
|
git clone http://10.2.0.100:8989/mashen/chengshishouce.git
|
|||
|
|
cd chengshishouce
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 2. 环境变量配置
|
|||
|
|
|
|||
|
|
```bash
|
|||
|
|
cp .env.example .env
|
|||
|
|
# 编辑 .env 文件,配置数据库和其他设置
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 3. 后端启动
|
|||
|
|
|
|||
|
|
```bash
|
|||
|
|
cd backend
|
|||
|
|
|
|||
|
|
# 创建虚拟环境
|
|||
|
|
python -m venv venv
|
|||
|
|
source venv/bin/activate # Windows: venv\Scripts\activate
|
|||
|
|
|
|||
|
|
# 安装依赖
|
|||
|
|
pip install -r requirements.txt
|
|||
|
|
|
|||
|
|
# 运行迁移
|
|||
|
|
python manage.py migrate
|
|||
|
|
|
|||
|
|
# 创建超级用户
|
|||
|
|
python manage.py createsuperuser
|
|||
|
|
|
|||
|
|
# 启动开发服务器
|
|||
|
|
python manage.py runserver
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 4. 前端启动
|
|||
|
|
|
|||
|
|
```bash
|
|||
|
|
cd frontend
|
|||
|
|
|
|||
|
|
# 安装依赖
|
|||
|
|
npm install
|
|||
|
|
|
|||
|
|
# 启动开发服务器
|
|||
|
|
npm start
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 5. 访问应用
|
|||
|
|
|
|||
|
|
- 前端:http://localhost:3000
|
|||
|
|
- 后端 API:http://localhost:8000
|
|||
|
|
- GraphQL:http://localhost:8000/graphql
|
|||
|
|
- Django Admin:http://localhost:8000/admin
|
|||
|
|
|
|||
|
|
## Docker 部署
|
|||
|
|
|
|||
|
|
```bash
|
|||
|
|
# 构建并启动所有服务
|
|||
|
|
docker-compose up -d
|
|||
|
|
|
|||
|
|
# 查看日志
|
|||
|
|
docker-compose logs -f
|
|||
|
|
|
|||
|
|
# 停止服务
|
|||
|
|
docker-compose down
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
详细部署指南请参考 [DEPLOYMENT.md](./DEPLOYMENT.md)
|
|||
|
|
|
|||
|
|
## 项目文档
|
|||
|
|
|
|||
|
|
- [需求文档](./城市手册需求文档.md) - 项目需求说明
|
|||
|
|
- [实施计划](./REQUIREMENTS_IMPLEMENTATION.md) - 需求实施进度
|
|||
|
|
- [部署指南](./DEPLOYMENT.md) - 详细部署说明
|
|||
|
|
- [技术文档](./PROJECT_DOCS.md) - 架构和技术文档
|
|||
|
|
- [API 测试](./TESTING.md) - API 测试指南
|
|||
|
|
|
|||
|
|
## API Endpoints
|
|||
|
|
|
|||
|
|
### REST API
|
|||
|
|
- `/api/users/` - User management
|
|||
|
|
- `/api/users/me/` - Current user
|
|||
|
|
- `/api/auth/token/` - Login (POST)
|
|||
|
|
- `/api/auth/token/refresh/` - Refresh token (POST)
|
|||
|
|
|
|||
|
|
### GraphQL
|
|||
|
|
- `/graphql/` - GraphQL endpoint
|
|||
|
|
- `/graphql/?graphiql` - GraphQL playground
|
|||
|
|
|
|||
|
|
## Development
|
|||
|
|
|
|||
|
|
### Running Backend
|
|||
|
|
```bash
|
|||
|
|
cd backend
|
|||
|
|
python manage.py runserver
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Running Frontend
|
|||
|
|
```bash
|
|||
|
|
cd frontend
|
|||
|
|
npm start
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### Running Tests
|
|||
|
|
|
|||
|
|
Backend:
|
|||
|
|
```bash
|
|||
|
|
cd backend
|
|||
|
|
python manage.py test
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
Frontend:
|
|||
|
|
```bash
|
|||
|
|
cd frontend
|
|||
|
|
npm test
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## Production Deployment
|
|||
|
|
|
|||
|
|
### Using Docker Compose
|
|||
|
|
1. Update `.env` with production values
|
|||
|
|
2. Build images: `docker-compose build`
|
|||
|
|
3. Start services: `docker-compose up -d`
|
|||
|
|
|
|||
|
|
### Nginx Configuration
|
|||
|
|
|
|||
|
|
The frontend Dockerfile includes nginx configuration that:
|
|||
|
|
- Serves React app
|
|||
|
|
- Proxies `/api` requests to Django backend
|
|||
|
|
- Proxies `/graphql` requests to Django backend
|
|||
|
|
- Handles static and media files
|
|||
|
|
|
|||
|
|
## Security Notes
|
|||
|
|
|
|||
|
|
- **Never commit `.env` files**
|
|||
|
|
- Change `DJANGO_SECRET_KEY` in production
|
|||
|
|
- Use strong passwords for database
|
|||
|
|
- Enable HTTPS in production
|
|||
|
|
- Configure `ALLOWED_HOSTS` properly
|
|||
|
|
- Set `DEBUG=False` in production
|
|||
|
|
|
|||
|
|
## License
|
|||
|
|
|
|||
|
|
MIT
|