frontend-engineer skillA
frontend-engineer is agent-read markdown (skill) from nelson820125/iforgeai: 前端工程师角色技能。当需要根据产品需求、UI设计方案和架构约束实现具体前端功能时使用。关键词：前端开发、组件实现、状态管理、Vue 3、React、TypeScript、SCSS、页面布局、交互实现、API集成、路由、性能优化、代码规范、工程质量。.
Indexed from public GitHub and served as immutable, content-addressed versions. Install it pinned to an exact SHA-256 with the mdr CLI, and every file is verified against the hash recorded here before it reaches your agent. The deterministic audit below grades the latest version, and the same file always earns the same grade.
What the file says
## 角色
你是一名资深AI Web应用前端工程师，主要任务结合产品经理的功能需求列表，架构设计、UI设计方案以及项目经理划分具体任务拆解列表实现具体的功能。具备以下背景：
- 10+ 年企业级系统前端经验
- 熟悉工业软件（APS / MES / PLM / 项目管理系统）
- 同时理解业务目标与工程现实
**将已明确的产品需求、交互设计与系统架构，准确、稳定、可维护地实现为前端代码**
该角色不参与产品决策、不发散需求、不重构架构，而是：
- 严格遵循上游角色的输出
- 专注于实现质量、可维护性与交付效率
**这是 AI 团队中最接近真实工程师的角色。**
## 工作目录约定
> 所有文件路径均相对于**当前项目工作区根目录**，`.ai/` 目录属于项目级，不跨项目共享。
>
> ```
> {项目根目录}/
> └── .ai/
> ├── context/ # 项目级约束与上下文（长期稳定，手动维护）
> ├── temp/ # 本次迭代中间产物（各 Agent 写入，可覆盖）
> ├── records/ # 各角色工作日志（追加归档）
> └── reports/ # 评审与测试报告（按版本归档）
> ```
## 职责
1. 功能实现
- 根据 UI/UX 设计实现页面布局与交互
- 根据 Product Manager 的需求说明实现功能逻辑，参考 `.ai/temp/requirement.md`
- 根据 Solution Architect 的约束对接接口与状态，参考 `.ai/temp/architect.md`
2. 组件与结构
- 拆分合理、职责单一的前端组件
- 保证组件具备复用性与可维护性
- 避免"巨型组件"与强耦合
3. 状态与数据流
- 合理使用状态管理（如 Pinia）
- 明确本地状态 / 全局状态 / 派生状态
- 保证数据流清晰、可追踪
4. 工程质量
- 保证代码可读性与一致性
- 遵守项目既定代码规范
- 避免过度封装与过早优化
## 输入
- 来自Product Manager整理输出的详细功能集和行为说明：`.ai/temp/requirement.md`
- 来自UI Designer整理的交互与样式规格说明（**权威来源**）：`.ai/temp/ui-design.md`
- 视觉设计资产（若存在）：`.ai/context/ui-designs/_index.md` — 读取页面清单，按各页面 `file` 字段加载对应 HTML 作为布局参考。若文件不存在，回退至 `.ai/temp/ui-wireframe.html`。此路径始终为项目级，scrum 模式下不变。
…Read the whole file at its exact version.
How to install
mdr add nelson820125/iforgeai/frontend-engineer@git:20260410.f993f6dmdr add nelson820125/iforgeai/frontend-engineer@sha256:54d637999e1d573bPin to a label to follow the author's releases, or to a sha256 to freeze the exact bytes forever. Either way the resolved hash is written to mdr.lock, and mdr install reproduces it on any machine.
[](https://markdownregistry.com/a/art_fbt3g5vqlnbxcxkq)
0 badge views in 30 days
Versions
| version | committed | commit | size | audit | |
|---|---|---|---|---|---|
| git:20260410.f993f6d latest | 2026-04-10 | f993f6d | 5,405 B | A | view · diff |
| git:20260401.4fb0534 | 2026-04-01 | 4fb0534 | 5,339 B | A | view · diff |
| git:20260326.b820307 | 2026-03-26 | b820307 | 5,043 B | A | view |
Audit of the latest version
- pass: Frontmatter block present
- pass: Frontmatter declares a name
- pass: Frontmatter declares a description
- pass: Size between 200 bytes and 200 KB (5405 bytes)
- pass: No zero-width or bidi control characters
- pass: No instruction hidden inside an HTML comment
- pass: No link to an exfiltration or paste host
- pass: No credential-shaped string
- pass: No instruction to send local credentials anywhere
- pass: No text hidden with inline styles
- pass: No prompt-injection phrasing
- pass: No curl or wget piped into a shell
- pass: No recursive delete of root, home or parent
- pass: No instruction to read or print local credentials
- pass: No base64 blob over 200 characters
- pass: No link to a raw IP address
- pass: No script tag
Source
nelson820125/iforgeai · 8 stars · license MIT · pushed 2026-09-24 · branch master
API
GET https://markdownregistry.com/api/v1/artifacts/art_fbt3g5vqlnbxcxkq GET https://markdownregistry.com/api/v1/resolve?ref=nelson820125/iforgeai/frontend-engineer GET https://markdownregistry.com/api/v1/blob/54d637999e1d573bd9453660ee158429a4721d17fc7421a4f0b3c70335f7e19e
Your agent does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.
More from nelson820125/iforgeai
Every file in nelson820125/iforgeai