Challenge Camp Finish To Win - Web3 Version
基于区块链的挑战营地系统,让每一次挑战都成为胜利的起点
Web3-FTW是一个基于以太坊区块链的挑战营地系统,通过智能合约实现去中心化的挑战管理。组织者可以创建挑战营地,参与者通过支付押金参与挑战,完成关卡后获得押金返还,未完成者押金将被罚没给组织者。
- 去中心化挑战管理: 基于智能合约的透明、不可篡改的挑战系统
- 押金激励机制: 通过押金机制激励参与者完成挑战
- 多关卡挑战: 支持多关卡配置,每关独立密码验证
- 实时状态同步: 链上链下数据实时同步,提供流畅的用户体验
- 权限分离设计: 组织者和参与者权限明确分离,确保公平性
┌─────────────────┐ ┌─────────────────┐ ┌─────────────────┐
│ 前端应用 │ │ 后端服务 │ │ 智能合约 │
│ (React) │ │ (Node.js) │ │ (Solidity) │
└─────────────────┘ └─────────────────┘ └─────────────────┘
│ • 用户界面 │ │ • API服务 │ │ • 营地管理 │
│ • 钱包连接 │ │ • 事件监听 │ │ • 押金管理 │
│ • 状态管理 │ │ • 数据缓存 │ │ • 密码验证 │
│ • 多语言支持 │ │ • 数据库同步 │ │ • 权限控制 │
└─────────────────┘ └─────────────────┘ └─────────────────┘
│ │ │
└───────────────────────┼───────────────────────┘
│
┌─────────────────┐
│ 数据库 │
│ (SQLite) │
└─────────────────┘
| 层级 | 技术 | 版本 | 说明 |
|---|---|---|---|
| 前端 | React | 18.0.0 | 用户界面框架 |
| 前端 | ethers.js | 5.7.0 | 区块链交互 |
| 前端 | SCSS | - | 样式预处理 |
| 后端 | Node.js | 14.0.0+ | 运行环境 |
| 后端 | Express.js | 4.18.0 | Web框架 |
| 后端 | SQLite3 | - | 数据库 |
| 区块链 | Solidity | 0.8.19 | 智能合约语言 |
| 区块链 | Hardhat | 2.17.0 | 开发框架 |
- Node.js >= 14.0.0
- npm >= 6.0.0
- Git
- 克隆项目
git clone https://github.com/your-username/web3-FTW.git
cd web3-FTW- 快捷部署
node setup-local-env.js
- 访问应用
- 连接钱包: 使用MetaMask等钱包连接应用
- 创建营地: 配置营地名称、时间、关卡数、参与者限制等
- 配置关卡: 设置各关卡截止时间和密码
- 管理营地: 监控参与者进度,处理押金分配
- 连接钱包: 使用MetaMask等钱包连接应用
- 浏览营地: 查看可参与的营地列表
- 报名参与: 支付押金报名参与营地
- 完成挑战: 按时完成各关卡挑战
- 提取押金: 完成所有关卡后提取押金
web3-FTW/
├── client/ # 前端应用
│ ├── src/
│ │ ├── components/ # React组件
│ │ ├── pages/ # 页面组件
│ │ ├── context/ # React上下文
│ │ ├── styles/ # 样式文件
│ │ └── utils/ # 工具函数
│ └── public/ # 静态资源
├── server/ # 后端服务
│ ├── models/ # 数据模型
│ ├── routes/ # API路由
│ ├── services/ # 业务服务
│ └── data/ # 数据库文件
├── contracts/ # 智能合约
│ ├── solidity/ # 合约源码
│ ├── test/ # 测试文件
│ └── scripts/ # 部署脚本
└── docs/ # 项目文档
- 钢琴键盘主题: 以钢琴键盘为设计元素,象征挑战的阶梯
- 价值观展示: 8个核心价值观的半透明展示
- 双入口设计: "发起"和"参加"两个主要操作入口
- 时间轴设计: 以钢琴键盘展示营地生命周期
- 状态可视化: 不同状态用不同颜色区分
- 操作按钮: 根据用户身份和营地状态显示相应操作
- 代理模式: 支持合约升级,保持数据不变
- 权限控制: 严格的权限验证机制
- 密码哈希: 原始密码不存储,只存储哈希值
- 重入攻击防护: 防止重入攻击的安全设计
- 输入验证: 全面的输入参数验证
- 地址验证: 以太坊地址格式验证
- 私钥保护: 私钥仅在内存中临时使用
- HTTPS传输: 所有数据传输使用HTTPS
- 营地状态: 报名、开营、闯关、结营等状态
- 参与者信息: 报名状态、完成进度、押金状态
- 关卡配置: 截止时间、密码哈希、完成统计
- 资金管理: 押金收取、退还、罚没记录
- 营地详情: 名称、描述、配置信息
- 事件日志: 所有智能合约事件记录
- 用户关系: 组织者和参与者的营地关系
- 缓存数据: 提升查询性能的缓存数据
- 代码分割: React.lazy实现组件懒加载
- 状态管理: 合理使用React状态和上下文
- 缓存策略: 本地缓存减少重复请求
- 数据库索引: 为常用查询字段创建索引
- 连接池: 数据库连接复用
- 事件队列: 异步处理事件同步
- 代理模式: 减少部署成本
- 批量操作: 减少交易次数
- Gas优化: 优化合约代码减少Gas消耗
本项目采用 MIT 许可证 - 查看 LICENSE 文件了解详情。
- Ethereum - 区块链平台
- Hardhat - 智能合约开发框架
- React - 前端框架
- Express.js - 后端框架
Web3-FTW - 让每一次挑战都成为胜利的起点 🏆
本项目为开源项目,欢迎社区贡献和反馈。如果您觉得这个项目有价值,请给我们一个 ⭐️