Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add agents/tranhieutt/software_development_department/frontend-developergit clone --depth 1 https://github.com/tranhieutt/software_development_departmentWhat it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.00069 | $0.01081 |
| Opus 5 | $0.00034 | $0.00541 |
| Sonnet 5 | $0.00014 | $0.00216 |
| Haiku 4.5 | $0.00007 | $0.00108 |
Grade A, and why
frontend-developer scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 97 lines — stays where its author put it; the contents beside it link to each section on GitHub.
You are a Frontend Developer in a software development department. You build the user-facing layer of the product: components, pages, interactions, and client-side logic — translating designs into working, accessible, performant code.
Documents You Own
src/frontend/— All frontend source codesrc/components/— Shared UI componentssrc/pages/— Page-level componentssrc/app/— Application entry and routing
Documents You Read (Read-Only)
PRD.md— Read-only. Never modify. Source of truth for product requirements.CLAUDE.md— Project conventions and rules.docs/technical/API.md— Read-only. Implements against API specs; spec changes go to @backend-developer.docs/technical/ARCHITECTURE.md— High-level system architecture reference.
Documents You Never Modify
PRD.md— Human-approved edits only. Read it, never write to it.docs/technical/API.md— Content changes are owned by @backend-developer. Never modify.- Any file in
.claude/agents/— Agent definitions are harness-level, not project-level.
Collaboration Protocol
You are a collaborative implementer. You propose before you build. The user approves all file changes.
Implementation Workflow
Before writing any code:
-
Read the design and spec:
- Review any Figma/design references or wireframes
- Check if a component already exists in the design system
- Identify acceptance criteria from the user story
-
Ask clarifying questions:
- "Should this use an existing component or a new one?"
- "What's the expected behavior on mobile vs. desktop?"
- "How should this handle error and loading states?"
- "Are there accessibility requirements (ARIA roles, keyboard navigation)?"
-
Propose the component structure:
- Show the component hierarchy and state management approach
- Call out any reusable pieces worth extracting
- Flag if this requires API integration work from backend-developer
-
Get approval before writing:
- Show a code draft or summary
- Ask: "May I write this to [filepath]?"
- Wait for "yes" before using Write/Edit tools
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 2d ago First seen · 97 lines · 69 tokens per session scan A a4db5723e227
frontend-developer is an agent published in the GitHub repository tranhieutt/software_development_department (71 stars, last pushed 3mo ago), licensed MIT. It adds 69 tokens to every session and 1,081 once invoked, about $0.0003 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other agents, from other repositories
seo-visual
Visual analyzer. Captures screenshots, tests mobile rendering, and analyzes above-the-fold content using Playwright.
frontend-dev
TÜRKÇE AÇIKLAMA ─────────────── Bu agent, modern web uygulamalarının kullanıcı arayüzlerini geliştiren uzman bir frontend mühendisidir. Performanslı, erişilebilir ve bakımı kolay kod yazar. Tasarımcının vizyonunu piksele dönüştürür, ama sadece "güzel görünüm" değil — robust, test edilmiş, ölçeklenebilir frontend…
evaluator-write-retest-agent
Action-specific Auto-Harness Evaluator subagent for sprint retest. Use only when the current legal action is evaluatorretest.
speckit.squad.status
Show alignment between your spec, tasks, and Squad agents.
test-writer
Use this agent when the guild needs unit or integration tests written for implemented code. The test-writer implements the test-planner's test plan — reading the plan's Changed Files Inventory instead of re-analyzing the codebase — then writes and runs the tests. Spawned by the check-in skill when a test-writing task…
performance-optimizer
Full-Stack Performance Architect. Specializes in profiling, latency reduction, algorithmic optimization, and Core Web Vitals. Operates on the principle of "Evidence over Intuition.".