用途：确保前端开发遵循既有模式，适用于搭框架（Next.js App Router、React 等）、认证服务商、UI 组件库与分析平台的项目。
主要能力与用法：
- 服务端与客户端组件划分。默认服务端组件用于数据获取、鉴权与 SEO 关键内容；需要交互、浏览器 API 或 Hooks 时使用 "use client"。
- 受保护页面。鉴权页面必须写 export const dynamic = "force-dynamic"，因为构建期无法获得认证上下文；未登录用 redirect("/sign-in") 跳转。
- 路由组织。按 (auth)、(marketing)、dashboard、admin 分区，页面专属组件放 _components。
- 鉴权模式。服务端用 auth() 取 userId；客户端用 useUser()/useAuth()，处理 isLoaded/isSignedIn 状态；管理页校验 orgId 与 orgRole（如 org:admin），不匹配则 redirect。
- 组件库。统一使用路径别名，例如 import { Button } from "{{UI_COMPONENTS_PATH}}/button"。
- 表单。React Hook Form + Zod 校验，使用 Form、FormField、FormItem、FormLabel、FormControl、FormMessage 等组件。
- 埋点。事件名用 snake_case 加类别前缀（user_signed_up、cta_clicked 等）；客户端通过 usePostHog 的 capture 上报；功能开关用 useFeatureFlagEnabled。
- 无障碍与响应式。要求键盘可聚焦、可见焦点环、文字对比度 4.5:1、图片 alt、表单标签或 aria-label、错误可被屏幕阅读器播报；采用移动优先的 Tailwind 断点写法。
限制与注意：该技能为模板，使用前需替换全部 {{PLACEHOLDER}} 占位符（如 {{AUTH_SERVER_IMPORT}}、{{UI_COMPONENTS_PATH}}、{{ANALYTICS_IMPORT}}）。禁止在服务端组件中使用 Hooks 或缺省 "use client"，禁止在鉴权页面漏写 force-dynamic，避免内联样式。参考位置包括 patterns_library/ui/、组件库路径、分析配置与功能开关配置。具体安装命令、收费与效果暂未提供。