跳到正文
cccskills
免费在 GitHub 公开

design-patterns

Apply Gang of Four design patterns to solve architectural problems in TypeScript. Use when refactoring code architecture, implementing extensible systems, decoupling components, or following SOLID principles. Covers all 22 GoF patterns: Creational (Factory Method, Abstract Factory, Builder, Prototype, Singleton), Structural (Adapter, Bridge, Composite, Decorator, Facade, Flyweight, Proxy), and Behavioral (Chain of Responsibility, Command, Iterator, Mediator, Memento, Observer, State, Strategy, Template Method, Visitor).

中文简介正在准备中。当前显示原文说明。

查看安装方法

包含的文件(4)

  • SKILL.md7.5 KB
  • references/BEHAVIORAL.md23.9 KB
  • references/CREATIONAL.md10.5 KB
  • references/STRUCTURAL.md15.1 KB

SKILL.md(原文)

安装前可以查看交给 AI 代理的指令内容。

Design Patterns

Proven architectural patterns for building maintainable, extensible, and testable TypeScript codebases. All 22 Gang of Four patterns with practical implementations.

When to Apply

Reference these patterns when:

  • Solving recurring architectural problems
  • Refactoring tightly coupled code
  • Building plugin/extension systems
  • Making code more testable via dependency injection
  • Reviewing PRs with architectural concerns
  • Choosing between inheritance and composition

Pattern Categories

Creational Patterns

Create objects flexibly, hiding creation logic from consumers.

PatternIntent
Factory MethodDelegate object creation to subclasses
Abstract FactoryCreate families of related objects without concrete types
BuilderConstruct complex objects step-by-step
PrototypeClone existing objects instead of building from scratch
SingletonEnsure exactly one instance with global access

See references/CREATIONAL.md for implementations.

Structural Patterns

Compose classes and objects into larger, flexible structures.

PatternIntent
AdapterMake incompatible interfaces work together
BridgeSeparate abstraction from implementation
CompositeTreat individual objects and compositions uniformly
DecoratorAttach responsibilities dynamically without subclassing
FacadeSimplify complex subsystem with a unified interface
FlyweightShare common state to reduce memory across many objects
ProxyControl access to an object through a substitute

See references/STRUCTURAL.md for implementations.

Behavioral Patterns

Manage algorithms, responsibilities, and communication between objects.

PatternIntent
Chain of ResponsibilityPass requests along a handler chain
CommandEncapsulate requests as objects for queuing/undo
IteratorTraverse collections without exposing internals
MediatorCentralize complex communication between objects
MementoCapture and restore object state
ObserverNotify dependents automatically on state changes
StateAlter behavior when internal state changes
StrategySwap algorithms at runtime
Template MethodDefine algorithm skeleton, let subclasses override steps
VisitorAdd operations to objects without modifying them

See references/BEHAVIORAL.md for implementations.

Pattern Selection Guide

ProblemPattern(s)
Need to decouple object creationFactory Method, Abstract Factory
Complex object with many optional fieldsBuilder
Expensive object creation, need copiesPrototype
Global shared resource (config, pool)Singleton
Incompatible third-party interfaceAdapter
Multiple dimensions of variationBridge
Tree structures (files, UI, org charts)Composite
Add features without subclassingDecorator
Simplify complex API surfaceFacade
Thousands of similar objects, memory heavyFlyweight
Lazy loading, access control, cachingProxy
Flexible request processing pipelineChain of Responsibility
Undo/redo, task queues, macrosCommand
Custom collection traversalIterator
Many-to-many object communicationMediator
Snapshots, save/restore stateMemento
Event systems, reactive updatesObserver
Object behavior depends on its stateState
Swappable algorithms (sort, compress, etc)Strategy
Algorithm with fixed steps, variable partsTemplate Method
Operations across heterogeneous objectsVisitor

Best Practices

