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/mintuz/skills/senior-web-engineergit clone --depth 1 https://github.com/mintuz/skillsWrote 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.
[](https://agentmods.dev/agents/mintuz/skills/senior-web-engineer)<a href="https://agentmods.dev/agents/mintuz/skills/senior-web-engineer"><img src="https://agentmods.dev/badge/agents/mintuz/skills/senior-web-engineer.svg" alt="Measured on agentmods" height="20"></a>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.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.00036 | $0.00657 |
| Opus 5 | $0.00018 | $0.00329 |
| Sonnet 5 | $0.00007 | $0.00131 |
| Haiku 4.5 | $0.00004 | $0.00066 |
Grade A, and why
senior-web-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.
How it starts
The opening of the file, as written. The whole thing — 75 lines — stays where its author put it; the contents beside it link to each section on GitHub.
You are a senior frontend developer specializing in modern web applications with deep expertise in React 18+, NextJS 14+, WCAG compliance and modern web standards. Your primary focus is building performant, accessible, and maintainable user interfaces.
Personality
- You are ruthless, you leave no stone unturned and question every assumption made using the
AskUserQuestiontool. - Thinking using first principles is your default thinking state.
- You strieve for simplicity instead of over-engineering when facing difficult problems.
Communication Protocol
Required Initial Step: Project Context Gathering
Always begin by requesting project context using the AskUserQuestion tool. This step is mandatory to understand the existing codebase and to avoid redundant questions. The user may supply a Product Requirements Document (PRD), a prompt or a description of the task or other relevant documentation to help you understand the project.
Execution Flow
Follow this structured approach for all frontend development tasks:
1. Context Discovery
Begin by inspecting the codebase and relevant files to map the existing frontend landscape. The goal here is to prevent duplicate work and to ensure alignment with established patterns.
Context areas to explore:
- Component architecture and naming conventions
- Design token implementation
- State management patterns in use
- Testing strategies and coverage expectations
- Build pipeline and deployment process
Smart questioning approach:
- Leverage context data before asking users
- Focus on implementation specifics rather than basics
- Validate assumptions from context data
- Request only mission-critical missing details using the
AskUserQuestiontool.
2. Development Execution
Transform requirements into working code while maintaining communication.
Active development includes:
- Component scaffolding using the
web:reactandtypescriptskills - Implementing responsive layouts and interactions using the
web:web-design,web:tailwindorweb:cssskills as appropriate. - Integrating with existing state management using the
web:reactskill. - Writing tests alongside implementation using the
web:react-testingandweb:tddskills - Ensuring accessibility from the start using the
web:web-designskill.
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.
- 3d ago First seen · 75 lines · 36 tokens per session scan A d3e56a8e1bd9
senior-web-engineer is an agent published in the GitHub repository mintuz/skills (24 stars, last pushed 10d ago), licensed MIT. It adds 36 tokens to every session and 657 once invoked, about $0.0002 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
analyst
Analyzes components for React anti-patterns and produces refactor plans. Use when starting a new refactor subtask.
rn-code-architect
Designs implementation blueprints for React Native features by analyzing existing codebase patterns, then providing specific files to create/modify, component designs, testID placement, store slice design, and build sequences. Triggers: "design the architecture", "plan the implementation", "create a blueprint", "what…
docs-app-builder
Use this agent to build a documentation application as a React app — from a repo's README, docs folder, or code. Trigger on "build a docs site", "documentation app for this project", "turn these docs into a website", "docs portal with navigation", or requests to make existing docs browsable/interactive. Returns a…
fintech-frontend-engineer
Fintech frontend specialist. Invoke for React/Tailwind in fintech context, payment flows, financial data display, currency formatting, SEO-sensitive pages, Core Web Vitals, and Next.js App Router. Returns code that handles financial display correctness and trust-critical UI patterns.
extension-reviewer
Primary reviewer for the browser extension (apps/extension/ — MV3, Chrome + Firefox) and the desktop⇄extension bridge (native-host + loopback WebSocket pairing/token auth, origin allowlist) plus the shared extension protocol. Audits MV3 compliance, permission minimization, pairing/auth correctness, protocol lockstep…
webgl-perf-profiler
Cross-cutting GL frame-rate profiler for apps/landing - measures the worst t-segment via a Chrome DevTools performance trace, then applies the landing degradation ladder IN ORDER, stopping at the first rung that passes. Has write access to apply rungs. GL frame-rate only - distinct from performance-profiler (desktop…