it235/multica-best-practices/multica-frontend-impl

Claude Code and agent skill by it235/multica-best-practices

Trust tier 2
  • community
LLM review pending
Source check pending

Checking that the SKILL.md file is still in the repository.

前端实现：读 JIRA/Confluence/架构/UI/API，注重交互与体验完成界面开发。用于 @FrontendDev 组件实现、状态与对接验证。

Install

npx vskill@latest install it235/multica-best-practices/multica-frontend-impl

SKILL.md

The same SKILL.md was published earlier as licanfu/multica-best-practices/multica-frontend-impl.

Frontend Implementation

Purpose

在已确认的设计与 Issue 范围内，把 UI / 交互 / 体验 落地为可用界面，并正确对接 API。

与 multica-artifact-frontend 分工：frontend-impl 管怎么读上游、怎么写组件与体验；artifact-frontend 管实现说明文档规范与 Confluence 落地。

Platform 协作

Platform skill本 skill 用途
multica-platform-jira读 Issue / AC
multica-platform-confluence读 PRD / 设计 / API 契约
multica-platform-figma读 UI 设计（Issue / Designer 链接）

发布 impl-spec 走 multica-artifact-frontend；本 skill 不重复 REST 细节。

开工前：读上游（必做）

顺序来源方式
1Issue / 验收标准multica-platform-jira → jira_cli.py get-issue <KEY>
2PRDJIRA → Confluence fetch_page.py
3架构设计Leader 派活或 JIRA 设计链接 → fetch_page.py
4UI 设计@Designer multica-design-ui-impl 链接
5API 契约@BackendDev multica-artifact-backend Confluence 链接
6现有前端代码局部阅读 / codegraph

契约或 UI 缺失 → mock 先行并记录 Mock 策略；接口语义不明 → BLOCKED，不发明 API。

体验优先流程（核心）

text
1. 读 AC- / UI / 架构「实现步骤（前端）」→ 列出页面与状态机
2. 写/更新 impl-spec.md（交 multica-artifact-frontend 发布，可选但推荐）
3. 按状态实现：默认态 → 加载 → 空态 → 异常 → 无权限
4. 交互：即时反馈、防重复提交、错误可理解文案
5. 对接 API：严格按契约；错误分支与重试 UX 写进 impl-spec
6. 组件/交互测试 + 手动走查关键路径
7. 贴可复跑验证证据

规则：

  • 交互与体验与功能同等优先级：不能只做 happy path。
  • 不改 API 契约；问题回 @BackendDev。
  • 响应式 / 无障碍按项目基线；至少覆盖主流程键盘可操作。
  • 不无关重构；判门由 Leader 复跑 multica-verification。

编码规则

  1. 先读 UI 与契约再写组件。
  2. 组件职责单一；复用设计系统。
  3. 后端未就绪用 mock，契约就绪后切换并删除临时 mock。
  4. 报告变更文件 + 命令 + 结果。

完成证据

  • 前端实现说明 Confluence 链接（若已发布）
  • 页面/组件代码 + 测试
  • Mock 说明（若用过）
  • 与 AC- / API-ID 追溯
  • 已知问题

挂载顺序（@FrontendDev）

text
multica-frontend-impl → multica-artifact-frontend

为什么有效

体验与状态完整度在前端最容易漏；impl-spec 挂 Confluence 需求树下，评审与测试可对照同一份说明。

Security

  • Security scanPassed, 100 of 100Pattern checks on the skill's files.
  • Model reviewNot runA model review is scheduled for the next rescan.

See the full security report

Quality evaluation

  • Task evaluationNot runNo evaluation yet. Run one in Skill Studio.

See evaluation results

Source

Popularity

Repository stars
195
Repository forks
29
7-day trend score
0

Stars and forks are for the whole GitHub repository, not this skill alone. Not refreshed yet.

Works with

Any agent vskill installs to: 56 targets in all. These 39 have a page on this site.

  • Claude Code
  • Cursor
  • GitHub Copilot
  • Windsurf
  • Codex
  • Gemini CLI
  • Cline
  • Amp
  • Roo Code
  • Goose
  • Continue
  • Kilo Code
  • Junie
  • Trae
  • OpenHands
  • Qwen Code
  • AI Agent
  • Tabnine Chat
  • Sourcegraph Cody
  • Amazon Q
  • Firebase Genkit
  • Sweep
  • Devin
  • Phind
  • Mentat
  • Claude Desktop
  • Aider
  • GPT Pilot
  • Plandex
  • bolt.new
  • v0
  • Replit Agent
  • Anse
  • TypingMind
  • BetterChatGPT
  • LibreChat
  • Warp AI
  • Pieces
  • Fig AI
Embed badge
vskill VERIFIED badge
[![vskill VERIFIED](https://verified-skill.com/api/v1/skills/it235/multica-best-practices/multica-frontend-impl/badge)](https://verified-skill.com/skills/it235/multica-best-practices/multica-frontend-impl)

Something wrong with this skill or its page? Tell us.