# 🚀 快速设置指南
这是一个简化版的设置指南，帮助你在 5 分钟内启动项目。详细文档请查看 [README-HACKATHON.md](README-HACKATHON.md)。
## ⚡ 5 分钟快速启动
### 第 1 步：创建 Supabase 项目 (2 分钟)
1. 访问 [https://supabase.com](https://supabase.com) 并登录
2. 点击 "New Project"
3. 填写项目信息并创建
4. 等待项目初始化完成
### 第 2 步：设置数据库 (1 分钟)
1. 在 Supabase Dashboard 中，点击左侧菜单的 **SQL Editor**
2. 点击 "+ New query"
3. 复制 `hackathon-setup.sql` 的全部内容
4. 粘贴并点击 "Run" 执行
5. 确认看到成功消息
### 第 3 步：配置项目 (1 分钟)
1. 在 Supabase Dashboard，点击左侧菜单的 **Settings** → **API**
2. 复制以下信息：
- Project URL（例如：`https://xxxxx.supabase.co`）
- `anon` `public` key
3. 创建配置文件：
```bash
cp hackathon-config.js hackathon-config.local.js
```
4. 编辑 `hackathon-config.local.js`，替换以下内容：
```javascript
SUPABASE: {
URL: 'https://xxxxx.supabase.co', // 粘贴你的 Project URL
ANON_KEY: 'eyJhbGc...', // 粘贴你的 anon key
},
```
### 第 4 步：启动项目 (1 分钟)
**选项 A：使用 Python**
```bash
python -m http.server 8000
```
**选项 B：使用 Node.js**
```bash
npx http-server -p 8000
```
**选项 C：使用 VS Code Live Server**
- 安装 "Live Server" 扩展
- 右键点击 `hackathon-2025.html`
- 选择 "Open with Live Server"
### 第 5 步：访问页面
- **公开展示页**：[http://localhost:8000/hackathon-2025.html](http://localhost:8000/hackathon-2025.html)
- **管理后台**：[http://localhost:8000/hackathon-admin.html](http://localhost:8000/hackathon-admin.html)
## 📝 首次使用
### 1. 登录管理后台
- 访问 `hackathon-admin.html`
- 使用任意邮箱和密码登录（演示模式）
- 注意：生产环境需要配置 Supabase Auth
### 2. 创建第一个 Challenge
1. 点击左侧菜单 "Challenges"
2. 点击 "+ 创建 Challenge"
3. 填写信息：
- 名称：`AI 驱动的个性化学习`
- 容量：`50`
- 最小队伍人数：`3`
- 最大队伍人数：`5`
4. 勾选 "立即发布到公开页"
5. 点击 "创建"
### 3. 导入示例数据（可选）
1. 点击左侧菜单 "数据导入"
2. 上传 `sample-data.csv` 文件
3. 预览数据
4. 点击 "确认导入"
### 4. 查看公开页
- 访问 `hackathon-2025.html`
- 应该能看到刚才创建的 Challenge 和导入的队伍
## ⚙️ 重要配置项
### 更新活动信息
编辑 `hackathon-config.local.js`：
```javascript
EVENT: {
NAME: 'Cambridge EduX Hackathon 2025',
DEADLINE: '2025-03-15T23:59:59', // 修改截止日期
},
LINKS: {
SUBMISSION: 'https://forms.gle/your-submission-form', // 提交表单
SCHEDULE: 'https://docs.google.com/your-schedule', // 日程链接
GROUP_CHAT: 'https://chat.whatsapp.com/your-group', // 交流群
}
```
### 更新页面可见性
在管理后台：
1. 点击左侧菜单 "设置"
2. 修改 "公开页面状态"：
- **公开访问**：所有人可访问
- **仅持链接可见**：只有知道链接的人可访问
- **需要访问口令**：需要输入密码才能访问
## 🔧 常见问题
### Q: 页面显示"加载失败"
**A:** 检查以下几点：
1. Supabase URL 和 Key 是否正确配置
2. 浏览器控制台是否有错误信息
3. 数据库表是否正确创建
**解决方法：**
```javascript
// 在浏览器控制台运行以下代码测试连接
const supabase = window.supabase.createClient(
'YOUR_URL',
'YOUR_KEY'
);
const { data, error } = await supabase.from('challenges').select('*');
console.log(data, error);
```
### Q: 无法创建 Challenge
**A:** 确保：
1. 所有必填字段已填写
2. 容量 > 0
3. 最小队伍人数 ≤ 最大队伍人数
### Q: CSV 导入失败
**A:** 检查 CSV 格式：
- 必需字段：`challenge_name`, `team_name`, `member_count`
- 编码：UTF-8
- 分隔符：逗号
- Challenge 名称必须与数据库中已有的 Challenge 完全匹配
### Q: 公开页不显示数据
**A:** 确保：
1. Challenge 的 `is_published` 为 `true`（勾选"立即发布"）
2. 检查浏览器控制台错误
3. 在管理后台 → Challenges → 确认状态为"已发布"
## 📊 添加 Supabase JS 库
如果页面无法加载数据，在 HTML 文件的 `` 标签中添加：
```html
```
在 `hackathon-2025.html` 的第 6 行后添加。
在 `hackathon-admin.html` 的第 6 行后添加。
## 🚀 部署到生产环境
### Netlify (推荐)
1. 访问 [https://app.netlify.com](https://app.netlify.com)
2. 拖拽整个项目文件夹到 Netlify
3. 等待部署完成
4. 获取域名（例如：`https://your-site.netlify.app`）
### Vercel
```bash
npm install -g vercel
vercel
```
### GitHub Pages
1. 推送代码到 GitHub
2. 在仓库设置中启用 Pages
3. 选择分支和目录
4. 访问 `https://yourusername.github.io/repo-name/hackathon-2025.html`
**⚠️ 重要：部署前确保**
- `hackathon-config.local.js` 已正确配置
- `.gitignore` 包含 `hackathon-config.local.js`
- 不要将敏感信息上传到公开仓库
## 📞 需要帮助？
- 📖 详细文档：[README-HACKATHON.md](README-HACKATHON.md)
- 📧 邮箱：support@cets.org
- 💬 微信群：扫描二维码加入
## ✅ 检查清单
在正式使用前，请确认：
- [ ] Supabase 项目已创建
- [ ] 数据库表已创建（运行 `hackathon-setup.sql`）
- [ ] `hackathon-config.local.js` 已配置
- [ ] Supabase URL 和 Key 已填写
- [ ] 可以访问公开展示页和管理后台
- [ ] 可以创建 Challenge
- [ ] 可以导入 CSV 数据
- [ ] 公开页可以正常显示数据
- [ ] 倒计时正常工作
- [ ] 外部链接已更新
- [ ] `.gitignore` 包含敏感文件
## 🎉 完成！
现在你的 Cambridge EduX Hackathon 2025 管理平台已经准备就绪！
**下一步：**
1. 创建所有 Challenge
2. 配置外部表单链接
3. 设置 Google Sheet 同步（可选）
4. 邀请管理员测试
5. 11/21 公布时切换为公开访问
祝活动圆满成功！🎊