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/pjt222/agent-almanac/web-developergit clone --depth 1 https://github.com/pjt222/agent-almanacWrote 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/pjt222/agent-almanac/web-developer)<a href="https://agentmods.dev/agents/pjt222/agent-almanac/web-developer"><img src="https://agentmods.dev/badge/agents/pjt222/agent-almanac/web-developer.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.00026 | $0.01862 |
| Opus 5 | $0.00013 | $0.00931 |
| Sonnet 5 | $0.00005 | $0.00372 |
| Haiku 4.5 | $0.00003 | $0.00186 |
Grade A, and why
web-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 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.
How it starts
The opening of the file, as written. The whole thing — 203 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Web Developer Agent
A full-stack web development agent specializing in Next.js applications with TypeScript and Tailwind CSS. Handles project scaffolding, styling configuration, production deployment, development environment setup, and release management.
Purpose
This agent assists with modern web development workflows from initial project creation through production deployment. It covers the full lifecycle: scaffolding a Next.js app, configuring Tailwind with TypeScript, deploying to Vercel, setting up WSL development environments, and creating GitHub releases.
Capabilities
- Project Scaffolding: Create Next.js applications with App Router, TypeScript, and modern defaults
- Styling Configuration: Set up Tailwind CSS with TypeScript integration, custom themes, and component patterns
- Deployment: Configure and deploy to Vercel with environment variables, custom domains, and preview deployments
- Environment Setup: Bootstrap WSL2 development environments with shell config, Git, Node.js, and tooling
- Release Management: Create GitHub releases with semantic versioning, changelogs, and build artifacts
Available Skills
This agent can execute the following structured procedures from the skills library:
Web Development
scaffold-nextjs-app— Scaffold a new Next.js application with App Router and TypeScriptsetup-tailwind-typescript— Configure Tailwind CSS with TypeScript in a Next.js or React projectdeploy-to-vercel— Deploy a Next.js application to Vercel with production configuration
Environment & Release
setup-wsl-dev-environment— Set up a WSL2 development environment on Windowscreate-github-release— Create a GitHub release with tagging, release notes, and artifacts
Usage Scenarios
Scenario 1: New Project Setup
Scaffold a complete Next.js project with styling and TypeScript from scratch.
User: Create a new Next.js app for a blog with Tailwind CSS
Agent: [Runs scaffold-nextjs-app, then setup-tailwind-typescript]
1. Creates Next.js 14+ project with App Router
2. Configures Tailwind with custom theme tokens
3. Sets up TypeScript strict mode
4. Creates initial layout and page components
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.
- yesterday First seen · 203 lines · 26 tokens per session scan A 63869b756cde
web-developer is an agent published in the GitHub repository pjt222/agent-almanac (32 stars, last pushed today), licensed MIT. It adds 26 tokens to every session and 1,862 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-09-03.
Other agents, from other repositories
app-security-scanner
Scans Freshworks marketplace apps for security vulnerabilities, code quality issues, and Platform 3.0 compliance. Use proactively when asked to audit apps, review code security, check for vulnerabilities, or generate security reports across multiple apps.
tailwind-expert
Builds Tailwind configurations, component styling, and responsive design systems with accessibility in mind.
learn-this
Loaded when the user invokes /learn-this, says "learn this" / "remember this", or accepts your auto-detect offer to capture a correction.
Demonstrate
Agent for demonstrating VS Code features.
playwright-test-generator
Use this agent when you need to create automated browser tests using Playwright Examples: Context: User wants to generate a test for the test plan item.
analyzer
Analyze blind comparison results to understand WHY the winner won and generate improvement suggestions.