React Patterns MCP Server

patterns.dev/react'taki tüm Design ve Rendering Pattern'leri Claude Code'a araç ve kaynak olarak sunan MCP server'ı.

Kapsanan Pattern'ler

🎨 Design Patterns

ID	Pattern
hoc-pattern	Higher-Order Component (HOC)
hooks-pattern	Hooks Pattern
compound-pattern	Compound Pattern
container-presentational-pattern	Container/Presentational
render-props-pattern	Render Props

⚙️ Rendering Patterns

ID	Pattern
client-side-rendering	CSR
server-side-rendering	SSR
static-rendering	Static Rendering (SSG)
incremental-static-rendering	ISR
progressive-hydration	Progressive Hydration
streaming-ssr	Streaming SSR
react-server-components	React Server Components (RSC)
selective-hydration	Selective Hydration

Kurulum

# 1. Bağımlılıkları yükle
pip install mcp[cli]

# 2. Geliştirme modunda test et (tarayıcı arayüzü açılır)
mcp dev src/server.py

# 3. Claude Desktop'a kaydet
mcp install src/server.py --name "react-patterns"

Claude Code ile Kullanım

.claude/mcp.json veya claude_desktop_config.json'a ekle:

{
  "mcpServers": {
    "react-patterns": {
      "command": "python",
      "args": ["-m", "src.server"],
      "cwd": "/path/to/react-patterns-mcp"
    }
  }
}

Araçlar (Tools)

Araç	Açıklama
list_all_patterns	Tüm pattern'leri listeler
list_design_patterns	Sadece design pattern'leri
list_rendering_patterns	Sadece rendering pattern'leri
get_pattern(id)	Bir pattern'in tam detayı
compare_patterns([id1, id2])	Pattern'leri karşılaştırır
find_pattern_for_use_case(açıklama)	Kullanım senaryosuna göre öneri
get_pattern_tradeoffs(id)	Hızlı trade-off özeti
get_related_patterns(id)	İlişkili pattern'ler

Kaynaklar (Resources)

URI	İçerik
patterns://all	Tüm pattern özeti
patterns://design	Design pattern'ler
patterns://rendering	Rendering pattern'ler
patterns://detail/{id}	Tekil pattern detayı

Mimari

react-patterns-mcp/
├── src/
│   ├── server.py          # MCP katmanı — araçlar ve kaynaklar
│   └── patterns/
│       ├── registry.py    # Pattern veri modeli ve veritabanı
│       └── formatter.py   # Markdown çıktı formatlama
├── pyproject.toml
└── README.md

Katman ayrımı:

• registry.py — veri, iş mantığı yok
• formatter.py — sunum mantığı, MCP bilgisi yok
• server.py — yalnızca MCP bağlama katmanı