Skip to content

STRUCTURE.md

Latest commit

 

History

History
1172 lines (892 loc) · 35.6 KB

STRUCTURE.md

File metadata and controls

1172 lines (892 loc) · 35.6 KB

Marketplace Structure Overview

Complete technical reference and structure documentation for Claude Craftkit.

Table of Contents

Directory Tree

Complete structure of Claude Craftkit:

claude-craftkit/
├── .claude-plugin/
│   └── marketplace.json              # Main marketplace manifest
│
├── plugins/
│   ├── db-tools/
│   │   ├── .claude-plugin/
│   │   │   └── plugin.json           # Plugin manifest
│   │   ├── commands/
│   │   │   ├── setup-drizzle.md
│   │   │   ├── create-schema.md
│   │   │   ├── generate-migration.md
│   │   │   └── create-query.md
│   │   └── skills/
│   │       └── database-architect.md
│   │
│   ├── ui/
│   │   ├── .claude-plugin/
│   │   │   └── plugin.json
│   │   ├── commands/
│   │   │   ├── add-shadcn-component.md
│   │   │   ├── create-custom-component.md
│   │   │   └── create-form.md
│   │   ├── skills/
│   │   │   ├── ui-designer.md
│   │   │   └── gesttione-design-system.md
│   │   └── README.md
│   │
│   ├── quality/
│   │   ├── .claude-plugin/
│   │   │   └── plugin.json
│   │   ├── commands/
│   │   │   ├── setup-quality-gates.md
│   │   │   ├── create-test.md
│   │   │   └── quality-gates.md
│   │   └── skills/
│   │       └── quality-gates.md
│   │
│   ├── audio-notifications/
│   │   ├── .claude-plugin/
│   │   │   └── plugin.json
│   │   ├── hooks/
│   │   │   ├── audio_notification_hook.py
│   │   │   ├── audio_notification_hook.sh
│   │   │   └── hooks.json
│   │   └── README.md
│   │
│   ├── git/
│   │   ├── .claude-plugin/
│   │   │   └── plugin.json
│   │   ├── commands/
│   │   │   ├── commit.md
│   │   │   └── commit-push-pr.md
│   │   ├── skills/
│   │   │   ├── git-commit.md
│   │   │   └── git-pr-creation.md
│   │   └── README.md
│   │
│   ├── reviewer/
│   │   ├── .claude-plugin/
│   │   │   └── plugin.json
│   │   ├── commands/
│   │   │   ├── sync.md
│   │   │   ├── fix-issues.md
│   │   │   └── pr-status.md
│   │   └── README.md
│   │
│   ├── ui-tests/
│   │   ├── .claude-plugin/
│   │   │   └── plugin.json
│   │   ├── commands/
│   │   │   ├── check.md
│   │   │   ├── take-screenshot.md
│   │   │   └── test-feature.md
│   │   └── skills/
│   │       └── web-tests.md
│   │
│   ├── architecture-design/
│   │   ├── .claude-plugin/
│   │   │   └── plugin.json
│   │   ├── skills/
│   │   │   ├── project-workflow.md
│   │   │   ├── code-standards.md
│   │   │   ├── clean-architecture.md
│   │   │   ├── naming-conventions.md
│   │   │   ├── error-handling-patterns.md
│   │   │   ├── typescript-type-safety.md
│   │   │   ├── backend-engineer.md
│   │   │   └── frontend-engineer.md
│   │   └── README.md
│
├── README.md                         # Main documentation
├── QUICKSTART.md                     # Quick start guide
├── STRUCTURE.md                      # This file
└── LICENSE                           # MIT License

Plugin Statistics

Summary Table

Plugin Commands Skills Hooks Agents Templates Category
db-tools 3 1 0 0 0 Database
ui 3 2 0 0 0 UI Architecture
quality 2 3 0 0 0 Testing
audio-notifications 0 0 3 0 0 QoL
git 2 2 0 2 0 Workflow
reviewer 3 1 0 0 0 Development
ui-tests 3 1 0 0 0 Testing
architecture-design 0 10 0 0 0 Development
TOTAL 16 20 3 2 0 -

