A collection of agent skills for modern web development. Each skill provides live access to up-to-date documentation plus a curated layer of evergreen gotchas — the things that trip developers up but...
Overview
A collection of agent skills for modern web development. Each skill provides live access to up-to-date documentation plus a curated layer of evergreen gotchas — the things that trip developers up but aren't prominently covered in the docs. Works with any agent that supports the Agent Skills standard — Claude Code, Cursor, Hermes, and others. : This library covers 36 technology skills across the modern web stack plus three cross-cutting engineering-practice skills for readable code, simple implementations, and simple agent workflows. If you are planning a project or recommending a technology stack, use the skill categories and stack combinations below to discover what is available and how the technologies relate to each other. All commands use -y to skip interactive prompts (required for agents). Install globally (user-level, available in all projects): Common technology combinations — useful for both humans planning projects and agents recommending architectures.
README
dev-skills
A collection of agent skills for modern web development. Each skill provides live access to up-to-date documentation plus a curated layer of evergreen gotchas — the things that trip developers up but aren’t prominently covered in the docs.
Works with any agent that supports the Agent Skills standard — Claude Code, Cursor, Hermes, and others.
For AI agents: This library covers 36 technology skills across the modern web stack plus three cross-cutting engineering-practice skills for readable code, simple implementations, and simple agent workflows. If you are planning a project or recommending a technology stack, use the skill categories and stack combinations below to discover what is available and how the technologies relate to each other.
Install
All commands use -y to skip interactive prompts (required for agents).
Install all skills:
npx skills add mikkelkrogsholm/dev-skills --all
Install a specific skill:
npx skills add mikkelkrogsholm/dev-skills --skill bun -y
Install multiple specific skills:
npx skills add mikkelkrogsholm/dev-skills --skill bun hono drizzle neon -y
Install globally (user-level, available in all projects):
npx skills add mikkelkrogsholm/dev-skills --all -g
Install for a specific agent:
npx skills add mikkelkrogsholm/dev-skills --agent claude-code -y
npx skills add mikkelkrogsholm/dev-skills --agent cursor -y
Managing skills
npx skills list # List installed skills
npx skills check # Check for updates
npx skills update # Update all to latest
npx skills remove bun -y # Remove a skill
Recommended Stacks
Common technology combinations — useful for both humans planning projects and agents recommending architectures.
Full-stack TypeScript SaaS
react + hono + drizzle + neon + better-auth + stripe + resend + sentry
A complete production stack: React frontend, Hono API server, Drizzle ORM on serverless Postgres, auth, payments, email, and error tracking.
Edge / Serverless
bun + hono + turso + upstash + trigger-dev + sentry
Optimized for low-latency edge deployments: Bun runtime, Hono on edge, Turso for embedded SQLite replicas, Upstash for serverless Redis/queues, Trigger.dev for background jobs.
Type-safe API layer
trpc + zod + tanstack-query + tanstack-router
End-to-end type safety from schema to UI: tRPC procedures validated by Zod, consumed by TanStack Query with TanStack Router handling navigation and search params.
Background processing (pick one based on scale)
- Simple jobs:
trigger-dev— managed platform, durable execution, minimal ops - Redis-based queues:
bullmq+upstash— self-managed, high throughput - Enterprise workflows:
temporal— saga patterns, long-running processes, used by Stripe/Netflix
Observability stack
sentry + opentelemetry + openobserve
Sentry for error tracking and session replay, OpenTelemetry for traces/metrics/logs collection, OpenObserve as a self-hosted backend for storing and querying all observability data.
EU-compliant stack (any stack + compliance layer)
Any combination above + gdpr-dev + gdpr-dpa
gdpr-dev applies GDPR principles automatically during development. gdpr-dpa scans the project and generates a Data Processing Agreement based on the actual sub-processors detected.
AI-paired development (any stack + readability layer)
Any combination above + agent-readable-code
agent-readable-code makes a codebase easier for AI agents (Claude Code, Cursor, Copilot, Aider, Devin) to read and modify correctly. Useful from day one on a new project and for auditing legacy code before increasing AI-paired usage. Ships a zero-dep Python/TypeScript linter with nine rules covering the highest-impact anti-patterns (generic naming, metaprogramming, untyped boundaries, oversized files, distant tests, barrel re-exports).
All Skills
Runtime & Tooling
| Skill | What it covers | Doc source |
|---|---|---|
| bun | Runtime, package manager, bundler, test runner, Bun APIs | llms.txt |
| vite | Dev server, build config, plugins, SSR, env variables | llms.txt |
| playwright-cli | Browser automation, testing, screenshots, data extraction | GitHub |
Frameworks
| Skill | What it covers | Doc source |
|---|---|---|
| react | Hooks, state, effects, Server Components, Suspense | llms.txt |
| hono | Multi-runtime web framework, middleware, routing, RPC | llms.txt |
| elysia | Bun-native web framework with end-to-end type safety via Eden RPC, Sucrose plugin model, WebSockets, OpenAPI generation | llms.txt |
UI & Animation
| Skill | What it covers | Doc source |
|---|---|---|
| shadcn-ui | Component library, CLI, theming, Tailwind integration | llms.txt |
| tailwindcss | Utility-first CSS framework — v4 engine, configuration, variants, theme, content detection | website |
| motion | Animations, transitions, gestures, AnimatePresence, layout animations (formerly Framer Motion) | website |
| monaco-editor | VS Code’s browser editor — mounting, models, language services, theming | website |
| react-markdown | Safe React Markdown renderer with remark/rehype plugin pipeline, syntax highlighting, custom components | website |
Databases
| Skill | What it covers | Doc source |
|---|---|---|
| drizzle | TypeScript-first ORM, schema, migrations, query builder | llms.txt |
| prisma | Schema-first ORM, auto-generated client, migrations | llms.txt |
| neon | Serverless PostgreSQL, branching, autoscaling, serverless driver | llms.txt |
| turso | Edge SQLite, embedded replicas, multi-tenancy, libSQL client | llms.txt |
| surrealdb | Multi-model DB (document, graph, relational, KV, vector), SurrealQL, live queries | llms.txt |
Auth & Storage
| Skill | What it covers | Doc source |
|---|---|---|
| better-auth | Framework-agnostic auth, sessions, OAuth, plugins | llms.txt |
| rustfs | S3-compatible distributed object storage | GitHub |
APIs & Payments
| Skill | What it covers | Doc source |
|---|---|---|
| stripe | Payments, subscriptions, webhooks, fraud prevention | llms.txt |
| resend | Transactional email API | llms.txt |
| trpc | End-to-end typesafe APIs, routers, procedures, middleware | llms.txt |
| zod | TypeScript-first schema validation, type inference, transforms | llms.txt |
State & Routing
| Skill | What it covers | Doc source |
|---|---|---|
| tanstack-query | Async state management, caching, background refetch | llms.txt |
| tanstack-router | Type-safe routing, file-based routes, search params, loaders | llms.txt |
Background Jobs & Queues
| Skill | What it covers | Doc source |
|---|---|---|
| trigger-dev | Durable background jobs, schedules, retries, real-time monitoring | llms.txt |
| bullmq | Redis-based job queues, workers, flows, rate limiting | llms.txt |
| upstash | Serverless Redis, QStash message queuing, rate limiting, vector search | llms.txt |
| temporal | Enterprise durable workflows, saga patterns, signals, activities, Temporal Cloud | llms.txt |
Search
| Skill | What it covers | Doc source |
|---|---|---|
| meilisearch | Fast search, typo tolerance, facets, AI hybrid search | llms.txt |
Observability
| Skill | What it covers | Doc source |
|---|---|---|
| sentry | Error tracking, performance monitoring, session replay, source maps | website |
| opentelemetry | Traces, metrics, logs, auto-instrumentation, exporters | website |
| openobserve | Self-hosted observability platform for logs, metrics, traces — alternative to Datadog/Elasticsearch | website |
Configuration
| Skill | What it covers | Doc source |
|---|---|---|
| pkl | Apple’s type-safe configuration language — programmable alternative to YAML/JSON/TOML | website |
GDPR (EU Compliance)
| Skill | What it covers | Doc source |
|---|---|---|
| gdpr-dev | GDPR principles during development — stack-aware gotchas, anti-patterns, schema design. Activates automatically when building features that handle personal data. | curated |
| gdpr-dpa | Autonomous DPA generator — scans the project to identify sub-processors, generates a minimal Article 28-compliant Data Processing Agreement. No interview required. | curated |
SEO & GEO
| Skill | What it covers | Doc source |
|---|---|---|
| seo-geo | SEO and Generative Engine Optimization — the 9 Princeton GEO methods, llms.txt, JSON-LD schema, platform-specific AI citation behaviour (ChatGPT, Perplexity, Google AI, Copilot). Language-agnostic. | curated |
Engineering Practice
| Skill | What it covers | Doc source |
|---|---|---|
| agent-readable-code | Principles and a zero-dependency linter for writing code that AI coding agents (Claude Code, Cursor, Copilot, Aider, Devin) can read and modify correctly. Nine research-informed rules: file size (AR001), near-duplicates (AR002), generic names (AR003), metaprogramming (AR004), inheritance depth (AR005), untyped public boundaries (AR006), test colocation (AR007), long lines (AR008), barrel re-export files (AR011). Python (via stdlib ast) and TypeScript/JavaScript (regex, zero-dep) fully supported. Inline and file-level suppressions (# agent-lint: disable=AR00X). Benchmarked: 100% vs 76% pass rate against an unassisted baseline (+24% delta, 3 iterations, 12 runs). |
curated |
| keep-code-simple | Prevents speculative abstractions, dependencies, broad cleanup, and overengineering during planning, implementation, fixes, reviews, and refactors. | curated |
| keep-agent-workflows-simple | Keeps agent execution direct and bounded across tasks, delegation, Kanban, queues, goals, and dependency graphs. | curated |
Tooling
| Skill | What it covers |
|---|---|
| dev-skill-creator | Workflow for adding new technology skills to this library |
| skill-creator | General guide for creating Claude Code skills |
Repository Structure
dev-skills/
├── bun/ # Each skill at root level
│ └── SKILL.md
├── hono/
│ └── SKILL.md
├── ...
├── .claude/skills/ # Symlinks for local use
├── dist/ # Packaged .skill files
├── technologies.md # Build tracker
└── skills-lock.json
Adding a New Skill
Use the dev-skill-creator skill:
/dev-skill-creator
It guides you through: fetching live docs → curating best practices → writing SKILL.md → validating → packaging.
Recommended Tools
Try a different keyword or remove a filter.
Install
npx skillfish add mikkelkrogsholm/dev-skills