# edu-practice-web

**Repository Path**: pony_yang/edu-practice-web

## Basic Information

- **Project Name**: edu-practice-web
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-07-01
- **Last Updated**: 2025-07-21

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 智能化实践教学平台 - 前端项目

这是一个基于 React + TypeScript + Vite 构建的现代化前端项目，用于智能化实践教学平台。

## 技术栈

- **框架**: React 18 + TypeScript
- **构建工具**: Vite
- **UI组件库**: Radix UI + Tailwind CSS
- **状态管理**: Redux Toolkit + React Query
- **路由**: Wouter
- **表单**: React Hook Form + Zod
- **HTTP客户端**: Axios
- **图表**: Recharts

## 项目结构

```
├── src/                   # 前端源码目录
│   ├── api/              # API接口定义
│   ├── components/       # 通用组件
│   ├── config/           # 配置文件
│   ├── hooks/            # 自定义Hooks
│   ├── lib/              # 工具库
│   ├── pages/            # 页面组件
│   ├── store/            # Redux状态管理
│   ├── types/            # TypeScript类型定义
│   └── main.tsx          # 应用入口
├── public/               # 静态资源目录
├── index.html            # HTML模板
├── dist/                 # 构建输出目录
├── docs/                 # 项目文档
├── .env                  # 环境变量配置
└── package.json          # 项目配置
```

## 开发指南

### 环境要求

- Node.js >= 18
- pnpm >= 8

### 安装依赖

```bash
pnpm install
```

### 开发环境

```bash
pnpm dev
```

项目将在 http://localhost:3000 启动

### 构建生产版本

```bash
pnpm build
```

### 预览生产版本

```bash
pnpm preview
```

## 环境配置

复制 `.env.example` 到 `.env` 并配置相应的环境变量：

```bash
cp .env.example .env
```

主要配置项：

- `VITE_API_BASE_URL`: 后端API基础URL
- `VITE_APP_TITLE`: 应用标题
- `VITE_DEV_PORT`: 开发服务器端口

## API配置

项目使用Axios作为HTTP客户端，配置文件位于 `client/src/config/axios/`。

后端API地址通过环境变量 `VITE_API_BASE_URL` 配置，默认为 `http://localhost:8080`。

## 部署说明

1. 构建项目：`pnpm build`
2. 将 `dist` 目录部署到静态文件服务器
3. 配置Nginx或其他Web服务器代理API请求到后端服务

## 开发规范

- 使用TypeScript进行类型检查
- 遵循ESLint代码规范
- 组件使用函数式组件 + Hooks
- 状态管理优先使用React Query，复杂状态使用Redux Toolkit
- API接口统一在 `client/src/api/` 目录管理
- 类型定义统一在 `client/src/types/` 目录管理

## 主要功能模块

### 学生端
- 学生工作台
- 我的实践
- 实践中心
- AI指导学习
- 我的成绩

### 教师端
- 教师工作台
- 课程设计管理
- 实践管理
- 学生管理
- AI分析

### 管理端
- 用户管理
- 租户管理
- 系统配置
- 数据统计

## 贡献指南

1. Fork 项目
2. 创建功能分支
3. 提交代码
4. 创建 Pull Request

## 许可证

MIT License