DO

  • Choose patterns that solve actual problems you're facing now
  • Prefer composition over inheritance
  • Use dependency injection to decouple components
  • Keep pattern implementations simple — avoid gold-plating
  • Document why a pattern was chosen (not just which one)
  • Consider testability when choosing patterns
  • Combine patterns when appropriate (e.g., Strategy + Factory)

DON'T

  • Apply patterns preemptively for hypothetical future needs
  • Force a pattern where a simple function/object suffices
  • Create unnecessary abstraction layers
  • Use Singleton as a disguised global variable
  • Choose inheritance when composition works better
  • Ignore team familiarity — a simpler pattern everyone knows beats a "better" one nobody understands

SOLID Quick Reference

PrincipleSummaryRelated Patterns
Single ResponsibilityOne class, one reason to changeStrategy, Command, Observer
Open/ClosedOpen for extension, closed for modificationDecorator, Strategy, Template Method
Liskov SubstitutionSubtypes must be substitutable for base typesFactory Method, Abstract Factory
Interface SegregationPrefer small, focused interfacesAdapter, Facade
Dependency InversionDepend on abstractions, not concretionsAll patterns using interfaces/abstract

评价

还没有评价。欢迎分享你的使用感受。

评论

无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

提交后会立即公开。请勿填写邮箱、电话等个人信息。URL 最多 2 个。

0 / 1000 字

此表单受 reCAPTCHA 保护,适用 Google 的隐私权政策和服务条款。

同一仓库的技能

Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, or automating any browser task. Triggers include requests to "open a website", "fill out a form", "click a button", "take a screenshot", "scrape data from a page", "test this web app", "login to a site", "automate browser actions", or any task requiring programmatic web interaction.

中文简介正在准备中。当前显示原文说明。

fellipeutaka/denji62026年8月3日 更新

Set up and optimize repositories for AI coding agents. Creates minimal AGENTS.md, CLAUDE.md symlink, docs/REQUIREMENTS.md, docs/BUSINESS-RULES.md, feedback loops, and deterministic enforcement (Claude Code hooks, OpenCode plugins). Use when user wants to make a repo AI-friendly, set up AGENTS.md/CLAUDE.md, document requirements/business rules for AI, add pre-commit hooks for AI workflows, or optimize codebase structure for coding agents.

中文简介正在准备中。当前显示原文说明。

fellipeutaka/denji62026年8月3日 更新

bun

免费

Bun runtime, package manager, bundler, and test runner. Use when running scripts with bun, managing packages, serving HTTP with Bun.serve, querying databases with Bun.sql/bun:sqlite/Bun.redis, shell scripting with $, using S3/file I/O, writing tests with bun:test, bundling or compiling to executable, or using any Bun-specific API (spawn, glob, semver, FFI, workers, plugins, HTMLRewriter).

中文简介正在准备中。当前显示原文说明。

fellipeutaka/denji62026年8月3日 更新

Write clean, readable, and maintainable code following principles from Robert C. Martin's "Clean Code" and Object Calisthenics. Use when writing, reviewing, or refactoring code to improve naming, function design, formatting, error handling, and class structure. Includes code smell detection and refactoring guidance.

中文简介正在准备中。当前显示原文说明。

fellipeutaka/denji62026年8月3日 更新

Create high-quality git commits: review/stage intended changes, split into logical commits, and write clear commit messages (including Conventional Commits). Use when the user asks to commit, craft a commit message, stage changes, or split work into multiple commits.

中文简介正在准备中。当前显示原文说明。

fellipeutaka/denji62026年8月3日 更新

denji

免费

Manage SVG icons as framework components using Denji CLI. Use when the user needs to add, remove, list, export, import, or manage SVG icons in React, Preact, Solid, Qwik, Vue, or Svelte projects. Triggers include requests to "add an icon", "set up icons", "manage SVG icons", "remove an icon", "list icons", "export icons", "import icons", "dry-run icon add", or any task involving Iconify icons as framework components.

中文简介正在准备中。当前显示原文说明。

fellipeutaka/denji62026年8月3日 更新

查看 fellipeutaka 的全部技能

报告此技能的问题