# react-admin

**Repository Path**: EdisonJack/react-admin

## Basic Information

- **Project Name**: react-admin
- **Description**: 使用react18创建的最新技术栈后台管理项目，本项目目前完全由AI生成，可供学习，禁商用
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-06-20
- **Last Updated**: 2025-06-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 后台管理系统 - React 18 模板

这是一个基于 React 18、TypeScript、Ant Design 和 Redux Toolkit 构建的现代化后台管理系统模板。

## 技术栈

- **React 18** - 最新的 React 版本
- **TypeScript** - 类型安全的 JavaScript
- **Ant Design 5** - 企业级 UI 组件库
- **Redux Toolkit** - 现代化的 Redux 状态管理
- **React Router 6** - 路由管理
- **Vite** - 快速的构建工具
- **Sass** - CSS 预处理器
- **Axios** - HTTP 客户端
- **i18next** - 国际化支持

## 功能特性

- 🎨 现代化的 UI 设计
- 📱 响应式布局
- 🔐 用户认证和授权
- 🌐 国际化支持（中文/英文）
- 📊 数据可视化
- 🔄 状态管理
- 📝 表单验证
- 🎯 TypeScript 支持
- ⚡ 快速开发体验

## 项目结构

```
src/
├── api/           # API 接口
├── components/    # 公共组件
├── pages/         # 页面组件
├── router/        # 路由配置
├── store/         # Redux 状态管理
├── styles/        # 样式文件
├── types/         # TypeScript 类型定义
└── locales/       # 国际化文件
```

## 快速开始

### 安装依赖

```bash
npm install
```

### 启动开发服务器

```bash
npm run dev
```

### 构建生产版本

```bash
npm run build
```

### 预览生产版本

```bash
npm run preview
```

### 类型检查

```bash
npm run type-check
```

### 代码检查

```bash
npm run lint
```

## 环境变量

创建 `.env` 文件并配置以下变量：

```env
VITE_API_BASE_URL=http://localhost:3000/api
```

## 主要页面

- **登录页面** - 用户认证
- **仪表板** - 数据概览
- **用户管理** - 用户 CRUD 操作
- **角色管理** - 角色权限管理
- **部门管理** - 组织架构管理
- **系统设置** - 系统配置

## 开发指南

### 添加新页面

1. 在 `src/pages/` 目录下创建页面组件
2. 在 `src/router/routes.ts` 中添加路由配置
3. 在 `src/api/` 目录下添加相关 API 接口

### 添加新组件

1. 在 `src/components/` 目录下创建组件
2. 使用 TypeScript 定义组件 props 类型
3. 添加必要的样式文件

### 状态管理

使用 Redux Toolkit 进行状态管理：

1. 在 `src/store/slices/` 目录下创建 slice
2. 在 `src/store/index.ts` 中注册 slice
3. 在组件中使用 `useSelector` 和 `useDispatch`

## 代码规范

- 使用 TypeScript 进行类型检查
- 遵循 ESLint 规则
- 使用 Prettier 格式化代码
- 组件使用函数式组件和 Hooks

## 浏览器支持

- Chrome >= 87
- Firefox >= 78
- Safari >= 14
- Edge >= 88

## 许可证

MIT License