@defai.digital/automatosx 5.6.35 → 5.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +142 -0
- package/README.md +44 -2
- package/dist/index.js +1129 -345
- package/examples/agents/.automatosx/abilities/accessibility.md +115 -0
- package/examples/agents/.automatosx/abilities/api-design.md +159 -0
- package/examples/agents/.automatosx/abilities/best-practices.md +102 -0
- package/examples/agents/.automatosx/abilities/caching-strategy.md +165 -0
- package/examples/agents/.automatosx/abilities/ci-cd.md +61 -0
- package/examples/agents/.automatosx/abilities/clean-code.md +398 -0
- package/examples/agents/.automatosx/abilities/code-generation.md +95 -0
- package/examples/agents/.automatosx/abilities/code-review.md +42 -0
- package/examples/agents/.automatosx/abilities/component-architecture.md +112 -0
- package/examples/agents/.automatosx/abilities/content-creation.md +97 -0
- package/examples/agents/.automatosx/abilities/data-modeling.md +171 -0
- package/examples/agents/.automatosx/abilities/data-validation.md +50 -0
- package/examples/agents/.automatosx/abilities/db-modeling.md +158 -0
- package/examples/agents/.automatosx/abilities/debugging.md +43 -0
- package/examples/agents/.automatosx/abilities/dependency-audit.md +60 -0
- package/examples/agents/.automatosx/abilities/design-patterns.md +437 -0
- package/examples/agents/.automatosx/abilities/design-system-implementation.md +126 -0
- package/examples/agents/.automatosx/abilities/documentation.md +54 -0
- package/examples/agents/.automatosx/abilities/error-analysis.md +107 -0
- package/examples/agents/.automatosx/abilities/etl-pipelines.md +44 -0
- package/examples/agents/.automatosx/abilities/feasibility-study.md +20 -0
- package/examples/agents/.automatosx/abilities/general-assistance.md +26 -0
- package/examples/agents/.automatosx/abilities/idea-evaluation.md +21 -0
- package/examples/agents/.automatosx/abilities/infra-as-code.md +57 -0
- package/examples/agents/.automatosx/abilities/job-orchestration.md +44 -0
- package/examples/agents/.automatosx/abilities/literature-review.md +19 -0
- package/examples/agents/.automatosx/abilities/logical-analysis.md +21 -0
- package/examples/agents/.automatosx/abilities/longform-report.md +25 -0
- package/examples/agents/.automatosx/abilities/mathematical-reasoning.md +170 -0
- package/examples/agents/.automatosx/abilities/mission-analysis.md +49 -0
- package/examples/agents/.automatosx/abilities/observability.md +61 -0
- package/examples/agents/.automatosx/abilities/orbital-mechanics.md +50 -0
- package/examples/agents/.automatosx/abilities/our-architecture-decisions.md +180 -0
- package/examples/agents/.automatosx/abilities/our-code-review-checklist.md +149 -0
- package/examples/agents/.automatosx/abilities/our-coding-standards.md +270 -0
- package/examples/agents/.automatosx/abilities/our-project-structure.md +183 -0
- package/examples/agents/.automatosx/abilities/performance-analysis.md +56 -0
- package/examples/agents/.automatosx/abilities/performance.md +80 -0
- package/examples/agents/.automatosx/abilities/problem-solving.md +50 -0
- package/examples/agents/.automatosx/abilities/propulsion-systems.md +50 -0
- package/examples/agents/.automatosx/abilities/quantum-algorithm-design.md +54 -0
- package/examples/agents/.automatosx/abilities/quantum-error-correction.md +56 -0
- package/examples/agents/.automatosx/abilities/quantum-frameworks-transpilation.md +53 -0
- package/examples/agents/.automatosx/abilities/quantum-noise-modeling.md +58 -0
- package/examples/agents/.automatosx/abilities/refactoring.md +223 -0
- package/examples/agents/.automatosx/abilities/release-strategy.md +58 -0
- package/examples/agents/.automatosx/abilities/risk-assessment.md +19 -0
- package/examples/agents/.automatosx/abilities/secrets-policy.md +61 -0
- package/examples/agents/.automatosx/abilities/secure-coding-review.md +51 -0
- package/examples/agents/.automatosx/abilities/security-audit.md +65 -0
- package/examples/agents/.automatosx/abilities/software-architecture.md +394 -0
- package/examples/agents/.automatosx/abilities/solid-principles.md +341 -0
- package/examples/agents/.automatosx/abilities/sql-optimization.md +84 -0
- package/examples/agents/.automatosx/abilities/state-management.md +96 -0
- package/examples/agents/.automatosx/abilities/task-planning.md +65 -0
- package/examples/agents/.automatosx/abilities/technical-writing.md +77 -0
- package/examples/agents/.automatosx/abilities/telemetry-diagnostics.md +51 -0
- package/examples/agents/.automatosx/abilities/testing.md +47 -0
- package/examples/agents/.automatosx/abilities/threat-modeling.md +49 -0
- package/examples/agents/.automatosx/abilities/troubleshooting.md +80 -0
- package/examples/agents/.automatosx/agents/aerospace-scientist.yaml +75 -0
- package/examples/agents/.automatosx/agents/backend.yaml +152 -0
- package/examples/agents/.automatosx/agents/ceo.yaml +63 -0
- package/examples/agents/.automatosx/agents/creative-marketer.yaml +121 -0
- package/examples/agents/.automatosx/agents/cto.yaml +72 -0
- package/examples/agents/.automatosx/agents/data-scientist.yaml +124 -0
- package/examples/agents/.automatosx/agents/data.yaml +77 -0
- package/examples/agents/.automatosx/agents/design.yaml +74 -0
- package/examples/agents/.automatosx/agents/devops.yaml +89 -0
- package/examples/agents/.automatosx/agents/frontend.yaml +139 -0
- package/examples/agents/.automatosx/agents/fullstack.yaml +151 -0
- package/examples/agents/.automatosx/agents/mobile.yaml +161 -0
- package/examples/agents/.automatosx/agents/product.yaml +72 -0
- package/examples/agents/.automatosx/agents/quality.yaml +79 -0
- package/examples/agents/.automatosx/agents/quantum-engineer.yaml +75 -0
- package/examples/agents/.automatosx/agents/researcher.yaml +71 -0
- package/examples/agents/.automatosx/agents/security.yaml +86 -0
- package/examples/agents/.automatosx/agents/stan.yaml +189 -0
- package/examples/agents/.automatosx/agents/writer.yaml +78 -0
- package/examples/agents/.automatosx/teams/business.yaml +56 -0
- package/examples/agents/.automatosx/teams/core.yaml +60 -0
- package/examples/agents/.automatosx/teams/design.yaml +58 -0
- package/examples/agents/.automatosx/teams/engineering.yaml +69 -0
- package/examples/agents/.automatosx/teams/research.yaml +56 -0
- package/examples/agents/.automatosx/templates/analyst.yaml +60 -0
- package/examples/agents/.automatosx/templates/assistant.yaml +48 -0
- package/examples/agents/.automatosx/templates/basic-agent.yaml +28 -0
- package/examples/agents/.automatosx/templates/code-reviewer.yaml +52 -0
- package/examples/agents/.automatosx/templates/debugger.yaml +63 -0
- package/examples/agents/.automatosx/templates/designer.yaml +69 -0
- package/examples/agents/.automatosx/templates/developer.yaml +60 -0
- package/examples/agents/.automatosx/templates/fullstack-developer.yaml +395 -0
- package/examples/agents/.automatosx/templates/qa-specialist.yaml +71 -0
- package/examples/agents/.claude/commands/ax-agent.md +37 -0
- package/examples/agents/.claude/commands/ax-clear.md +22 -0
- package/examples/agents/.claude/commands/ax-init.md +25 -0
- package/examples/agents/.claude/commands/ax-list.md +19 -0
- package/examples/agents/.claude/commands/ax-memory.md +25 -0
- package/examples/agents/.claude/commands/ax-status.md +24 -0
- package/examples/agents/.claude/commands/ax-update.md +28 -0
- package/examples/agents/.claude/mcp/automatosx.json +244 -0
- package/examples/agents/CLAUDE.md +262 -0
- package/package.json +1 -1
|
@@ -0,0 +1,437 @@
|
|
|
1
|
+
# Design Patterns Ability
|
|
2
|
+
|
|
3
|
+
Expert knowledge and application of software design patterns from the Gang of Four and beyond.
|
|
4
|
+
|
|
5
|
+
## Overview
|
|
6
|
+
|
|
7
|
+
Design patterns are proven solutions to common software design problems. They provide a shared vocabulary and best practices for object-oriented design.
|
|
8
|
+
|
|
9
|
+
## Creational Patterns
|
|
10
|
+
|
|
11
|
+
Patterns for object creation mechanisms.
|
|
12
|
+
|
|
13
|
+
### Factory Method
|
|
14
|
+
|
|
15
|
+
**Problem**: Need to create objects without specifying exact class
|
|
16
|
+
**Solution**: Define interface for creating objects, let subclasses decide which class to instantiate
|
|
17
|
+
|
|
18
|
+
**When to use**:
|
|
19
|
+
- Class can't anticipate the type of objects it needs to create
|
|
20
|
+
- Subclasses specify the objects to create
|
|
21
|
+
- Delegate creation responsibility to helper subclasses
|
|
22
|
+
|
|
23
|
+
**Example**:
|
|
24
|
+
```typescript
|
|
25
|
+
interface Logger {
|
|
26
|
+
log(message: string): void;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
abstract class LoggerFactory {
|
|
30
|
+
abstract createLogger(): Logger;
|
|
31
|
+
|
|
32
|
+
logMessage(message: string) {
|
|
33
|
+
const logger = this.createLogger();
|
|
34
|
+
logger.log(message);
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
class ConsoleLoggerFactory extends LoggerFactory {
|
|
39
|
+
createLogger(): Logger {
|
|
40
|
+
return new ConsoleLogger();
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
class FileLoggerFactory extends LoggerFactory {
|
|
45
|
+
createLogger(): Logger {
|
|
46
|
+
return new FileLogger();
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
### Abstract Factory
|
|
52
|
+
|
|
53
|
+
**Problem**: Create families of related objects without specifying concrete classes
|
|
54
|
+
**Solution**: Provide interface for creating families of related objects
|
|
55
|
+
|
|
56
|
+
**When to use**:
|
|
57
|
+
- System should be independent of how products are created
|
|
58
|
+
- System should be configured with one of multiple families of products
|
|
59
|
+
- Family of related products should be used together
|
|
60
|
+
|
|
61
|
+
### Singleton
|
|
62
|
+
|
|
63
|
+
**Problem**: Ensure a class has only one instance with global access point
|
|
64
|
+
**Solution**: Private constructor, static instance method
|
|
65
|
+
|
|
66
|
+
**When to use**:
|
|
67
|
+
- Exactly one instance needed (configuration, connection pool)
|
|
68
|
+
- Controlled access to sole instance required
|
|
69
|
+
- Instance should be extensible by subclassing
|
|
70
|
+
|
|
71
|
+
**Caution**: Often considered anti-pattern; prefer dependency injection
|
|
72
|
+
|
|
73
|
+
**Example**:
|
|
74
|
+
```typescript
|
|
75
|
+
class DatabaseConnection {
|
|
76
|
+
private static instance: DatabaseConnection;
|
|
77
|
+
private constructor() { }
|
|
78
|
+
|
|
79
|
+
static getInstance(): DatabaseConnection {
|
|
80
|
+
if (!DatabaseConnection.instance) {
|
|
81
|
+
DatabaseConnection.instance = new DatabaseConnection();
|
|
82
|
+
}
|
|
83
|
+
return DatabaseConnection.instance;
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
```
|
|
87
|
+
|
|
88
|
+
### Builder
|
|
89
|
+
|
|
90
|
+
**Problem**: Construct complex objects step by step
|
|
91
|
+
**Solution**: Separate construction from representation
|
|
92
|
+
|
|
93
|
+
**When to use**:
|
|
94
|
+
- Object creation involves many steps
|
|
95
|
+
- Same construction process should create different representations
|
|
96
|
+
- Avoid telescoping constructors
|
|
97
|
+
|
|
98
|
+
**Example**:
|
|
99
|
+
```typescript
|
|
100
|
+
class QueryBuilder {
|
|
101
|
+
private query = '';
|
|
102
|
+
|
|
103
|
+
select(fields: string[]): this {
|
|
104
|
+
this.query = `SELECT ${fields.join(', ')}`;
|
|
105
|
+
return this;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
from(table: string): this {
|
|
109
|
+
this.query += ` FROM ${table}`;
|
|
110
|
+
return this;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
where(condition: string): this {
|
|
114
|
+
this.query += ` WHERE ${condition}`;
|
|
115
|
+
return this;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
build(): string {
|
|
119
|
+
return this.query;
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
const query = new QueryBuilder()
|
|
124
|
+
.select(['name', 'email'])
|
|
125
|
+
.from('users')
|
|
126
|
+
.where('age > 18')
|
|
127
|
+
.build();
|
|
128
|
+
```
|
|
129
|
+
|
|
130
|
+
### Prototype
|
|
131
|
+
|
|
132
|
+
**Problem**: Create new objects by copying existing ones
|
|
133
|
+
**Solution**: Specify kinds of objects using prototypical instance
|
|
134
|
+
|
|
135
|
+
## Structural Patterns
|
|
136
|
+
|
|
137
|
+
Patterns for composing classes and objects.
|
|
138
|
+
|
|
139
|
+
### Adapter
|
|
140
|
+
|
|
141
|
+
**Problem**: Make incompatible interfaces work together
|
|
142
|
+
**Solution**: Convert interface of class into another interface clients expect
|
|
143
|
+
|
|
144
|
+
**When to use**:
|
|
145
|
+
- Use existing class with incompatible interface
|
|
146
|
+
- Create reusable class cooperating with unrelated classes
|
|
147
|
+
- Need to use several existing subclasses with incompatible interfaces
|
|
148
|
+
|
|
149
|
+
**Example**:
|
|
150
|
+
```typescript
|
|
151
|
+
// Legacy API
|
|
152
|
+
class LegacyLogger {
|
|
153
|
+
logMessage(msg: string) { console.log(msg); }
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
// New interface
|
|
157
|
+
interface ModernLogger {
|
|
158
|
+
log(level: string, message: string): void;
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
// Adapter
|
|
162
|
+
class LoggerAdapter implements ModernLogger {
|
|
163
|
+
constructor(private legacy: LegacyLogger) {}
|
|
164
|
+
|
|
165
|
+
log(level: string, message: string) {
|
|
166
|
+
this.legacy.logMessage(`[${level}] ${message}`);
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
```
|
|
170
|
+
|
|
171
|
+
### Decorator
|
|
172
|
+
|
|
173
|
+
**Problem**: Add responsibilities to objects dynamically
|
|
174
|
+
**Solution**: Wrap object in decorator that adds behavior
|
|
175
|
+
|
|
176
|
+
**When to use**:
|
|
177
|
+
- Add responsibilities to individual objects dynamically
|
|
178
|
+
- Responsibilities can be withdrawn
|
|
179
|
+
- Extension by subclassing is impractical
|
|
180
|
+
|
|
181
|
+
**Example**:
|
|
182
|
+
```typescript
|
|
183
|
+
interface Coffee {
|
|
184
|
+
cost(): number;
|
|
185
|
+
description(): string;
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
class SimpleCoffee implements Coffee {
|
|
189
|
+
cost() { return 5; }
|
|
190
|
+
description() { return 'Simple coffee'; }
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
class MilkDecorator implements Coffee {
|
|
194
|
+
constructor(private coffee: Coffee) {}
|
|
195
|
+
cost() { return this.coffee.cost() + 2; }
|
|
196
|
+
description() { return this.coffee.description() + ', milk'; }
|
|
197
|
+
}
|
|
198
|
+
|
|
199
|
+
class SugarDecorator implements Coffee {
|
|
200
|
+
constructor(private coffee: Coffee) {}
|
|
201
|
+
cost() { return this.coffee.cost() + 1; }
|
|
202
|
+
description() { return this.coffee.description() + ', sugar'; }
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
const coffee = new SugarDecorator(new MilkDecorator(new SimpleCoffee()));
|
|
206
|
+
// Cost: 8, Description: "Simple coffee, milk, sugar"
|
|
207
|
+
```
|
|
208
|
+
|
|
209
|
+
### Facade
|
|
210
|
+
|
|
211
|
+
**Problem**: Provide simplified interface to complex subsystem
|
|
212
|
+
**Solution**: Higher-level interface that makes subsystem easier to use
|
|
213
|
+
|
|
214
|
+
**When to use**:
|
|
215
|
+
- Simplify complex subsystem
|
|
216
|
+
- Layer your subsystems
|
|
217
|
+
- Reduce coupling between subsystems
|
|
218
|
+
|
|
219
|
+
### Proxy
|
|
220
|
+
|
|
221
|
+
**Problem**: Provide surrogate or placeholder for another object
|
|
222
|
+
**Solution**: Control access to the original object
|
|
223
|
+
|
|
224
|
+
**When to use**:
|
|
225
|
+
- Lazy initialization (virtual proxy)
|
|
226
|
+
- Access control (protection proxy)
|
|
227
|
+
- Remote object access (remote proxy)
|
|
228
|
+
- Caching (cache proxy)
|
|
229
|
+
|
|
230
|
+
### Composite
|
|
231
|
+
|
|
232
|
+
**Problem**: Treat individual objects and compositions uniformly
|
|
233
|
+
**Solution**: Compose objects into tree structures
|
|
234
|
+
|
|
235
|
+
## Behavioral Patterns
|
|
236
|
+
|
|
237
|
+
Patterns for communication between objects.
|
|
238
|
+
|
|
239
|
+
### Strategy
|
|
240
|
+
|
|
241
|
+
**Problem**: Define family of algorithms, make them interchangeable
|
|
242
|
+
**Solution**: Encapsulate each algorithm, make them interchangeable
|
|
243
|
+
|
|
244
|
+
**When to use**:
|
|
245
|
+
- Many related classes differ only in behavior
|
|
246
|
+
- Need different variants of algorithm
|
|
247
|
+
- Algorithm uses data clients shouldn't know about
|
|
248
|
+
- Class defines many behaviors as conditional statements
|
|
249
|
+
|
|
250
|
+
**Example**:
|
|
251
|
+
```typescript
|
|
252
|
+
interface PaymentStrategy {
|
|
253
|
+
pay(amount: number): void;
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
class CreditCardPayment implements PaymentStrategy {
|
|
257
|
+
pay(amount: number) {
|
|
258
|
+
console.log(`Paid ${amount} with credit card`);
|
|
259
|
+
}
|
|
260
|
+
}
|
|
261
|
+
|
|
262
|
+
class PayPalPayment implements PaymentStrategy {
|
|
263
|
+
pay(amount: number) {
|
|
264
|
+
console.log(`Paid ${amount} with PayPal`);
|
|
265
|
+
}
|
|
266
|
+
}
|
|
267
|
+
|
|
268
|
+
class ShoppingCart {
|
|
269
|
+
constructor(private paymentStrategy: PaymentStrategy) {}
|
|
270
|
+
|
|
271
|
+
checkout(amount: number) {
|
|
272
|
+
this.paymentStrategy.pay(amount);
|
|
273
|
+
}
|
|
274
|
+
}
|
|
275
|
+
```
|
|
276
|
+
|
|
277
|
+
### Observer
|
|
278
|
+
|
|
279
|
+
**Problem**: Define one-to-many dependency between objects
|
|
280
|
+
**Solution**: When one object changes state, all dependents are notified
|
|
281
|
+
|
|
282
|
+
**When to use**:
|
|
283
|
+
- Change to one object requires changing others
|
|
284
|
+
- Object should notify others without assumptions about who they are
|
|
285
|
+
- Abstraction has two aspects, one dependent on the other
|
|
286
|
+
|
|
287
|
+
**Example**:
|
|
288
|
+
```typescript
|
|
289
|
+
interface Observer {
|
|
290
|
+
update(data: any): void;
|
|
291
|
+
}
|
|
292
|
+
|
|
293
|
+
class Subject {
|
|
294
|
+
private observers: Observer[] = [];
|
|
295
|
+
|
|
296
|
+
attach(observer: Observer) {
|
|
297
|
+
this.observers.push(observer);
|
|
298
|
+
}
|
|
299
|
+
|
|
300
|
+
notify(data: any) {
|
|
301
|
+
this.observers.forEach(obs => obs.update(data));
|
|
302
|
+
}
|
|
303
|
+
}
|
|
304
|
+
|
|
305
|
+
class DataLogger implements Observer {
|
|
306
|
+
update(data: any) {
|
|
307
|
+
console.log('Data logged:', data);
|
|
308
|
+
}
|
|
309
|
+
}
|
|
310
|
+
|
|
311
|
+
class DataDisplay implements Observer {
|
|
312
|
+
update(data: any) {
|
|
313
|
+
console.log('Data displayed:', data);
|
|
314
|
+
}
|
|
315
|
+
}
|
|
316
|
+
```
|
|
317
|
+
|
|
318
|
+
### Command
|
|
319
|
+
|
|
320
|
+
**Problem**: Encapsulate request as object
|
|
321
|
+
**Solution**: Parameterize clients with different requests, queue/log requests
|
|
322
|
+
|
|
323
|
+
**When to use**:
|
|
324
|
+
- Parameterize objects with actions
|
|
325
|
+
- Specify, queue, and execute requests at different times
|
|
326
|
+
- Support undo
|
|
327
|
+
- Support logging changes
|
|
328
|
+
|
|
329
|
+
### Template Method
|
|
330
|
+
|
|
331
|
+
**Problem**: Define skeleton of algorithm, let subclasses override steps
|
|
332
|
+
**Solution**: Define algorithm structure, defer some steps to subclasses
|
|
333
|
+
|
|
334
|
+
**When to use**:
|
|
335
|
+
- Implement invariant parts of algorithm once
|
|
336
|
+
- Common behavior among subclasses should be factored
|
|
337
|
+
- Control subclass extensions
|
|
338
|
+
|
|
339
|
+
### Iterator
|
|
340
|
+
|
|
341
|
+
**Problem**: Access elements of aggregate object sequentially without exposing representation
|
|
342
|
+
**Solution**: Provide way to access elements without exposing structure
|
|
343
|
+
|
|
344
|
+
### State
|
|
345
|
+
|
|
346
|
+
**Problem**: Allow object to alter behavior when internal state changes
|
|
347
|
+
**Solution**: Object appears to change its class
|
|
348
|
+
|
|
349
|
+
### Chain of Responsibility
|
|
350
|
+
|
|
351
|
+
**Problem**: Avoid coupling sender to receiver
|
|
352
|
+
**Solution**: Give more than one object chance to handle request
|
|
353
|
+
|
|
354
|
+
## Pattern Selection Guide
|
|
355
|
+
|
|
356
|
+
### Choosing the Right Pattern
|
|
357
|
+
|
|
358
|
+
**Creating Objects:**
|
|
359
|
+
- Simple object creation → Factory Method
|
|
360
|
+
- Family of related objects → Abstract Factory
|
|
361
|
+
- Complex construction → Builder
|
|
362
|
+
- Copy existing object → Prototype
|
|
363
|
+
- Single instance → Singleton
|
|
364
|
+
|
|
365
|
+
**Structuring Code:**
|
|
366
|
+
- Incompatible interfaces → Adapter
|
|
367
|
+
- Add behavior dynamically → Decorator
|
|
368
|
+
- Simplify complex system → Facade
|
|
369
|
+
- Control access → Proxy
|
|
370
|
+
- Tree structure → Composite
|
|
371
|
+
|
|
372
|
+
**Defining Behavior:**
|
|
373
|
+
- Interchangeable algorithms → Strategy
|
|
374
|
+
- Notify multiple objects → Observer
|
|
375
|
+
- Encapsulate requests → Command
|
|
376
|
+
- Algorithm skeleton → Template Method
|
|
377
|
+
- Sequential access → Iterator
|
|
378
|
+
- State-based behavior → State
|
|
379
|
+
- Chain of handlers → Chain of Responsibility
|
|
380
|
+
|
|
381
|
+
## Anti-patterns to Avoid
|
|
382
|
+
|
|
383
|
+
### Pattern Overuse
|
|
384
|
+
- Don't force patterns where they don't fit
|
|
385
|
+
- Simpler solutions often better
|
|
386
|
+
- Patterns add complexity and abstraction
|
|
387
|
+
|
|
388
|
+
### Singleton Abuse
|
|
389
|
+
- Global state is problematic
|
|
390
|
+
- Tight coupling
|
|
391
|
+
- Difficult to test
|
|
392
|
+
- Consider dependency injection instead
|
|
393
|
+
|
|
394
|
+
### God Object
|
|
395
|
+
- Object that knows/does too much
|
|
396
|
+
- Violates Single Responsibility Principle
|
|
397
|
+
- Hard to maintain and test
|
|
398
|
+
|
|
399
|
+
### Premature Optimization
|
|
400
|
+
- Don't optimize before measuring
|
|
401
|
+
- Pattern complexity should solve real problems
|
|
402
|
+
- YAGNI (You Aren't Gonna Need It)
|
|
403
|
+
|
|
404
|
+
## Best Practices
|
|
405
|
+
|
|
406
|
+
1. **Understand the Problem First**
|
|
407
|
+
- Identify the actual problem
|
|
408
|
+
- Consider simpler solutions
|
|
409
|
+
- Pattern should solve real need
|
|
410
|
+
|
|
411
|
+
2. **Know the Trade-offs**
|
|
412
|
+
- Every pattern adds complexity
|
|
413
|
+
- Balance flexibility vs. simplicity
|
|
414
|
+
- Consider maintainability
|
|
415
|
+
|
|
416
|
+
3. **Use Patterns as Communication**
|
|
417
|
+
- Shared vocabulary
|
|
418
|
+
- Document intent
|
|
419
|
+
- Aid team understanding
|
|
420
|
+
|
|
421
|
+
4. **Refactor to Patterns**
|
|
422
|
+
- Don't design patterns upfront
|
|
423
|
+
- Let patterns emerge
|
|
424
|
+
- Refactor when pattern becomes clear
|
|
425
|
+
|
|
426
|
+
5. **Combine Patterns**
|
|
427
|
+
- Patterns often work together
|
|
428
|
+
- Strategy + Factory Method
|
|
429
|
+
- Decorator + Composite
|
|
430
|
+
- Observer + Mediator
|
|
431
|
+
|
|
432
|
+
## Further Reading
|
|
433
|
+
|
|
434
|
+
- "Design Patterns: Elements of Reusable Object-Oriented Software" by Gang of Four
|
|
435
|
+
- "Head First Design Patterns" by Freeman et al.
|
|
436
|
+
- "Patterns of Enterprise Application Architecture" by Martin Fowler
|
|
437
|
+
- "Refactoring to Patterns" by Joshua Kerievsky
|
|
@@ -0,0 +1,126 @@
|
|
|
1
|
+
# Design System Implementation
|
|
2
|
+
|
|
3
|
+
## Overview
|
|
4
|
+
Implement and maintain consistent design systems using tokens, components, and documentation. Ensure brand consistency and developer efficiency across the application.
|
|
5
|
+
|
|
6
|
+
## Core Concepts
|
|
7
|
+
|
|
8
|
+
### Design Tokens
|
|
9
|
+
Centralized design decisions (colors, typography, spacing) as code.
|
|
10
|
+
|
|
11
|
+
**Token Categories**:
|
|
12
|
+
- Colors (primary, secondary, success, danger)
|
|
13
|
+
- Spacing (xs, sm, md, lg, xl)
|
|
14
|
+
- Typography (font families, sizes)
|
|
15
|
+
- Breakpoints (mobile, tablet, desktop)
|
|
16
|
+
|
|
17
|
+
### Theme System
|
|
18
|
+
- Light/Dark theme support
|
|
19
|
+
- Consistent color schemes
|
|
20
|
+
- Themeable components
|
|
21
|
+
- Runtime theme switching
|
|
22
|
+
|
|
23
|
+
## Component Library Structure
|
|
24
|
+
|
|
25
|
+
```
|
|
26
|
+
/design-system
|
|
27
|
+
/tokens
|
|
28
|
+
colors.ts
|
|
29
|
+
spacing.ts
|
|
30
|
+
typography.ts
|
|
31
|
+
/components
|
|
32
|
+
/Button
|
|
33
|
+
Button.tsx
|
|
34
|
+
Button.test.tsx
|
|
35
|
+
Button.stories.tsx
|
|
36
|
+
/Input
|
|
37
|
+
/Card
|
|
38
|
+
/hooks
|
|
39
|
+
useTheme.ts
|
|
40
|
+
/utils
|
|
41
|
+
themed.ts
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
## Best Practices
|
|
45
|
+
|
|
46
|
+
### 1. Use Design Tokens
|
|
47
|
+
- Reference tokens, not magic values
|
|
48
|
+
- Maintain consistency across app
|
|
49
|
+
- Single source of truth
|
|
50
|
+
|
|
51
|
+
### 2. Variant System
|
|
52
|
+
- Consistent variants (primary, secondary, ghost)
|
|
53
|
+
- Size variants (sm, md, lg)
|
|
54
|
+
- Type-safe props
|
|
55
|
+
|
|
56
|
+
### 3. Component Composition
|
|
57
|
+
- Build complex components from simpler ones
|
|
58
|
+
- Reusable building blocks
|
|
59
|
+
- Clear component hierarchy
|
|
60
|
+
|
|
61
|
+
### 4. Accessibility First
|
|
62
|
+
- Include ARIA attributes
|
|
63
|
+
- Keyboard navigation
|
|
64
|
+
- Screen reader support
|
|
65
|
+
- Color contrast compliance
|
|
66
|
+
|
|
67
|
+
### 5. Responsive Design
|
|
68
|
+
- Use responsive tokens
|
|
69
|
+
- Breakpoint consistency
|
|
70
|
+
- Mobile-first approach
|
|
71
|
+
|
|
72
|
+
### 6. Documentation
|
|
73
|
+
- Storybook for components
|
|
74
|
+
- Usage examples
|
|
75
|
+
- Props documentation
|
|
76
|
+
- Visual regression tests
|
|
77
|
+
|
|
78
|
+
## Do's ✅
|
|
79
|
+
|
|
80
|
+
- Use design tokens consistently
|
|
81
|
+
- Create variant systems for flexibility
|
|
82
|
+
- Document all components in Storybook
|
|
83
|
+
- Test accessibility requirements
|
|
84
|
+
- Maintain component library structure
|
|
85
|
+
- Version components properly
|
|
86
|
+
|
|
87
|
+
## Don'ts ❌
|
|
88
|
+
|
|
89
|
+
### Inconsistent Spacing
|
|
90
|
+
Avoid random spacing values—use spacing scale
|
|
91
|
+
|
|
92
|
+
### Hardcoded Colors
|
|
93
|
+
Use semantic color names from tokens
|
|
94
|
+
|
|
95
|
+
### Component Duplication
|
|
96
|
+
Single component with variants > multiple implementations
|
|
97
|
+
|
|
98
|
+
### Missing Documentation
|
|
99
|
+
Every component needs Storybook stories
|
|
100
|
+
|
|
101
|
+
## Component Checklist
|
|
102
|
+
|
|
103
|
+
- [ ] Uses design tokens
|
|
104
|
+
- [ ] Has variant system
|
|
105
|
+
- [ ] TypeScript interfaces defined
|
|
106
|
+
- [ ] Accessibility attributes included
|
|
107
|
+
- [ ] Responsive design implemented
|
|
108
|
+
- [ ] Storybook stories created
|
|
109
|
+
- [ ] Unit tests written
|
|
110
|
+
- [ ] Visual regression tests
|
|
111
|
+
- [ ] Documentation complete
|
|
112
|
+
- [ ] Breaking changes versioned
|
|
113
|
+
|
|
114
|
+
## Tools
|
|
115
|
+
|
|
116
|
+
- **Storybook**: Component documentation and testing
|
|
117
|
+
- **Styled Components / Tailwind**: Styling solutions
|
|
118
|
+
- **Figma**: Design source of truth
|
|
119
|
+
- **Chromatic**: Visual regression testing
|
|
120
|
+
|
|
121
|
+
## Resources
|
|
122
|
+
|
|
123
|
+
- [Material Design System](https://m3.material.io/)
|
|
124
|
+
- [Ant Design](https://ant.design/)
|
|
125
|
+
- [Chakra UI](https://chakra-ui.com/)
|
|
126
|
+
- [Radix UI](https://www.radix-ui.com/)
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
# Documentation Ability
|
|
2
|
+
|
|
3
|
+
Create clear, comprehensive, and useful documentation.
|
|
4
|
+
|
|
5
|
+
## Documentation Types
|
|
6
|
+
|
|
7
|
+
1. **API Documentation**
|
|
8
|
+
- Function/method signatures
|
|
9
|
+
- Parameters and return values
|
|
10
|
+
- Usage examples
|
|
11
|
+
- Error conditions
|
|
12
|
+
|
|
13
|
+
2. **README Files**
|
|
14
|
+
- Project overview
|
|
15
|
+
- Installation instructions
|
|
16
|
+
- Quick start guide
|
|
17
|
+
- Links to detailed docs
|
|
18
|
+
|
|
19
|
+
3. **User Guides**
|
|
20
|
+
- Feature explanations
|
|
21
|
+
- Step-by-step tutorials
|
|
22
|
+
- Screenshots and diagrams
|
|
23
|
+
- Troubleshooting section
|
|
24
|
+
|
|
25
|
+
4. **Technical Specifications**
|
|
26
|
+
- Architecture overview
|
|
27
|
+
- Design decisions
|
|
28
|
+
- System requirements
|
|
29
|
+
- API contracts
|
|
30
|
+
|
|
31
|
+
5. **Code Comments**
|
|
32
|
+
- Explain why (not what)
|
|
33
|
+
- Document complex logic
|
|
34
|
+
- Add TODOs and FIXMEs
|
|
35
|
+
- Use JSDoc/docstrings
|
|
36
|
+
|
|
37
|
+
## Writing Principles
|
|
38
|
+
|
|
39
|
+
- **Clarity**: Use simple, direct language
|
|
40
|
+
- **Completeness**: Cover all necessary information
|
|
41
|
+
- **Accuracy**: Keep docs up to date
|
|
42
|
+
- **Usability**: Structure for easy navigation
|
|
43
|
+
- **Examples**: Show, don't just tell
|
|
44
|
+
|
|
45
|
+
## Documentation Checklist
|
|
46
|
+
|
|
47
|
+
- [ ] Project purpose clear
|
|
48
|
+
- [ ] Installation steps complete
|
|
49
|
+
- [ ] Usage examples included
|
|
50
|
+
- [ ] API documented
|
|
51
|
+
- [ ] Configuration options explained
|
|
52
|
+
- [ ] Troubleshooting guide provided
|
|
53
|
+
- [ ] Links to related resources
|
|
54
|
+
- [ ] Version/changelog maintained
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
# Error Analysis Ability
|
|
2
|
+
|
|
3
|
+
Analyze and understand error messages to find solutions.
|
|
4
|
+
|
|
5
|
+
## Error Analysis Process
|
|
6
|
+
|
|
7
|
+
1. **Read the Error Carefully**
|
|
8
|
+
- Full error message
|
|
9
|
+
- Error code/type
|
|
10
|
+
- Stack trace
|
|
11
|
+
- Context information
|
|
12
|
+
|
|
13
|
+
2. **Identify Error Type**
|
|
14
|
+
- Syntax error (typo, missing character)
|
|
15
|
+
- Runtime error (execution failure)
|
|
16
|
+
- Logic error (wrong output)
|
|
17
|
+
- Configuration error (missing setup)
|
|
18
|
+
|
|
19
|
+
3. **Locate the Source**
|
|
20
|
+
- File name and line number
|
|
21
|
+
- Stack trace (call chain)
|
|
22
|
+
- Relevant code section
|
|
23
|
+
- Recent changes
|
|
24
|
+
|
|
25
|
+
4. **Understand the Cause**
|
|
26
|
+
- What was the code trying to do?
|
|
27
|
+
- Why did it fail?
|
|
28
|
+
- What assumption was wrong?
|
|
29
|
+
- What conditions triggered it?
|
|
30
|
+
|
|
31
|
+
5. **Research if Needed**
|
|
32
|
+
- Search error message
|
|
33
|
+
- Check documentation
|
|
34
|
+
- Review similar issues
|
|
35
|
+
- Ask for help (with context)
|
|
36
|
+
|
|
37
|
+
## Common Error Patterns
|
|
38
|
+
|
|
39
|
+
### Null/Undefined Errors
|
|
40
|
+
|
|
41
|
+
```
|
|
42
|
+
TypeError: Cannot read property 'x' of undefined
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
- Cause: Accessing property on null/undefined
|
|
46
|
+
- Fix: Check if object exists first
|
|
47
|
+
- Prevention: Use optional chaining (?.)
|
|
48
|
+
|
|
49
|
+
### Type Errors
|
|
50
|
+
|
|
51
|
+
```
|
|
52
|
+
TypeError: 'int' object is not callable
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
- Cause: Using wrong type for operation
|
|
56
|
+
- Fix: Convert type or use correct type
|
|
57
|
+
- Prevention: Type annotations, validation
|
|
58
|
+
|
|
59
|
+
### Import/Module Errors
|
|
60
|
+
|
|
61
|
+
```
|
|
62
|
+
ModuleNotFoundError: No module named 'x'
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
- Cause: Missing dependency or wrong path
|
|
66
|
+
- Fix: Install dependency or fix import path
|
|
67
|
+
- Prevention: Requirements file, path checks
|
|
68
|
+
|
|
69
|
+
### Network Errors
|
|
70
|
+
|
|
71
|
+
```
|
|
72
|
+
ConnectionError: Connection refused
|
|
73
|
+
```
|
|
74
|
+
|
|
75
|
+
- Cause: Service not running, wrong address, firewall
|
|
76
|
+
- Fix: Start service, check URL, check network
|
|
77
|
+
- Prevention: Health checks, retry logic
|
|
78
|
+
|
|
79
|
+
### Permission Errors
|
|
80
|
+
|
|
81
|
+
```
|
|
82
|
+
PermissionError: Permission denied
|
|
83
|
+
```
|
|
84
|
+
|
|
85
|
+
- Cause: Insufficient file/resource permissions
|
|
86
|
+
- Fix: Grant permissions or run as correct user
|
|
87
|
+
- Prevention: Check permissions, use appropriate user
|
|
88
|
+
|
|
89
|
+
## Error Message Anatomy
|
|
90
|
+
|
|
91
|
+
```
|
|
92
|
+
TypeError: Cannot read property 'name' of undefined
|
|
93
|
+
at getUserName (app.js:42:18)
|
|
94
|
+
at handleRequest (app.js:15:10)
|
|
95
|
+
at Server.<anonymous> (app.js:8:5)
|
|
96
|
+
```
|
|
97
|
+
|
|
98
|
+
Parts:
|
|
99
|
+
|
|
100
|
+
1. **Error Type**: TypeError
|
|
101
|
+
2. **Error Message**: Cannot read property 'name' of undefined
|
|
102
|
+
3. **Stack Trace**: Call chain showing where error occurred
|
|
103
|
+
4. **Location**: app.js:42:18 (file:line:column)
|
|
104
|
+
|
|
105
|
+
## Debugging Workflow
|
|
106
|
+
|
|
107
|
+
1. Read error → 2. Identify location → 3. Examine code → 4. Form hypothesis → 5. Add logging → 6. Test fix → 7. Verify solution
|