frontend-engineer

frontend-engineer is an agent for Claude Code from Maximumsoft-Co-LTD/claude-flightdeck. It costs 83 tokens per session (1,618 once invoked), scanned A, original, MIT.

A coding agent that builds client-side features such as pages, interface components, forms, browser state, API calls, and translations while following the application's existing structure and style.

In plain words
What is it for?
Use it for frontend and user-interface changes, including routes, components, forms, client data handling, styling, and internationalization.
Why use it?
It avoids forcing the project to adopt unfamiliar folders, state-management tools, or visual conventions. TDD, or test-driven development, means writing tests as part of the implementation process.

Agent for Claude Code

Install

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.

agentmods
npx agentmods add agents/maximumsoft-co-ltd/claude-flightdeck/frontend-engineer
Clone the repo
git clone --depth 1 https://github.com/Maximumsoft-Co-LTD/claude-flightdeck

Made for: Claude Code.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for frontend-engineer

README.md
[![agentmods](https://agentmods.dev/badge/agents/maximumsoft-co-ltd/claude-flightdeck/frontend-engineer.svg)](https://agentmods.dev/agents/maximumsoft-co-ltd/claude-flightdeck/frontend-engineer)
Your own site
<a href="https://agentmods.dev/agents/maximumsoft-co-ltd/claude-flightdeck/frontend-engineer"><img src="https://agentmods.dev/badge/agents/maximumsoft-co-ltd/claude-flightdeck/frontend-engineer.svg" alt="Measured on agentmods" height="20"></a>
Per session 83 Only the description is in the session, so the agent can decide to use it. The body loads when it is invoked.
When invoked 1,618 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

What 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.

ModelPer sessionOnce invoked
Fable 5 $0.00083 $0.01618
Opus 5 $0.00042 $0.00809
Sonnet 5 $0.00017 $0.00324
Haiku 4.5 $0.00008 $0.00162

Measured 3d ago against content hash 58afaf41470a, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

frontend-engineer 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 3d 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.

core/.claude/agents/frontend-engineer.md · 109 lines

How it starts

The opening of the file, as written. The whole thing — 109 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Frontend Engineer (convention-driven)

You implement frontend features in {{PROJECT_NAME}}. You carry no fixed folder structure or state library of your own. Your job is to write code that looks like the UI code already in this repo — same folders, component conventions, state approach, styling, and i18n — and to raise its quality within that pattern. Imposing a structure the app doesn't use is the failure mode you exist to avoid.

Model: sonnet (cost-aware default). Implementation against a clear design doc is Sonnet's sweet spot, and the 6-gate review + zero-fix D-doc are the quality net — so the template doesn't pre-pay for Opus on every feature. Escalate to Opus for a genuinely hard task (or after ≥2 rounds that don't pass the gates) by dispatching with an explicit model override, or by bumping this frontmatter for your project. Routing rationale: ../../.claude/rules/sub-agent-workflow.md §1.5.

Pre-task ritual (MANDATORY)

Step 0 — read your brief. If the dispatch named a brief file (docs/project/sprints/S<N>/designs/_briefs/<TASK_ID>-impl.md), Read it FIRST — it is your complete task input; the short dispatch prompt omits the detail on purpose. See ../../docs/setup/file-based-dispatch.md.

Execute .claude/rules/agent-pre-task-ritual.md before touching any code. You do NOT inherit the main session's context. At minimum:

  1. Read root CLAUDE.md and .claude/rules/brain-hot.md (the always-apply rules).
  2. Read .claude/rules/code-style.md — the project's learned conventions (component patterns, state, styling, i18n, test style, folder layout), generated during /onboard. This is your style contract. If it's still the stub, rely on Step 0.5 sampling and flag the gap.
  3. Read the frontend app's local CLAUDE.md (stack lock + commands) if present.
  4. Read the task design doc (the dispatcher gives the path).

Read the full file on GitHub · 109 lines

Changes

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.

  1. 3d ago First seen · 109 lines · 0 tokens per session scan A 58afaf41470a

Subscribe to this mod's changes

frontend-engineer is an agent published in the GitHub repository Maximumsoft-Co-LTD/claude-flightdeck (2 stars, last pushed 2mo ago), licensed MIT. It adds 83 tokens to every session and 1,618 once invoked, about $0.0004 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-31.

Related

Other agents, from other repositories

vc-update-process-agent

UPDATE PROCESS MODE - Analyze execution, generate rule improvements, update plan files and context. Use after completing EXECUTE mode to reconcile deviations and capture learnings.

withkynam/vibecode-pro-max-kit · 36 tokens

vc-plan-agent

PLAN MODE - Creating exhaustive technical specifications and implementation plans. Can write to process/general-plans/active/ and process/features//active/ only. Use after approach is decided.

withkynam/vibecode-pro-max-kit · 40 tokens

vc-validate-agent

VALIDATE MODE - Convert a written plan into an executable contract. Runs two-layer parallel fan-out (infra, test coverage, breaking changes, security + per-section feasibility agents), synthesizes findings, presents validate-menu to user, then writes validate-contract section into the plan file. Mandatory phase…

withkynam/vibecode-pro-max-kit · 74 tokens

vc-fast-mode-agent

FAST MODE - Execute compressed RIPER-5 workflow (RESEARCH + SPEC + INNOVATE + PLAN + VALIDATE) in one session, then pause for EXECUTE confirmation. Use when you want quick end-to-end solution.

withkynam/vibecode-pro-max-kit · 51 tokens

vc-innovate-agent

INNOVATE MODE - Brainstorming and exploring implementation approaches. Discusses possibilities without making decisions. Use after research is complete.

withkynam/vibecode-pro-max-kit · 32 tokens

vc-research-agent

RESEARCH MODE - Information gathering only. Use for understanding existing code, architecture, and context. Never suggests implementations or modifications.

withkynam/vibecode-pro-max-kit · 30 tokens