Demo 作品帖
【标签】 社会服务 / 社会公益
【标题】 社会服务 + 守望AI全龄社区关怀平台
【正文】
一、Demo 简介
是什么：守望是一套 AI 驱动的社区风险感知与关怀服务平台，包含 Web 管理端与移动端双形态，覆盖健康、食安、灾害、心理、公益五大风险场景。
面向谁：社区居民（独居老人、留守儿童家庭、普通住户）及社区管理工作者。
主要功能：
- 社区风险指数仪表盘：聚合健康、食安、灾害、心理、公益五维度数据，实时计算社区整体风险评分，支持省/市/区三级切换，一眼掌握社区安全态势。
- AI 智能症状初筛：内置症状知识库与疾病匹配引擎，用户输入症状后 AI 自动分析可能的疾病方向、紧急程度，并给出就医科室建议与日常护理方案。
- 食品安全配料识别：拍照或手动输入食品配料表，AI 自动识别添加剂风险等级，标注争议成分，给出适合人群与摄入量建议。
二、Demo 创作思路
灵感来源：身边真实发生的事——小区里独居老人半夜突发疾病无人知晓、留守儿童放学后走失、老人买保健品被虚假宣传误导……这些事让我意识到，社区层面缺少一套"早发现、早预警、早响应"的风险感知系统。如果有一个平台能把健康监测、食安提醒、灾害预警、心理陪伴、公益互助打通，很多悲剧也许可以避免。
想解决的问题：
- 老人身体不舒服时拿不准要不要去医院，怕麻烦子女又怕耽误病情；
- 超市买东西看不懂配料表，不知道哪些添加剂有争议、不适合老人孩子；
- 极端天气、地质灾害来临时，社区缺少精准到人的预警触达；
- 独居老人、留守儿童的心理状态长期被忽视；
- 想做公益不知道找谁、去哪里做，求助者也不知道怎么找资源。
为什么做这个方向：市面上单点工具很多（在线问诊、天气APP、公益平台），但缺少一个以"社区"为单位、以"风险感知"为核心的整合型产品。我们判断：未来社区治理一定会从"事后响应"转向"事前预防"，而 AI 是实现低成本、广覆盖风险感知的关键技术。选这个方向，既能发挥 AI 的价值，又有真实的社会意义。
三、Demo 体验地址
Web 端体验链接
（推荐手机浏览器打开，效果最佳）
https://ccac639.github.io/community-care-platform/
底部导航栏可切换六大模块：首页 / 健康 / 生活 / 社会 / 心理 / 响应，每个模块都有完整的 AI 交互功能。
小程序端体验方式
（微信小程序）
本项目同时支持微信小程序端，使用 Taro 3.6.30 框架开发，实现了与 Web 端一致的五大风险场景功能。
体验方式：
- 克隆项目代码：
git clone https://github.com/ccac639/community-care-platform.git - 进入项目目录：
cd community-care-platform - 进入小程序目录：
cd miniapp - 安装依赖：
npm install - 构建微信小程序：
npm run dev:weapp - 使用微信开发者工具打开
community-care-platform/miniapp/dist目录即可预览
四、TRAE 实践过程
4.1 项目初始化与架构设计
开发第一天，我用 TRAE 从零搭建项目。只描述了"我要做一个社区风险关怀平台，要有健康、食安、灾害、心理、公益五个模块"，TRAE 就自动生成了完整的项目架构——包括 Vite + React + TypeScript 技术栈选型、Tailwind CSS 配置、路由结构、页面骨架，甚至连 mock 数据都帮我写好了。
第一步：描述需求 → TRAE 生成项目骨架
最初我只有一个模糊的想法，TRAE 帮我把想法拆解成了具体的技术方案：
- 技术栈：Vite + React 19 + TypeScript + Tailwind CSS
- 状态管理：Zustand
- 路由：React Router
- 架构：单页应用 + 底部 Tab 导航 + 多页面切换
4.2 AI 风险引擎核心模块开发
五大模块的 AI 风险分析引擎是项目的核心，也是开发量最大的部分。我完全通过和 TRAE 对话来写代码。
开发流程：
- 我用自然语言描述需求：“写一个健康风险分析函数，输入症状关键词，输出可能的疾病列表、风险等级、就医建议”
- TRAE 先生成类型定义（症状、疾病、风险等级的 TypeScript interface）
- 再生成匹配算法（关键词匹配 + 权重计算 + 紧急度判断）
- 最后生成 UI 组件和交互逻辑
整个过程我不需要写一行代码，只需要不断提需求、调参数。比如：
- “把紧急度判断逻辑再细化一下，胸痛、呼吸困难要直接标高危”
- “增加孕妇和老人的特殊人群提示”
- “这个页面加个加载动画”
TRAE 每次都能精准理解我的意图，给出可直接运行的代码。
4.3 多端适配与部署上线
项目有 Web 端和小程序端（Taro）两套代码。部署到 GitHub Pages 时遇到不少问题——子路径路由 404、hash 模式 basename 重复、Vite 8 Node 版本不兼容等。每次遇到报错，我把错误日志贴给 TRAE，它几秒钟就能定位问题并给出修复方案。
比如一次典型的排错过程：
- 我：“页面白屏，控制台报 tabBar 配置错误”
- TRAE：分析 → Taro 原生 tabBar 最多支持 5 个，项目配了 6 个 → 建议用自定义 TabBar 组件
- 我：“行，帮我写一个”
- TRAE：直接生成组件代码 + 6个页面的集成代码 + 样式文件
- 我：“第3个页面报错了，JSX 结构有问题”
- TRAE：定位到多余的闭合标签 → 给出修复代码
从发现问题到完全修复，全程不到 5 分钟。
关键任务对话 Session ID
- 最初的版本uid:3946575999804776:989a3292377866ef0088ae00c49bb874_6a439529379318ab16b5e6c6.6a43952a379318ab16b5e6c9.6a439529379318ab16b5e6c7:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/6/30 18:06:34)
- 地图api:3946575999804776:b4df61f6c090c4a2b758e746351ebb49_6a439529379318ab16b5e6c6.6a43bc53379318ab16b5e958.6a43bc53379318ab16b5e956:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/6/30 20:53:39)
- svg人体骨骼:3946575999804776:bf13483ea15ef6fe4652409b53b6797a_6a439529379318ab16b5e6c6.6a43c6e1d523cf9acb9b7223.6a43c6e1d523cf9acb9b7221:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/6/30 21:38:41)
- 完善地图导航:3946575999804776:21d5d5d5ad61e50e552e89bf828ed8b5_6a439529379318ab16b5e6c6.6a44c69c93a568a0f3dec39e.6a44c69c93a568a0f3dec39c:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/1 15:49:48) bug修复1：3946575999804776:71200e3b71a22802671c405721cce649_6a439529379318ab16b5e6c6.6a44c8ad93a568a0f3dec470.6a44c8ac93a568a0f3dec46e:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/1 15:58:37)
- bug修复2：3946575999804776:235d97f425ff9d10c62bfc781d03c916_6a439529379318ab16b5e6c6.6a44d43f93a568a0f3decde2.6a44d43f93a568a0f3decde0:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/1 16:47:59)
- bug修复3：3946575999804776:964d969e80b39093e0d9a7930dbab336_6a439529379318ab16b5e6c6.6a44e2c893a568a0f3ded6c4.6a44e2c893a568a0f3ded6c2:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/1 17:50:00)
- 修改首页架构：3946575999804776:cbd504d82bf980253441f6ab55a166ec_6a439529379318ab16b5e6c6.6a4631ee8052bb55208f5445.6a4631ee8052bb55208f5443:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/2 17:39:58)
- ai统一调用:3946575999804776:aeaaaf26c1f194669c93d92875c58766_6a439529379318ab16b5e6c6.6a464b288052bb55208f5aee.6a464b288052bb55208f5aec:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/2 19:27:36)
- 修改ai聊天:3946575999804776:47df01bbbf42db5bdda2a91a11cc7ec3_6a439529379318ab16b5e6c6.6a4657c88052bb55208f5bba.6a4657c88052bb55208f5bb8:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/2 20:21:28)
修改公益模块:3946575999804776:f4ae9cdd58db048b77b1822bfac714d3_6a439529379318ab16b5e6c6.6a4675bf8052bb55208f5d5d.6a4675bf8052bb55208f5d5b:TRAE Work CN.0.1.29.no_sid.no_ppe.T(2026/7/2 22:29:19)
五、开发心得
- TRAE 最适合"从想法到产品"：如果你有一个想法但不确定怎么落地，TRAE 能帮你快速把想法变成可运行的产品原型，技术选型、架构设计、代码实现一条龙。
- 描述越清晰，产出越精准：跟 TRAE 对话时，需求描述得越具体（用户是谁、场景是什么、期望什么效果），它生成的代码质量越高，改的次数越少。
- 遇到 Bug 直接贴日志：不用自己费劲排查，把错误信息丢给 TRAE，它通常能秒级定位原因并给出修复方案，比自己查 Stack Overflow 快太多。
- AI 写业务逻辑，人做产品判断：代码可以让 AI 写，但"做什么功能、为什么做、做成什么样"这些产品决策还是要自己拿主意。TRAE 是超强的执行助手，最终的产品品味还是要看人。
- 迭代速度是关键：有了 TRAE，一天可以迭代好几个版本，想到什么马上就能实现出来，这种快速试错的感觉特别爽。