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 skills add bartstc/vite-ts-react-template --skill explaining-codegit clone --depth 1 https://github.com/bartstc/vite-ts-react-templateWrote 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/bartstc/vite-ts-react-template/explaining-code)<a href="https://agentmods.dev/skills/bartstc/vite-ts-react-template/explaining-code"><img src="https://agentmods.dev/badge/skills/bartstc/vite-ts-react-template/explaining-code/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/bartstc/vite-ts-react-template/explaining-code"><img src="https://agentmods.dev/badge/skills/bartstc/vite-ts-react-template/explaining-code.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.00038 | $0.00134 |
| Opus 5.5 | $0.00015 | $0.00054 |
| Sonnet 5.5 | $0.00008 | $0.00027 |
| Haiku 4.5 | $0.00004 | $0.00013 |
Grade A, and why
explaining-code 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 1mo 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.
This is a copy
95% identical to explain-code — 2 lines differ, which has more behind it and is treated as the original. This page carries a canonical link to it rather than competing with it.
What it actually says
When explaining code, always include:
- Start with an analogy: Compare the code to something from everyday life
- Draw a diagram: Use ASCII art to show the flow, structure, or relationships
- Walk through the code: Explain step-by-step what happens
- Highlight a gotcha: What's a common mistake or misconception?
Keep explanations conversational. For complex concepts, use multiple analogies.
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.
- 1mo ago First seen · 14 lines · 38 tokens per session scan A 2be8eaa67dad
explaining-code is a skill published in the GitHub repository bartstc/vite-ts-react-template (122 stars, last pushed 8d ago), licensed MIT. It adds 38 tokens to every session and 134 once invoked, about $0.0002 per session on Opus 5.5. A static security scan graded it A with 0 findings. It is 95% identical to explain-code, differing in 2 lines, and is treated as a copy.
Other skills, from other repositories
weapp-vite-react-best-practices
A Chinese-language guide for building React 19 WeChat mini programs with weapp-vite and @weapp-vite/react. WeChat mini programs are small apps that run inside WeChat.
typescript-react
Apply, review, and explain React conventions from the TypeScript Style Guide. Use automatically for TypeScript and TSX tasks involving prop-derived state, prop typing, component responsibilities, data flow, compound components, or client and server state.
chags
Use when building or extending CHAGS (Chinese Historical Anecdotes Game Series): each Chinese historical anecdote is one small kids game built with Phaser 4.2 inside a Vue 3.5 + Pinia shell (TypeScript 5.9.3, Vite 8, pnpm workspace, zh/en bilingual). Covers the GameModule/GameContext contract, gameplay template…
git
A guide to common Git version-control workflows. Git records changes to code so developers can work in branches, combine changes, and review project history.
github
A guide to using GitHub CLI, a command-line tool for working with GitHub repositories. It covers issues, pull requests, releases, labels, milestones, and workflow runs.
storybook
A guide for writing Storybook stories, which are isolated examples used to develop and document interface components. It focuses on the current Component Story Format and reusable component inputs.