Plugin Descriptions

1. Database Tools (db-tools)

Category: Database Author: Leon van Zyl License: MIT

Drizzle ORM and Postgres database management tools for Bun + Hono backend applications.

Features:

  • Drizzle ORM integration with Bun + Hono
  • PostgreSQL connection management with connection pooling
  • Schema generation with TypeScript types
  • Migration generation and management
  • Type-safe query builders
  • Relational query support
  • Database schema validation

Use Cases:

  • Setting up new database projects
  • Creating and managing database schemas
  • Generating type-safe migrations
  • Building complex relational queries
  • Database refactoring and evolution

2. UI Components (ui)

Category: UI Architecture Author: Marcio Altoé License: MIT

Comprehensive UI/UX toolkit for React applications with shadcn/ui, Tailwind CSS v4, and Clean Architecture patterns.

Features:

  • 2 specialized skills: ui-designer, gesttione-design-system (architecture moved to architecture-design plugin)
  • React 19 + Vite 6 + TanStack Router integration
  • shadcn/ui component installation and customization
  • TanStack ecosystem integration (Router, Query, Form, Table, Store)
  • Design tokens and dark mode support
  • Gesttione Design System with brand colors and metrics
  • Form components with TanStack Form + Zod validation
  • Responsive design with mobile-first approach
  • WCAG 2.1 AA accessibility compliance

Use Cases:

  • Setting up React project structure with Clean Architecture
  • Installing shadcn/ui components
  • Creating custom component libraries
  • Building forms with validation
  • Implementing design systems
  • Configuring TanStack Router and Query
  • Applying Gesttione brand identity
  • Rapid UI prototyping

3. Testing & Quality (quality)

Category: Testing Author: Marcio Altoé License: MIT

Comprehensive quality gates workflow with testing, linting, formatting, and automation.

Features:

  • 3 specialized skills: test-engineer, quality-engineer, barrel-craft
  • Complete quality gates workflow with automated checks
  • barrel-craft for automated barrel file management
  • Biome configuration for linting/formatting (TS/JS/CSS)
  • Prettier for markdown files
  • TypeScript strict mode setup
  • Vitest with React Testing Library
  • Husky pre-commit hooks
  • Test file generation with examples
  • CI/CD integration helpers

Use Cases:

  • Setting up complete quality gates workflow
  • Automating code quality checks
  • Writing unit tests for components and utilities
  • Enforcing code standards
  • Configuring pre-commit hooks
  • Managing barrel files automatically

4. Audio Notifications (audio-notifications)

Category: Quality of Life Author: Fred Lacs License: MIT

Audio notifications for Claude Code - speaks notification messages out loud.

Features:

  • Text-to-speech notifications via system TTS
  • Event hook integration
  • Configurable voice and speech rate
  • Cross-platform support (macOS, Linux, Windows)
  • Toggle on/off via config file
  • Custom speech commands
  • Accessibility enhancements

Use Cases:

  • Getting audio feedback on long-running tasks
  • Accessibility for visually impaired users
  • Background task notifications
  • Multi-tasking workflow enhancement

5. Commit Commands (git)

Category: Workflow Author: Marcio Altoé License: MIT

Git workflow automation with intelligent skills and quick commands for conventional commits and PR creation.

Features:

  • Hybrid architecture: Autonomous skills + explicit commands
  • Conventional Commits specification compliance
  • Automated commit message generation
  • Comprehensive PR descriptions with technical details
  • GitHub CLI integration
  • Branch validation and management
  • Git workflow best practices

Use Cases:

  • Automating git commit workflows
  • Creating conventional commit messages
  • Generating comprehensive PR descriptions
  • Managing git branches
  • Enforcing commit standards

6. PR Reviewer (reviewer)

Category: Development Author: Marcio Altoé License: MIT

CodeRabbit AI review management - download, organize, and fix PR review comments systematically.

Features:

  • CodeRabbit AI integration
  • Download PR review comments
  • Organize issues by file and severity
  • Track review status
  • Systematic issue resolution workflow
  • GitHub CLI integration

