让校园组队变得简单、安全、有趣!
cocanvas校园拼图是一个专为大学生打造的校园组队小程序,旨在解决大学生在校园生活中组队难、信息不对称、沟通效率低等问题。通过智能匹配、实时沟通、安全认证等功能,帮助学生快速找到志同道合的伙伴,组建学习小组、科研团队、竞赛队伍等,提升校园社交效率和学习协作质量。
- 降低组队门槛 - 简化组队流程,让组队变得更容易
- 提高匹配效率 - 智能推荐算法,精准匹配志同道合的伙伴
- 保障信息安全 - 实名认证,安全可靠的校园环境
- 促进学习协作 - 营造良好的学习氛围,提升协作效率
┌─────────────────────────────────────────────────────────────┐
│ 微信小程序前端 │
├─────────────────────────────────────────────────────────────┤
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │
│ │ 用户模块 │ │ 组队模块 │ │ 搜索模块 │ │
│ └─────────────┘ └─────────────┘ └─────────────┘ │
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │
│ │ 聊天模块 │ │ 个人中心 │ │ 分享模块 │ │
│ └─────────────┘ └─────────────┘ └─────────────┘ │
└─────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────┐
│ 微信云开发后端 │
├─────────────────────────────────────────────────────────────┤
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │
│ │ 云函数层 │ │ 云数据库 │ │ 云存储层 │ │
│ │ │ │ │ │ │ │
│ │ • login │ │ • users │ │ • 图片存储 │ │
│ │ • createTeam│ │ • teams │ │ • 文件存储 │ │
│ │ • getTeamList│ │ • applications│ │ • 头像存储 │ │
│ │ • search │ │ • chat_sessions│ │ │ │
│ │ • chat │ │ • messages │ │ │ │
│ └─────────────┘ └─────────────┘ └─────────────┘ │
└─────────────────────────────────────────────────────────────┘
- 前端框架: 微信小程序原生框架
- 后端服务: 微信云开发(云函数 + 云数据库 + 云存储)
- 数据存储: MongoDB(云数据库)
- 实时通信: 云数据库监听 + 云函数触发器
- 文件存储: 云存储
- 安全认证: 微信授权 + 手机验证码
功能描述: 用户注册、登录、资料管理、个人主页展示
主要功能:
- 📝 手机验证码登录 - 安全便捷的登录方式
- 👤 个人资料管理 - 完善个人信息、技能标签、兴趣爱好
- 🎯 个人主页 - 展示个人动态、参与组队、技能展示
- 📤 分享功能 - 分享个人主页到微信、朋友圈
- 🔒 隐私设置 - 控制信息可见性,保护个人隐私
技术实现:
- 云函数:
login- 处理用户登录逻辑 - 数据库:
users集合存储用户信息 - 前端: 表单验证、数据绑定、状态管理
功能描述: 组队创建、浏览、申请、管理
主要功能:
- 🔍 组队列表 - 浏览所有组队,支持类型筛选、状态筛选
- ➕ 创建组队 - 发布新组队,自定义类型、要求、截止时间
- 📋 组队详情 - 查看组队详细信息、成员列表、申请状态
- 👥 我的组队 - 管理创建和参与的组队
- 📝 申请加入 - 申请加入感兴趣的组队,支持申请理由
- 🔄 状态管理 - 组队状态流转(招募中、已满员、已结束)
技术实现:
- 云函数:
createTeam,getTeamList,getTeamDetail,applyTeam - 数据库:
teams,applications集合 - 前端: 列表渲染、表单处理、状态同步
功能描述: 智能搜索、推荐算法、搜索历史
主要功能:
- 🔎 智能搜索 - 支持用户和组队搜索,模糊匹配
- 📊 搜索历史 - 记录用户搜索历史,快速重复搜索
- 🔥 热门搜索 - 展示热门搜索关键词,发现热门内容
- 💡 搜索建议 - 智能搜索推荐,提升搜索体验
- 🏷️ 标签搜索 - 支持技能标签、兴趣标签搜索
技术实现:
- 云函数:
search- 处理搜索逻辑,支持多字段模糊匹配 - 数据库: 索引优化,提升搜索性能
- 前端: 搜索输入、结果展示、历史管理
功能描述: 实时沟通、消息管理、文件传输
主要功能:
- 💬 1对1聊天 - 实时沟通交流,支持文字、表情
- 📱 联系方式 - 请求查看联系方式,保护隐私
- 📄 查看资料 - 查看对方详细资料,了解背景
- 📊 竞争分析 - PK情况展示,了解竞争关系
- 📎 文件发送 - 支持图片、文件发送,丰富沟通方式
- 🔔 消息通知 - 新消息提醒,不错过重要信息
技术实现:
- 云函数:
getChatSessions,getMessages,sendMessage - 数据库:
chat_sessions,messages集合 - 前端: 消息列表、聊天界面、文件上传
- 简约现代 - 采用扁平化设计,界面简洁清晰
- 用户友好 - 注重用户体验,操作流程简单直观
- 专业可信 - 借鉴LinkedIn等专业平台的设计理念
- 校园风格 - 符合大学生审美,充满青春活力
/* 主色调 */
--primary-color: #2196F3; /* 蓝色 - 专业可信 */
--secondary-color: #4CAF50; /* 绿色 - 成功状态 */
--accent-color: #FF9800; /* 橙色 - 警告提醒 */
/* 辅助色 */
--background-color: #f5f5f5; /* 浅灰 - 页面背景 */
--text-primary: #333333; /* 深灰 - 主要文字 */
--text-secondary: #666666; /* 中灰 - 次要文字 */
--border-color: #e0e0e0; /* 浅灰 - 边框分割 */- 设计特点: 简洁大方,突出品牌形象
- 主要元素: Logo、手机号输入、验证码、登录按钮
- 交互设计: 一键获取验证码,自动填充手机号
- 设计特点: 信息层次清晰,操作便捷
- 主要元素: 头像、基本信息、技能标签、操作按钮
- 交互设计: 点击编辑,滑动查看更多
- 设计特点: 卡片式布局,信息丰富
- 主要元素: 组队标题、类型标签、成员数量、截止时间
- 交互设计: 下拉刷新,上拉加载,筛选功能
- 设计特点: 信息完整,操作明确
- 主要元素: 详细描述、成员列表、申请按钮、分享功能
- 交互设计: 滚动查看,一键申请,状态反馈
- 设计特点: 搜索体验流畅,结果展示清晰
- 主要元素: 搜索框、类型切换、历史记录、热门搜索
- 交互设计: 实时搜索,结果高亮,快速筛选
- 设计特点: 对话式布局,消息清晰
- 主要元素: 消息气泡、时间戳、状态指示、输入框
- 交互设计: 长按操作,滑动删除,语音输入
- 微信开发者工具(最新版本)
- 微信小程序账号(已认证)
- 云开发环境(免费版即可)
git clone https://github.com/your-username/cocanvas.git
cd cocanvas- 打开微信开发者工具
- 选择"导入项目"
- 选择项目文件夹
- 填写AppID(必须使用真实AppID)
详细步骤请查看:CLOUD_SETUP.md
简要步骤:
- 在微信开发者工具中点击"云开发"
- 开通云开发环境
- 创建数据库集合:
users- 用户信息teams- 组队信息applications- 申请记录chat_sessions- 聊天会话messages- 消息记录
- 上传云函数(右键云函数目录 → 上传并部署)
- 修改
miniprogram/app.js中的环境ID
- 点击"编译"按钮
- 在模拟器中查看效果
- 真机调试测试完整功能
- 框架: 微信小程序原生框架
- 语言: JavaScript ES6+、WXML、WXSS
- 状态管理: 小程序原生状态管理
- 组件化: 自定义组件开发
- 样式: WXSS + CSS3
- 云函数: Node.js + 微信云开发SDK
- 数据库: MongoDB(云数据库)
- 存储: 云存储
- 安全: 微信授权 + 云函数权限控制
- IDE: 微信开发者工具
- 版本控制: Git
- 调试: 微信开发者工具调试器
- 部署: 微信云开发控制台
cocanvas/
├── miniprogram/ # 小程序前端
│ ├── pages/ # 页面文件
│ │ ├── login/ # 登录页面
│ │ ├── profile/ # 个人中心
│ │ ├── user-profile/ # 用户主页
│ │ ├── team/ # 组队相关页面
│ │ ├── search/ # 搜索页面
│ │ ├── search-recommend/ # 智能推荐
│ │ └── chat/ # 聊天页面
│ ├── config/ # 配置文件
│ ├── utils/ # 工具函数
│ ├── services/ # API服务
│ ├── constants/ # 常量定义
│ ├── app.js # 应用入口
│ ├── app.json # 应用配置
│ └── sitemap.json # 站点地图
├── cloudfunctions/ # 云函数
│ ├── login/ # 用户登录
│ ├── createTeam/ # 创建组队
│ ├── getTeamList/ # 获取组队列表
│ ├── getTeamDetail/ # 获取组队详情
│ ├── applyTeam/ # 申请加入组队
│ ├── search/ # 搜索功能
│ ├── getChatSessions/ # 获取聊天会话
│ ├── getMessages/ # 获取消息
│ └── sendMessage/ # 发送消息
├── project.config.json # 项目配置
└── README.md # 项目文档
user_config.js- 用户字段配置、验证规则team_config.js- 组队类型配置、状态管理chat_config.js- 聊天配置、消息类型search_recommend_config.js- 搜索推荐算法配置
// 用户相关
login(phone, code) // 用户登录
getUserInfo(userId) // 获取用户信息
updateUserInfo(userId, data) // 更新用户信息
// 组队相关
createTeam(teamData) // 创建组队
getTeamList(filters) // 获取组队列表
getTeamDetail(teamId) // 获取组队详情
applyTeam(teamId, reason) // 申请加入组队
// 搜索相关
search(keyword, type) // 搜索功能
getSearchHistory() // 获取搜索历史
getHotSearches() // 获取热门搜索
// 聊天相关
getChatSessions() // 获取聊天会话
getMessages(sessionId) // 获取消息列表
sendMessage(sessionId, content) // 发送消息- 命名规范: 驼峰命名法,语义化命名
- 注释规范: 关键函数必须添加注释
- 代码风格: 统一使用ES6+语法,单引号
- 文件组织: 按功能模块组织文件结构
feat: 新功能
fix: 修复bug
docs: 文档更新
style: 代码格式调整
refactor: 代码重构
test: 测试相关
chore: 构建/工具相关
- 使用Git进行版本控制
- 主分支为
main - 功能开发使用特性分支
- 提交前必须通过代码审查
- 用户登录/注册系统
- 组队创建/浏览功能
- 智能搜索功能
- 基础聊天功能
- 个人主页展示
- 资料编辑功能
- 分享功能
- 云开发集成
- 数据库设计
- API接口开发
- 真实短信验证码集成
- 实时消息推送
- 图片上传功能
- 消息已读状态
- 组队审核流程
- 用户评价系统
- 成就徽章系统
- 数据统计分析
- AI推荐算法优化
- 消息推送通知
- 多语言支持
- 离线缓存功能
- CLOUD_SETUP.md - 云开发接入指南(必读)
- DATABASE_DESIGN.md - 数据库设计文档
- DEVELOPMENT.md - 开发规范文档
欢迎提交Issue和Pull Request!
- Fork项目
- 创建特性分支
- 提交代码
- 发起Pull Request
- 遵循项目代码规范
- 添加必要的测试
- 更新相关文档
- 确保代码质量
MIT License
cocanvas开发团队
如有问题或建议,欢迎联系我们!
让校园组队变得更简单! 🎓✨