# 2. High Level Architecture

## 2.1 Technical Summary

shadcn全栈管理后台启动模板采用现代化的Jamstack架构风格，结合React前端和Hono后端框架。前端基于Vite构建工具和Tailwind CSS样式方案，后端使用TypeORM进行数据库操作和MySQL作为主数据库。架构采用单体部署方式，通过清晰的代码分离结构确保前后端开发一致性。该架构通过RESTful API规范、OpenAPI文档生成和类型安全的客户端集成，实现了PRD中要求的完整用户认证、权限管理和生产就绪状态。

## 2.2 Platform and Infrastructure Choice

基于PRD要求和开发环境配置，采用多八多云端开发容器环境作为部署平台：

**平台选择：多八多云端容器环境**
- **前端部署：** 同一容器内的Node.js服务
- **后端部署：** 同一容器内的Node.js服务
- **数据库：** MySQL 8.0.36（容器内，默认数据库d8dai）
- **缓存：** Redis 7（容器内）
- **文件存储：** MinIO（容器内）
- **连接方式：** 所有服务使用默认参数连接，正式环境参数相同

## 2.3 Repository Structure

**结构：** Monorepo结构
**Monorepo工具：** Turborepo
**包组织策略：**
- apps/admin - 管理后台React应用（基于shadcn/ui）
- apps/web - 面向用户的Web端React应用
- apps/api - 后端Hono API
- packages/shared - 共享类型和工具
- packages/ui - 共享UI组件库
- packages/config - 共享配置（ESLint、TypeScript等）

## 2.4 High Level Architecture Diagram

```mermaid
graph TB
    User[用户] --> Web[Web前端<br/>React + Vite]
    User --> Mobile[移动端<br/>响应式设计]

    Web --> API[API网关<br/>Hono框架]
    Mobile --> API

    API --> Auth[认证服务<br/>JWT + bcrypt]
    API --> UserService[用户服务]
    API --> DataService[数据服务]

    Auth --> DB[(MySQL数据库)]
    UserService --> DB
    DataService --> DB

    API --> Cache[Redis缓存]
    API --> Storage[MinIO存储]

    API --> External[外部服务<br/>OpenAI等]
```

## 2.5 Architectural Patterns

**Jamstack架构：** 静态站点生成与无服务器API结合 - *理由：* 为内容密集型应用提供最佳性能和可扩展性
**组件化UI：** 基于TypeScript的可复用React组件 - *理由：* 在大型代码库中保持可维护性和类型安全
**仓库模式：** 抽象数据访问逻辑 - *理由：* 支持测试和未来数据库迁移的灵活性
**API网关模式：** 所有API调用的单一入口点 - *理由：* 集中化认证、速率限制和监控