Use Cases:

  • Managing CodeRabbit AI review feedback
  • Tracking PR review progress
  • Organizing and prioritizing review comments
  • Systematic code review improvements

7. UI Tests (ui-tests)

Category: Testing Author: Marcio Altoé License: MIT

Browser automation and web testing with Playwright - auto-detects dev servers, creates test scripts, captures screenshots.

Features:

  • Playwright browser automation
  • Auto-detect development servers
  • Screenshot capture and comparison
  • Web page health checks (broken links, errors)
  • Feature testing automation
  • E2E test script generation

Use Cases:

  • Browser automation and testing
  • Visual regression testing
  • Web page health monitoring
  • E2E test creation
  • Screenshot documentation

8. Architecture & Design (architecture-design)

Category: Development Author: Marcio Altoé License: MIT

Architecture and design patterns with SOLID principles, Clean Code standards, and TypeScript best practices for building maintainable applications.

Features:

  • 8 specialized skills covering all architecture aspects
  • SOLID principles + Clean Code standards (KISS, YAGNI, DRY, TDA) consolidated in code-standards skill
  • Clean Architecture patterns (domain/application/infrastructure with HTTP layer)
  • Backend engineering with Hono, DDD, and custom DI Container
  • Frontend engineering with React 19, TanStack ecosystem, and monorepo patterns
  • TypeScript type safety best practices
  • Comprehensive naming conventions
  • Error handling patterns and strategies
  • Project-specific standards for Bun + TypeScript stack

Use Cases:

  • Enforcing SOLID principles in class design
  • Implementing Clean Architecture patterns (backend and frontend)
  • Backend development with Hono + Bun + Drizzle ORM
  • Frontend development with React 19 + TanStack Router + TanStack Store
  • Monorepo setup with Turborepo and Bun/pnpm workspaces
  • Custom DI Container implementation with Symbol-based tokens
  • Applying Clean Code standards
  • TypeScript type safety guidance
  • Naming conventions enforcement
  • Error handling strategy implementation
  • Project standards compliance

Command Reference

Complete list of all available commands across all plugins.

Database Tools (3 commands)

Command Description
/create-schema Generate database table schemas with TypeScript types and relations
/generate-migration Create database migration files based on schema changes
/create-query Generate type-safe database queries with Drizzle query builder

UI Components (3 commands)

Command Description
/add-shadcn Install shadcn/ui components to the project
/create-component Generate custom React components with TypeScript and Tailwind CSS
/create-form Create forms with validation, error handling, and shadcn/ui elements

Testing & Quality (2 commands)

Command Description
/create-test Generate test files with Vitest and React Testing Library examples
/check Run complete workflow: craft → format → lint → type-check → test

Git Workflow (2 commands)

Command Description
/commit Quick commit with conventional format (explicit control)
/commit-push-pr Complete workflow: stage → commit → push → create PR (explicit control)

Note: The git plugin also includes 2 autonomous skills (git-commit and git-pr-creation) that work automatically based on context. See Intelligent Skills section.

PR Reviewer (3 commands)

Command Description
/sync Download CodeRabbit AI review comments for a Pull Request
/fix-issues Fix issues for a given PR systematically
/pr-status Check status of PR review issues

UI Tests (3 commands)

Command Description
/check Check webpage for issues (broken links, errors, etc.)
/take-screenshot Take screenshots of web pages
/test-feature Test a webapp feature with Playwright

Intelligent Skills

Skills are autonomous capabilities that Claude invokes automatically based on context.

1. database-architect

Plugin: db-tools Type: Autonomous skill Focus: Database design and Drizzle ORM

Invocation Examples:

  • "set up database with Drizzle"
  • "create a users table"
  • "design a schema for blog posts"

Capabilities:

  • Schema design and optimization
  • Database normalization strategies
  • Migration planning and execution
  • Query optimization and indexing
  • Relational data modeling
  • Type-safe query generation
  • Database best practices enforcement

2. ui-designer

Plugin: ui Type: Autonomous skill Focus: UI/UX with shadcn/ui and Tailwind CSS v4

