WebCourse - 信息学测试平台

一个现代化的信息学竞赛在线测试平台，提供完整的题目管理、考试系统和成绩分析功能。

🚀 功能特性

📝 考试系统

• 在线答题: 支持多种题型（选择题、填空题、编程题）
• 实时保存: 自动保存答题进度，防止数据丢失
• 时间控制: 精确的考试计时和倒计时功能
• 成绩统计: 自动评分和详细的分析报告

👥 用户管理

• 用户注册/登录: 安全的身份验证系统
• 个人中心: 个人信息管理和历史记录查看
• 权限控制: 分级权限管理系统

📊 题目管理

• 题库系统: 支持题目分类、标签和难度分级
• 题目编辑: 富文本编辑器支持复杂的题目描述
• 批量导入: 支持多种格式的题目批量导入

🎯 学习分析

• 成绩分析: 详细的个人和班级成绩统计分析
• 错题本: 自动收集和整理错题
• 学习建议: 基于答题情况的个性化学习推荐

🛠️ 技术栈

前端技术

• HTML5: 语义化标签和现代Web标准
• CSS3: Flexbox/Grid布局，CSS变量，动画效果
• JavaScript ES6+: 模块化开发，异步编程
• 响应式设计: 支持桌面端和移动端

开发规范

• BEM命名规范: 清晰的CSS类名结构
• ES6+语法: 使用现代JavaScript特性
• 可访问性: 遵循WCAG 2.1标准
• 性能优化: 代码分割、懒加载、资源优化

📁 项目结构

informatics-test-platform/
├── public/                 # 静态资源
│   ├── css/               # 样式文件
│   ├── js/                # 公共脚本
│   └── images/            # 图片资源
├── src/                   # 源代码
│   ├── components/        # 可复用组件
│   ├── js/               # JavaScript模块
│   ├── pages/            # 页面组件
│   ├── styles/           # 样式文件
│   └── utils/            # 工具函数
├── index.html            # 首页
├── login.html            # 登录页
├── register.html         # 注册页
├── dashboard.html        # 控制台
├── problems.html         # 题目列表
├── tests.html           # 考试页面
├── results.html         # 成绩页面
├── CLAUDE.md            # 开发规范
└── README.md            # 项目说明

🚦 快速开始

环境要求

• 现代浏览器（Chrome 60+, Firefox 60+, Safari 12+, Edge 79+）
• Node.js (可选，用于开发工具)

本地运行

1. 克隆项目：

   git clone https://github.com/caicaivic0322/WebCourse.git
   cd WebCourse

2. 使用本地服务器运行：

   # 使用 Python 内置服务器
   python -m http.server 8000
   
   # 或使用 Node.js http-server
   npx http-server -p 8000

3. 在浏览器中访问：http://localhost:8000

🎨 界面预览

首页

• 平台介绍和功能概览
• 用户登录/注册入口
• 最新题目和考试通知

控制台

• 个人学习数据统计
• 最近考试记录
• 推荐题目和学习计划

考试界面

• 清晰的题目展示
• 实时答题状态
• 导航和时间控制

🔧 开发指南

代码规范

请参考 CLAUDE.md 文件中的详细开发规范，包括：

• HTML5 语义化结构
• CSS3 BEM 命名规范
• JavaScript ES6+ 最佳实践
• 可访问性要求
• 性能优化建议

组件开发

1. 使用语义化HTML标签
2. 遵循BEM命名规范
3. 实现响应式设计
4. 确保键盘可访问性
5. 添加适当的ARIA标签

样式编写

/* 使用CSS变量定义主题色 */
:root {
    --primary-color: #007bff;
    --success-color: #28a745;
    --warning-color: #ffc107;
}

/* BEM规范示例 */
.user-card {}
.user-card__header {}
.user-card--active {}

📊 浏览器兼容性

浏览器	最低版本	状态
Chrome	60+	✅ 完全支持
Firefox	60+	✅ 完全支持
Safari	12+	✅ 完全支持
Edge	79+	✅ 完全支持

🤝 贡献指南

1. Fork 本项目
2. 创建特性分支：git checkout -b feature/AmazingFeature
3. 提交更改：git commit -m 'Add some AmazingFeature'
4. 推送到分支：git push origin feature/AmazingFeature
5. 提交Pull Request

📝 更新日志

v1.0.0 (2024-08-23)

• ✅ 初始版本发布
• ✅ 基础页面结构完成
• ✅ 用户认证系统
• ✅ 题目管理和考试功能
• ✅ 成绩统计和分析

📄 许可证

本项目采用 MIT 许可证 - 查看 LICENSE 文件了解详情。

🆘 技术支持

如果您遇到问题或有建议：

1. 查看 Issues
2. 提交新的Issue
3. 联系开发团队

🙏 致谢

感谢所有为这个项目做出贡献的开发者们！

---

⭐ 如果这个项目对您有帮助，请给我们一个Star！