feat(skills): add design-patterns analyzer skill
Comprehensive GoF design patterns analyzer with stack-aware suggestions. **Features**: - Detects 23 GoF patterns (Creational, Structural, Behavioral) - Stack detection (React, Angular, NestJS, Vue, Express, RxJS, Redux, ORMs) - Code smell detection with pattern suggestions - Quality evaluation (5 criteria scoring) - Prefers stack-native alternatives (e.g., React Context over Singleton) **Structure**: - 9 files: SKILL.md + reference docs + detection rules + evaluation checklists - 3 operating modes: Detection, Suggestion, Evaluation - Pattern-specific documentation for all 23 GoF patterns **Documentation**: - Added comprehensive example in guide section 5.4 - Updated examples/README.md with skill entry - Updated template count: 65 → 66 **Use cases**: - Analyze existing patterns in codebase - Suggest refactoring with stack-native patterns - Evaluate pattern implementation quality Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
936f8dd564
commit
fcc6f2dba3
12 changed files with 5842 additions and 3 deletions
|
|
@ -4796,6 +4796,154 @@ it('should calculate order total', () => {
|
|||
});
|
||||
```
|
||||
|
||||
### Example 3: Design Patterns Analyzer Skill
|
||||
|
||||
**Purpose**: Detect, analyze, and suggest Gang of Four design patterns in TypeScript/JavaScript codebases with stack-aware recommendations.
|
||||
|
||||
**Location**: `examples/skills/design-patterns/`
|
||||
|
||||
**Key Features**:
|
||||
- Detects 23 GoF design patterns (Creational, Structural, Behavioral)
|
||||
- Stack-aware detection (React, Angular, NestJS, Vue, Express, RxJS, Redux, ORMs)
|
||||
- Code smell detection with pattern suggestions
|
||||
- Quality evaluation (5 criteria: Correctness, Testability, SRP, Open/Closed, Documentation)
|
||||
- Prefers stack-native alternatives (e.g., React Context over Singleton)
|
||||
|
||||
**Structure**:
|
||||
```
|
||||
design-patterns/
|
||||
├── SKILL.md # Main skill instructions
|
||||
├── reference/
|
||||
│ ├── patterns-index.yaml # 23 patterns metadata
|
||||
│ ├── creational.md # 5 creational patterns
|
||||
│ ├── structural.md # 7 structural patterns
|
||||
│ └── behavioral.md # 11 behavioral patterns
|
||||
├── signatures/
|
||||
│ ├── stack-patterns.yaml # Stack detection + native alternatives
|
||||
│ ├── detection-rules.yaml # Grep patterns for detection
|
||||
│ └── code-smells.yaml # Smell → pattern mappings
|
||||
└── checklists/
|
||||
└── pattern-evaluation.md # Quality scoring system
|
||||
```
|
||||
|
||||
**Operating Modes**:
|
||||
|
||||
1. **Detection Mode**: Find existing patterns in codebase
|
||||
```bash
|
||||
# Invoke via skill or direct analysis
|
||||
"Analyze design patterns in src/"
|
||||
```
|
||||
|
||||
2. **Suggestion Mode**: Identify code smells and suggest patterns
|
||||
```bash
|
||||
"Suggest design patterns to fix code smells in src/services/"
|
||||
```
|
||||
|
||||
3. **Evaluation Mode**: Score pattern implementation quality
|
||||
```bash
|
||||
"Evaluate the Factory pattern implementation in src/lib/errors/"
|
||||
```
|
||||
|
||||
**Example Output**:
|
||||
|
||||
```json
|
||||
{
|
||||
"stack_detected": {
|
||||
"primary": "react",
|
||||
"version": "19.0",
|
||||
"secondary": ["typescript", "next.js", "prisma"],
|
||||
"detection_sources": ["package.json", "tsconfig.json"]
|
||||
},
|
||||
"patterns_found": {
|
||||
"factory-method": [{
|
||||
"file": "src/lib/errors/factory.ts",
|
||||
"lines": "12-45",
|
||||
"confidence": 0.9,
|
||||
"quality_score": 8.2,
|
||||
"notes": "Well-implemented with proper abstraction"
|
||||
}],
|
||||
"singleton": [{
|
||||
"file": "src/config.ts",
|
||||
"confidence": 0.85,
|
||||
"quality_score": 4.0,
|
||||
"recommendation": "Consider React Context instead"
|
||||
}]
|
||||
},
|
||||
"code_smells": [{
|
||||
"type": "switch_on_type",
|
||||
"file": "src/components/data-handler.tsx",
|
||||
"line": 52,
|
||||
"severity": "medium",
|
||||
"suggested_pattern": "strategy",
|
||||
"rationale": "Replace conditional logic with strategy objects"
|
||||
}]
|
||||
}
|
||||
```
|
||||
|
||||
**Stack-Native Recommendations**:
|
||||
|
||||
| Pattern | React Alternative | Angular Alternative | NestJS Alternative |
|
||||
|---------|-------------------|---------------------|-------------------|
|
||||
| Singleton | Context API + Provider | @Injectable() service | @Injectable() (default) |
|
||||
| Observer | useState + useEffect | RxJS Observables | EventEmitter |
|
||||
| Decorator | Higher-Order Component | @Decorator syntax | @Injectable decorators |
|
||||
| Factory | Custom Hook pattern | Factory service | Provider pattern |
|
||||
|
||||
**Detection Methodology**:
|
||||
|
||||
1. **Stack Detection**: Analyze package.json, tsconfig.json, config files
|
||||
2. **Pattern Search**: Use Glob → Grep → Read pipeline
|
||||
- Glob: Find candidate files (`**/*factory*.ts`, `**/*singleton*.ts`)
|
||||
- Grep: Match detection patterns (regex for key structures)
|
||||
- Read: Verify pattern implementation
|
||||
3. **Quality Evaluation**: Score on 5 criteria (0-10 each)
|
||||
4. **Smell Detection**: Identify anti-patterns and suggest refactoring
|
||||
|
||||
**Quality Evaluation Criteria**:
|
||||
|
||||
| Criterion | Weight | Description |
|
||||
|-----------|--------|-------------|
|
||||
| Correctness | 30% | Follows canonical pattern structure |
|
||||
| Testability | 25% | Easy to mock, no global state |
|
||||
| Single Responsibility | 20% | One clear purpose |
|
||||
| Open/Closed | 15% | Extensible without modification |
|
||||
| Documentation | 10% | Clear intent, usage examples |
|
||||
|
||||
**Example Usage in Agent**:
|
||||
|
||||
```markdown
|
||||
---
|
||||
name: architecture-reviewer
|
||||
description: Review system architecture and design patterns
|
||||
tools: Read, Grep, Glob
|
||||
skills:
|
||||
- design-patterns # Inherits pattern knowledge
|
||||
---
|
||||
|
||||
When reviewing architecture:
|
||||
1. Use design-patterns skill to detect existing patterns
|
||||
2. Evaluate pattern implementation quality
|
||||
3. Suggest improvements based on stack-native alternatives
|
||||
4. Check for code smells requiring pattern refactoring
|
||||
```
|
||||
|
||||
**Integration with Méthode Aristote**:
|
||||
|
||||
This skill is now installed in the Méthode Aristote repository at:
|
||||
```
|
||||
/Users/florianbruniaux/Sites/MethodeAristote/app/.claude/skills/design-patterns/
|
||||
```
|
||||
|
||||
**Usage**:
|
||||
1. Direct invocation: "Analyze design patterns in src/"
|
||||
2. Via agent: Create an agent that inherits the design-patterns skill
|
||||
3. Automated review: Use in CI/CD to detect pattern violations
|
||||
|
||||
**Reference**:
|
||||
- Full documentation: `examples/skills/design-patterns/SKILL.md`
|
||||
- Pattern reference: `examples/skills/design-patterns/reference/*.md`
|
||||
- Detection rules: `examples/skills/design-patterns/signatures/*.yaml`
|
||||
|
||||
## 5.5 Community Skill Repositories
|
||||
|
||||
### Cybersecurity Skills Repository
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue