documentation

Generate Storybook stories, JSDoc comments, and feature docs for TypeScript and React.

4|1|Updated Oct 13, 2025
One-click install
npx skills add https://github.com/buzzdan/ai-coding-rules --skill documentation-buzzdan
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: documentation
Source: https://github.com/buzzdan/ai-coding-rules/tree/main/ts-react-linter-driven-development/skills/documentation
Command: npx skills add https://github.com/buzzdan/ai-coding-rules --skill documentation-buzzdan

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Generate comprehensive documentation for TypeScript + React features, components, and hooks including Storybook stories, JSDoc comments, and architectural feature docs.

Core Features & Use Cases

  • Storybook Stories: generate visual component documentation for props, variants, and accessibility.
  • JSDoc Comments: inline documentation for types and hooks with examples.
  • Feature Documentation: architectural decisions, usage guides, and API references.
  • Workflow & Templates: structured templates to keep docs aligned with code and future changes.

Quick Start

Run the documentation workflow after a feature is completed to generate Storybook stories, JSDoc comments, and feature documentation.

Frequently Asked Questions about documentation

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate Storybook stories and JSDoc comments for a completed React feature?

Feature documentation captures architectural decisions and design rationale by generating structured templates that record WHY choices were made. It produces API references, usage guides, and testing notes that align with your TypeScript and React codebase.

Does this documentation workflow support TypeScript hooks and React components?

Yes, this documentation workflow supports TypeScript hooks and React components by generating inline JSDoc comments with examples and Storybook stories. It handles props, variants, and accessibility guidance for your component library.

What is the best way to keep architectural feature docs in sync with code as a project evolves?

The best way to keep architectural feature docs in sync with code is applying structured documentation templates after a feature is completed. This generates living documentation that stays aligned with code changes and future project evolution.

Can I document accessibility guidance and testing notes for React components automatically?

Yes, you can document accessibility guidance and testing notes for React components automatically. The workflow generates structured outputs that include accessibility checks and testing templates alongside Storybook stories and API references.

When should I run the documentation generation workflow during the development cycle?

You should run the documentation generation workflow after a feature is completed. Running it post-completion ensures it captures the final WHY decisions, actual usage patterns, and accurate design rationale without interrupting your active coding process.