Borrowing it
Nothing to install: this file belongs to opsrobot-ai/opsrobot. Take a copy, put it at the same path in your own repository, and replace the rules that are about this project with yours.
curl -O https://raw.githubusercontent.com/opsrobot-ai/opsrobot/main/.cursor/skills/anyrobot-shadcn-frontend-js/SKILL.mdgit clone --depth 1 https://github.com/opsrobot-ai/opsrobotWrote 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/skills/opsrobot-ai/opsrobot/anyrobot-shadcn-frontend-js)<a href="https://agentmods.dev/skills/opsrobot-ai/opsrobot/anyrobot-shadcn-frontend-js"><img src="https://agentmods.dev/badge/skills/opsrobot-ai/opsrobot/anyrobot-shadcn-frontend-js/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/opsrobot-ai/opsrobot/anyrobot-shadcn-frontend-js"><img src="https://agentmods.dev/badge/skills/opsrobot-ai/opsrobot/anyrobot-shadcn-frontend-js.svg" alt="Reviewed on agentmods" width="80" 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.1 | $0.00074 | $0.04265 |
| Opus 5 | $0.00037 | $0.02132 |
| Sonnet 5 | $0.00015 | $0.00853 |
| Haiku 4.5 | $0.00007 | $0.00426 |
Grade A, and why
anyrobot-shadcn-frontend-js scanned grade A with 1 finding 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 10d 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.
Makes network callslowCapability
Not a fault in itself. Listed so you know the mod talks to something, and to what.
const response = await fetch(url); How it starts
The opening of the file, as written. The whole thing — 665 lines — stays where its author put it; the contents beside it link to each section on GitHub.
AnyRobot 前端开发核心指南
本技能提供了一套现代化的前端开发核心规范和最佳实践，涵盖 JavaScript、React、Tailwind CSS 和 shadcn/ui 等技术栈。
适用场景：新项目初始化、现有项目优化、代码审查参考、团队开发规范制定。
✨ 核心价值
✅ 推荐的最佳实践：
- 使用 const/let 而非 var
- 遵循组件化开发原则，合理拆分组件
- 采用 Tailwind CSS 进行样式管理
- 集成 shadcn/ui 构建一致的 UI 组件库
- 注重性能优化和安全实践
- 保持代码风格一致，添加必要注释
- 建立清晰的项目文件结构
- 完善错误处理和边界情况
目录导航
项目结构与文件组织
推荐的项目结构
/src
/components
/ui # shadcn/ui 组件
button.jsx
input.jsx
card.jsx
/layout # 布局组件
Header.jsx
Sidebar.jsx
Footer.jsx
/feature # 功能组件
UserList.jsx
UserForm.jsx
/hooks # 自定义 Hooks
useAuth.js
useApi.js
/utils # 工具函数
formatters.js
api.js
/pages # 页面组件
/home # 首页模块
index.jsx
components/ # 首页子组件
Hero.jsx
Features.jsx
/auth # 认证模块
index.jsx
components/ # 认证子组件
LoginForm.jsx
/dashboard # 仪表盘模块
index.jsx
components/ # 仪表盘子组件
StatsCard.jsx
/context # React 上下文
AuthContext.jsx
/locales # 国际化资源
/en-US # 英语（美国）
index.js
common.js
dashboard.js
/zh-CN # 中文（简体）
index.js
common.js
dashboard.js
/styles # 全局样式
globals.css
App.jsx # 应用根组件
main.jsx # 应用入口
i18n.js # 国际化配置
命名规范
- 组件文件：使用 PascalCase，如
UserList.jsx - 工具函数：使用 camelCase，如
formatDate.js - 目录名：使用 kebab-case，如
feature-components - 变量和函数：使用 camelCase
- 常量：使用 UPPER_SNAKE_CASE
- 国际化文件：
- 语言目录：使用语言代码，如
en-US、zh-CN - 资源文件：使用 camelCase，如
common.js、dashboard.js - 键名：使用点号分隔的命名空间，如
common.hello、dashboard.title
- 语言目录：使用语言代码，如
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.
- 10d ago First seen · 665 lines · 74 tokens per session scan A 0c0c713783c4
anyrobot-shadcn-frontend-js is a skill published in the GitHub repository opsrobot-ai/opsrobot (135 stars, last pushed 3mo ago), licensed Apache-2.0. It adds 74 tokens to every session and 4,265 once invoked, about $0.0004 per session on Opus 5. A static security scan graded it A with 1 finding (makes network calls). No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
monitoring-observability
Monitoring and observability patterns for Prometheus metrics, Grafana dashboards, Langfuse v4 LLM tracing (astype, scorecurrentspan, shouldexportspan, LangfuseMedia), and drift detection. Use when adding logging, metrics, distributed tracing, LLM cost tracking, or quality drift monitoring.
datadog
Full-stack observability with Datadog APM, logs, metrics, synthetics, and RUM. Use when implementing monitoring, tracing, alerting, or cost optimization for production systems.
monitoring-expert
Expert-level monitoring and observability with Prometheus, Grafana, logging, and alerting. Use when the user mentions observability, Prometheus, Grafana, logging, metrics, or alerting, or when the task involves The Three Pillars of Observability, Monitoring Fundamentals, Prometheus Configuration, or Alert Rules.
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI).…
observability-testing-patterns
Observability and monitoring validation patterns for dashboards, alerting, log aggregation, APM traces, and SLA/SLO verification. Use when testing monitoring infrastructure, dashboard accuracy, alert rules, or metric pipelines.
Observability & Monitoring
Structured logging, metrics, distributed tracing, and alerting strategies.