Invocation Examples:

  • "create a pricing card component"
  • "design a responsive navigation"
  • "build a form with validation"

Capabilities:

  • Component design and architecture (React 19 + Vite)
  • Responsive layout implementation
  • Accessibility (WCAG 2.1 AA) compliance
  • Design system integration
  • Tailwind v4 utility optimization
  • Component composition patterns
  • Theme and dark mode management

3. gesttione-design-system

Plugin: ui Type: Autonomous skill Focus: Gesttione brand identity and design system

Invocation Examples:

  • "use Gesttione brand colors"
  • "create revenue metric card"
  • "apply Gesttione design system"

Capabilities:

  • Gesttione brand color system (6 core colors)
  • Metric color semantics (revenue, CMV, purchases, costs, etc.)
  • Surface color generation with color-mix()
  • Typography system (Geist, Lora, Geist Mono)
  • Dashboard component patterns
  • WCAG AA/AAA accessibility with brand colors

4. architecture-auditor

Plugin: architecture-design Type: Autonomous skill Focus: Architecture audit and compliance verification

Invocation Examples:

  • "audit frontend against CLAUDE.md"
  • "what doesn't match our architecture"
  • "find inconsistencies with backend patterns"
  • "check if features follow clean architecture"

Capabilities:

  • Comprehensive codebase analysis
  • Architecture pattern evaluation
  • Technical debt assessment
  • Documentation compliance verification (CLAUDE.md, specs, ADRs)
  • Frontend and backend architecture review
  • Design pattern validation
  • Dependency rule enforcement
  • Layer separation verification

5. test-engineer

Plugin: quality Type: Autonomous skill Focus: Test creation and testing best practices

Invocation Examples:

  • "create tests for this component"
  • "write unit tests"
  • "add test coverage"

Capabilities:

  • Test file generation with Vitest
  • React Testing Library patterns
  • Mock and stub creation with vi utilities
  • Test organization and structure
  • Coverage analysis with v8 provider
  • Testing best practices enforcement

6. quality-engineer

Plugin: quality Type: Autonomous skill Focus: Code quality and linting configuration

Invocation Examples:

  • "set up quality gates"
  • "configure linting"
  • "set up code quality tools"

Capabilities:

  • Complete quality gates workflow setup
  • Biome configuration for linting/formatting (TS/JS/CSS)
  • Prettier for markdown
  • TypeScript strict mode setup
  • Husky pre-commit hooks
  • Quality workflow automation

7. barrel-craft

Plugin: quality Type: Autonomous skill Focus: Barrel file management and exports

Invocation Examples:

  • "update barrel files"
  • "organize exports"
  • "configure barrel-craft"

Capabilities:

  • Automated barrel file generation
  • Export management and organization
  • barrel-craft configuration
  • Import path optimization
  • Module structure maintenance

8. git-commit

Plugin: git Type: Autonomous skill Description: Automatically detects when to commit and creates conventional commits

Invocation Examples:

  • "commit these changes"
  • "save this work"
  • "I'm done with this feature, let's commit"
  • "create a commit for the auth updates"

Capabilities:

  • Analyzes code changes automatically
  • Generates conventional commit messages
  • Validates branch (prevents commits to main/dev)
  • Runs quality checks (tests, type checking)
  • Follows Conventional Commits specification
  • Provides context-aware commit messages

Workflow:

  1. Analyzes staged and unstaged changes
  2. Determines appropriate commit type and scope
  3. Generates descriptive commit message
  4. Validates branch and project state
  5. Executes commit with proper format

9. git-pr-creation

Plugin: git Type: Autonomous skill Description: Automatically creates comprehensive PRs when work is complete

Invocation Examples:

  • "create a PR"
  • "ready for review"
  • "open a pull request"
  • "submit this to dev"
  • "all tests passing, let's get this reviewed"

Capabilities:

  • Automatically detects when work is ready
  • Analyzes all commits in branch
  • Creates comprehensive PR descriptions
  • Follows Conventional Commits for titles
  • GitHub CLI integration
  • Technical documentation with code examples
  • Best practices for code review

