For AI agents: fetch the complete documentation index at /llms.txt, the full documentation corpus at /llms-full.txt, the agent skill at /skill.md, or this page as Markdown at /zh/docs/mobile/first-feature.md (or send Accept: text/markdown).
构建你的第一个功能
从新建界面到服务器校验数据的端到端演练。
初学者演练
先决条件：阅读下面两篇入门指南，完成 Mobile 本地安装，并在编辑器中以根目录打开此存储库。Mobile 设置放在 apps/mobile/.env.local；Expo 不读取根目录的 .env。预览需要一个可访问的后端才能获取真实数据。
简而言之：工作区是一个团队的单独用户、数据和设置。服务器是可信后端；让提供商密钥远离浏览器和电话代码。迁移是创建或更新表的版本化数据库更改。人工智能模型是回答的引擎；型号目录是服务器上可用型号 ID 和价格的列表。提供商是一种外部服务，例如人工智能、电子邮件或计费服务。权利是允许工作区使用某项功能的授权。 Webhook 是一个服务发送到另一个服务的 URL 的消息。
1. 打开 .agents/skills/add-a-mobile-screen/SKILL.md——或让您的编码代理照它执行——并创建一个小界面，例如 apps/mobile/app/(app)/ideas.tsx，其逻辑放在 apps/mobile/src/ideas/。
2. 通过正在运行的预览在您的设备上打开新界面，确认它能为已登录成员正常渲染。
3. 检查未登录账户和第二个工作区账户——必须保密的内容应返回拒绝或为空，因为边界由服务器强制。
对自定义代码，写明界面名称、它显示的数据、谁可以看以及要处理的错误。把任务交给您的编码代理，并要求它先读 AGENTS.md、.ai/PROJECT_CONTEXT.md 以及将触碰文件的 .ai/ 镜像文档；在编辑前列出文件和检查项；并向您展示 diff。使用示例值；切勿粘贴真实密钥。
创建界面
在 apps/mobile/app/(app)/ 下添加一个路由文件——Expo Router 会把该文件变成已登录界面栈中的一个界面。用 apps/mobile/src/ui 的原语（Screen、Card、Title、Detail、AppButton）来组合它，使其继承应用的间距、字体和颜色。
apps/mobile/app/(app)/ideas.tsx
apps/mobile/src/ideas/index.ts
apps/mobile/src/ideas/index.test.ts通过类型化客户端读写
通过 apps/mobile/src/api/client.ts 获取数据，它会为每个针对 EXPO_PUBLIC_API_URL 的请求附带已存储的会话，并返回类型化错误。保持与 Web 契约一致的载荷——同一组端点同时服务两个客户端。
如果界面要读取工作区数据，请用 apps/mobile/src/offline/ 中的辅助函数包装该调用，使网络故障能回退到缓存副本——仅限网络错误，绝不在认证或权限错误后回退。
验证访问和恢复
检查已登录成员、另一工作区的成员、未登录会话和飞行模式：成员数据正常显示，外部数据被拒绝，未登录设备回到登录页，离线副本只在网络错误时提供。
完善各种状态
通过共享原语为界面补上加载、空态和错误状态，把每个新字符串加入全部四个 i18n 目录，并把路由接入首页或设置导航，让成员真正能找到它。