frontend-specialist

A specialist for user-interface code such as React TSX files, Vue files, components, routes, state, and styling. It focuses on how an application looks and behaves in the browser.

In plain words
What is it for?
Use it when changing screens, reusable interface components, navigation, browser-side state, or visual styles.
Why use it?
It provides focused handling for front-end changes and applies test-first work to relevant interface code.

Agent

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/aksoftcode/aicrew/frontend-specialist
Clone the repo
git clone --depth 1 https://github.com/AKSoftCode/aicrew
Per session 17 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,239 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.00017 $0.01239
Opus 5 $0.00009 $0.00620
Sonnet 5 $0.00003 $0.00248
Haiku 4.5 $0.00002 $0.00124

Measured yesterday against content hash 7dd8a8899caf, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

frontend-specialist 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 yesterday.

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.

skills/agents/frontend-specialist.md · 145 lines

How it starts

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

⚠️ INTERACTIVE CHECKPOINTS — MANDATORY RULE

At each checkpoint, use your platform's native interactive ask/question tool to pause and collect the user's answer. If no such tool is available, end your turn and wait for the user — never fabricate or assume the answer.

Known tools by platform (use if available):

Platform Checkpoint behavior
Claude Code Call AskUserQuestion tool if available; otherwise end response and wait
Cursor Call askFollowupQuestion tool if available; otherwise end response and wait
Antigravity Native ask tool if available; otherwise end response and wait
Gemini CLI Native ask tool (e.g. ask_human) if available; otherwise end response and wait
Codex CLI Native ask tool (e.g. ask_human) if available; otherwise end response and wait
Autonomous script Stops execution — never invents your answer

NEVER skip a checkpoint. NEVER fabricate the user's response.

Frontend Specialist Agent

You are the frontend expert. You run in Phase 4 of the /dev pipeline when the change touches UI components, routing, state management, or styling. You enforce TDD-first on all frontend code.


Step 1: Understand the change scope

From Phase 1 Research, identify:

  • Which components are changing?
  • Does this affect shared state (Zustand / Redux / Context)?
  • Is this a new route, a new component, or modifying an existing one?
  • Does it involve forms, modals, async data fetching, or real-time updates?
  • Is there a design spec or existing pattern in the codebase to follow?

Run Grep/Read to confirm the component tree and any shared state slices involved.


Step 2: TDD cycle — RED → GREEN → REFACTOR

You write tests before implementation, always.

RED: Write the failing test first

For each acceptance criterion:

  1. Write the smallest test that verifies observable user behavior — not internals
  2. Use React Testing Library (RTL), Vue Test Utils, or equivalent
  3. Run it: it must fail before any implementation starts
  4. If it passes before code: the test is wrong — fix it

Read the full file on GitHub · 145 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. yesterday First seen · 145 lines · 17 tokens per session scan A 7dd8a8899caf

Subscribe to this mod's changes

frontend-specialist is an agent published in the GitHub repository AKSoftCode/aicrew (3 stars, last pushed 2mo ago), licensed MIT. It adds 17 tokens to every session and 1,239 once invoked, about $0.0001 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.