Workflow:

  1. Verifies GitHub CLI authentication
  2. Analyzes commits from dev..HEAD
  3. Categorizes changes by type
  4. Generates PR title (conventional format)
  5. Creates detailed PR body with examples
  6. Executes gh pr create command

10. project-workflow

Plugin: architecture-design Type: Autonomous skill Focus: Development workflow and quality gates for Bun + TypeScript stack

Invocation Examples:

  • "Before commit"
  • "Quality gates"
  • "Workflow checklist"
  • "Bun commands"
  • "Pre-commit checks"

Capabilities:

  • Pre-commit checklist (mandatory execution order)
  • Quality gates workflow (craft → format → lint → type-check → test)
  • Bun runtime APIs (password hashing, file operations, UUID v7, SQLite)
  • Barrel files workflow (bun run craft)
  • Common workflow mistakes prevention
  • Quick reference for commit workflow

Note: For complete project rules and standards, see CLAUDE.md (global instructions)

11. code-standards

Plugin: architecture-design Type: Autonomous skill Focus: Code design standards including SOLID principles (SRP, OCP, LSP, ISP, DIP) and Clean Code patterns (KISS, YAGNI, DRY, TDA)

Invocation Examples:

  • "Apply SOLID principles to this class"
  • "Keep this code simple"
  • "Refactor this function"
  • "Designing new module"
  • "Architecture review needed"
  • "Code review needed"
  • "Avoid over-engineering"
  • "Is this too complex?"

Capabilities:

SOLID Principles (OOP Design):

  • Single Responsibility Principle (SRP) - One reason to change per class/module
  • Open/Closed Principle (OCP) - Open for extension, closed for modification
  • Liskov Substitution Principle (LSP) - Subtypes must be substitutable for base types
  • Interface Segregation Principle (ISP) - Small, focused interfaces over large ones
  • Dependency Inversion Principle (DIP) - Depend on abstractions, not concretions

Clean Code Principles (Simplicity & Pragmatism):

  • KISS (Keep It Simple, Stupid) - Simplicity over complexity
  • YAGNI (You Aren't Gonna Need It) - Build only what's needed right now
  • DRY (Don't Repeat Yourself) - Apply abstraction after Rule of Three (3 occurrences)
  • TDA (Tell, Don't Ask) - Tell objects what to do, don't ask for data and make decisions

Function Design & Code Organization:

  • Keep functions < 20 lines
  • Meaningful names over comments
  • Single level of abstraction per function
  • Early returns to reduce nesting
  • Anti-pattern detection (God classes, premature optimization, clever code, magic numbers)
  • When to apply principles (and when NOT to over-apply)

12. clean-architecture

Plugin: architecture-design Type: Autonomous skill Focus: Clean Architecture including layered architecture, dependency rule, and DDD patterns

Invocation Examples:

  • "Structure this using Clean Architecture"
  • "Create a use case for user registration"
  • "Design domain entities"
  • "Implement repository pattern"

Capabilities:

  • The Dependency Rule - Dependencies point inward toward domain
  • Domain Layer - Pure business logic (Entities, Value Objects, Domain Services)
  • Application Layer - Use Cases, DTOs, Ports (interfaces)
  • Infrastructure Layer - Adapters (repositories, external services, controllers, HTTP layer)
    • HTTP Layer: Server, Middleware, Plugins
  • Repository pattern and Dependency Injection
  • Testing strategy (pure unit tests for domain, mocked tests for application)
  • Anti-patterns to avoid (anemic domain model, fat controllers)

13. naming-conventions

Plugin: architecture-design Type: Autonomous skill Focus: Comprehensive naming standards for files, directories, classes, functions, and variables

Invocation Examples:

  • "Review naming conventions in this file"
  • "Creating new files"
  • "Naming this function"
  • "Refactor variable names"

Capabilities:

  • File naming: kebab-case with descriptive suffixes
  • Directory naming: Plural for collections, singular for modules
  • Classes & Interfaces: PascalCase
  • Functions & Variables: camelCase
  • Constants: UPPER_SNAKE_CASE
  • Boolean naming: is, has, can, should prefixes
  • Interface vs Implementation naming
  • DTO and Response naming
  • Use Case naming

14. error-handling-patterns

Plugin: architecture-design Type: Autonomous skill Focus: Error handling patterns including exceptions, Result pattern, and validation strategies

Invocation Examples:

  • "Help me with error handling"
  • "Implement validation logic"
  • "Create custom exception types"
  • "Add retry mechanism"

Capabilities:

  • Use exceptions, not return codes
  • Never return null for errors
  • Provide context with exceptions
  • Exception hierarchy (domain and infrastructure exceptions)
  • Result pattern for expected failures
  • Validation patterns (input validation at boundaries, domain validation)
  • Error recovery patterns (retry logic, circuit breaker, fallback values)
  • Structured error logging
  • HTTP error handling with Hono

15. typescript-type-safety

Plugin: architecture-design Type: Autonomous skill Focus: TypeScript type safety including type guards and advanced type system features

Invocation Examples:

  • "Implement type guards for this data"
  • "Working with unknown types"
  • "Advanced TypeScript patterns"

Capabilities:

  • NEVER use any - Use unknown with type guards
  • Proper type guards (type predicates)
  • Discriminated unions for polymorphic data
  • Conditional types
  • Mapped types (Partial, Readonly, Pick, Omit)
  • Template literal types
  • Function overloads
  • Const assertions
  • Utility types (NonNullable, Extract, Exclude, Record)
  • Type narrowing (typeof, instanceof, in operator)
  • TypeScript strict mode configuration

16. backend-engineer

Plugin: architecture-design Type: Autonomous skill Focus: Backend engineering with Clean Architecture, DDD, and Hono framework

Invocation Examples:

  • "Create a backend API"
  • "Implement repository pattern"
  • "Add use case"
  • "Backend structure"
  • "Setup dependency injection"

Capabilities:

  • Domain Layer examples (Entities, Value Objects, Ports)
  • Application Layer examples (Use Cases, DTOs, Mappers)
  • Infrastructure Layer examples (Repositories, Adapters, DI Container, Controllers)
  • HTTP Layer examples (Server, Middleware, Plugins)
  • Custom DI Container with Symbol-based tokens
  • Lifetime management (singleton, scoped, transient)
  • Composition root pattern
  • Best practices for backend development
  • Common patterns (Result type, Domain Events, Repository pattern)
  • Clean Architecture with Hono + Bun + Drizzle ORM

17. frontend-engineer

Plugin: architecture-design Type: Autonomous skill Focus: Frontend engineering with Clean Architecture, React 19, and TanStack ecosystem

Invocation Examples:

  • "Create a frontend feature"
  • "Implement gateway pattern"
  • "Setup monorepo structure"
  • "State management with TanStack Store"
  • "React component architecture"

Capabilities:

  • Monorepo structure (apps/ + packages/ with Turborepo)
  • Feature-based architecture (components, pages, stores, gateways, hooks, types)
  • Gateway/Port pattern for HTTP, storage, events
  • Thin Use Cases that delegate to gateways
  • State Management (TanStack Store for local state + TanStack Query for server state)
  • HTTP Service with Axios interceptors and error handling
  • TanStack Router file-based routing with type safety
  • Testing strategy (unit tests with mock gateways, component tests, E2E tests)
  • Best practices for frontend development
  • React 19 + Vite 6 + TanStack ecosystem integration

18. pull-request-skill

Plugin: reviewer Type: Autonomous skill Focus: Pull Request review management for CodeRabbit AI

Invocation Examples:

  • "download PR reviews"
  • "fix CodeRabbit issues for PR 123"
  • "check review status"
  • "organize review comments by severity"

Capabilities:

  • Download CodeRabbit AI review comments from GitHub PRs
  • Organize issues by severity (critical, major, trivial)
  • Track issue resolution status
  • Systematically guide through review feedback
  • Generate review summaries and reports
  • Prioritize fixes by impact
  • Monitor progress on review resolution

19. web-tests

Plugin: ui-tests Type: Autonomous skill Focus: Browser automation with Playwright

Invocation Examples:

  • "test this page"
  • "take screenshots of responsive design"
  • "test login flow"
  • "check for broken links"
  • "validate form submission"

Capabilities:

  • Complete browser automation with Playwright
  • Auto-detects running dev servers
  • E2E testing for web applications
  • Responsive design validation (mobile, tablet, desktop)
  • Form testing and validation
  • Screenshot capture across viewports
  • Login flow testing
  • Broken link detection
  • Custom test script generation
  • Saves tests to working directory for reusability

Hooks

Hooks are event handlers that execute on specific Claude Code events.

audio-notifications Plugin

The audio-notifications plugin provides event hooks for text-to-speech notifications.

Hook Files:

  • audio_notification_hook.py - Python implementation
  • audio_notification_hook.sh - Shell script implementation
  • hooks.json - Hook configuration

Configuration File: ~/.claude/audio_notifications.json

{
  "audio_off": false,
  "speech_command": "say"
}

Options:

  • audio_off: Boolean to enable/disable audio (default: false)
  • speech_command: System TTS command:
    • macOS: "say" or "say -v Victoria"
    • Linux: "spd-say" or "espeak"
    • Windows: Configure via PowerShell speech

Events Handled:

  • Task completion notifications
  • Error notifications
  • Long-running process updates

Tech Stack Coverage

This marketplace provides comprehensive support for modern web development:

✅ Backend Runtime: Bun (TypeScript runtime) ✅ Backend Framework: Hono (lightweight, fast web framework) ✅ Database: PostgreSQL with Drizzle ORM (migrations, queries, schemas, relations) ✅ Frontend Framework: React 19 with Vite 6 ✅ Routing: TanStack Router (file-based, type-safe) ✅ UI Styling: Tailwind CSS v4 with design tokens and dark mode ✅ UI Components: shadcn/ui component library ✅ State Management: TanStack Query + Zustand + TanStack Store ✅ Forms: TanStack Form + Zod validation ✅ Architecture: Clean Architecture (3-layer: domain/application/infrastructure) ✅ Design System: Gesttione brand colors and metrics ✅ Testing: Vitest + React Testing Library ✅ Code Quality: Biome (TS/JS/CSS) + Prettier (markdown) + barrel-craft ✅ Pre-commit Hooks: Husky with quality gates ✅ Quality of Life: Audio notifications for task completion ✅ Git Workflow: Conventional Commits and automated PR creation

Plugin Details

db-tools

  • Version: 1.0.0
  • Author: Leon van Zyl
  • License: MIT
  • Category: Database
  • Keywords: drizzle, postgres, orm, migrations, database

ui

  • Version: 1.0.0
  • Author: Marcio Altoé
  • License: MIT
  • Category: UI Architecture
  • Keywords: react, vite, tanstack-router, shadcn, tailwind, clean-architecture, design-system, gesttione

quality

  • Version: 1.0.0
  • Author: Marcio Altoé
  • License: MIT
  • Category: Testing
  • Keywords: vitest, quality-gates, biome, prettier, barrel-craft, husky, testing, typescript

audio-notifications

  • Version: 1.0.0
  • Author: Fred Lacs
  • License: MIT
  • Category: Quality of Life
  • Keywords: audio, notifications, tts, accessibility, text-to-speech

git

  • Version: 1.0.0
  • Author: Marcio Altoé
  • License: MIT
  • Category: Workflow
  • Keywords: git, commit, conventional-commits, pull-request, workflow, automation, skills
  • Architecture: Hybrid approach with autonomous skills and explicit commands

reviewer

  • Version: 1.0.0
  • Author: Marcio Altoé
  • License: MIT
  • Category: Development
  • Keywords: github, pr, code-review, coderabbit, automation, reviewer

ui-tests

  • Version: 1.0.0
  • Author: Marcio Altoé
  • License: MIT
  • Category: Testing
  • Keywords: playwright, browser-automation, testing, e2e, screenshots, web-testing

architecture-design

  • Version: 1.0.0
  • Author: Marcio Altoé
  • License: MIT
  • Category: Development
  • Keywords: architecture, design-patterns, code-standards, solid-principles, clean-code, typescript, naming-conventions, best-practices

Files Overview

Marketplace Level

  • 1 Marketplace manifest (.claude-plugin/marketplace.json)
  • 1 Main README (README.md)
  • 1 Quick start guide (QUICKSTART.md)
  • 1 Structure documentation (STRUCTURE.md)
  • 1 License file (LICENSE)

Plugin Level

  • 8 Plugin manifests (plugin.json in each plugin)
  • 16 Command files (.md files in commands/ directories)
  • 20 Skill definitions (.md files in skills/ directories)
  • 3 Hook files (in audio-notifications)
  • 6 Plugin READMEs (db-tools, ui, quality, git, reviewer, ui-tests, architecture-design)

Total: 54 files providing comprehensive Claude Code development support.

Installation Size

Approximate sizes:

  • Commands: ~30-40 KB total
  • Agents: ~10-20 KB total
  • Skills: ~15-25 KB total
  • Hooks: ~5-10 KB total
  • Manifests: ~3-5 KB total
  • Documentation: ~25-30 KB total

Total marketplace size: ~90-130 KB (text files only, no dependencies)

Customization

Modifying Commands

  1. Edit .md files in plugins/[plugin-name]/commands/
  2. Update command logic and instructions
  3. Reinstall plugin: /plugin uninstall then /plugin install

Modifying Skills

  1. Edit .md files in plugins/[plugin-name]/skills/
  2. Update skill description (determines when Claude invokes it)
  3. Update skill instructions and capabilities
  4. Reinstall plugin

Important: The skill description field is critical - it determines when Claude automatically invokes the skill. Be specific about trigger phrases and use cases.

Adding New Plugins

  1. Create directory: plugins/your-plugin-name/
  2. Add .claude-plugin/plugin.json with metadata
  3. Add commands/ and/or skills/ directories
  4. Update .claude-plugin/marketplace.json
  5. Install: /plugin install your-plugin-name@claude-craftkit

Plugin Structure Template

plugins/your-plugin-name/
├── .claude-plugin/
│   └── plugin.json           # Required: Plugin metadata
├── commands/                 # Optional: Slash commands (explicit control)
│   └── your-command.md
├── skills/                   # Optional: Autonomous skills (intelligent invocation)
│   └── your-skill.md
├── hooks/                    # Optional: Event hooks
│   └── hooks.json
└── README.md                 # Optional: Plugin documentation

Creating Custom Commands

Command files (.md) should follow this structure:

---
allowed-tools: Bash(git add:*), Bash(git commit:*)
description: Brief description of what this command does
---

## Your Command Instructions

Instructions for Claude on how to execute this command...

Creating Custom Skills

Skill files (.md) should follow this structure:

---
name: your-skill-name
description: Detailed description of when to use this skill, with trigger examples. The more specific, the better Claude can determine when to invoke it automatically.
---

## Your Skill Instructions

Instructions for Claude on how to execute this skill...

Key Differences:

  • Commands are explicitly invoked by users (/command-name) for direct control
  • Skills are automatically invoked by Claude based on context and user intent

Version Information

  • Marketplace Version: 1.0.0
  • All Plugin Versions: 1.0.0
  • Created: 2025
  • Maintainer: Marcio Altoé (marcio.altoe@gmail.com)
  • Contributors: Leon van Zyl, Fred Lacs

Maintenance

Updating Plugins

  1. Make changes to plugin files
  2. Update version in plugin.json
  3. Update marketplace version if needed
  4. Test changes locally
  5. Reinstall plugin: 
    /plugin uninstall plugin-name@claude-craftkit
/plugin install plugin-name@claude-craftkit

Publishing Updates

  1. Update version numbers
  2. Update CHANGELOG (if exists)
  3. Tag release in git
  4. Push to GitHub
  5. Create GitHub Release
  6. Users update via: /plugin update

For installation and usage tutorials, see QUICKSTART.md. For overview and examples, see README.md.