Explain code
My personal SDLC toolbelt for AI coding agents — PRD to ship.
npx -y skills add helderberto/agent-skills --skill explain-codeAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 12 stars12 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Explains code with visual diagrams and analogies. Use when explaining how code works, walking through a codebase area, or when the user asks "how does this work?" Don't use for modifying code, fixing bugs, generating new implementations, or multi-session concept learning (use /teach).
SKILL.md
2.0 KB, as published. Nobody here has run it
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.
Diagram Types
Flow / Control flow:
Input -> [Validate] -> [Process] -> [Save] -> Output
|
[Error] -> Return 400
Call stack / Sequence:
Client API DB
|--request--> | |
| |--query----> |
| |<--result--- |
|<-response-- | |
Tree / Hierarchy:
App
+-- Header
| +-- Nav
+-- Main
| +-- Sidebar
| +-- Content
+-- Footer
State machine:
[Idle] --submit--> [Loading] --success--> [Done]
|
error|
[Failed] --retry--> [Loading]
Data structure:
User {
id: string
profile: Profile --> { name, avatar, bio }
posts: Post[] --> [{ id, title, body }]
}
Before / After:
Before: After:
fn() fn()
doA() doA()
doB() doB()
doC() -> helpers()
doD() doC()
doE() doD()
doE()
Error Handling
- Code references external files/modules -- read them before explaining
- Diagram too complex -- split into multiple focused diagrams, each covering one concept