@gherk/reactive-architecture 1.0.0

package/README.md

@@ -0,0 +1,151 @@
+# Reactive Frontend MCP Server
+
+An MCP (Model Context Protocol) server that teaches AI assistants a **framework-agnostic reactive frontend architecture philosophy**: `Component → Store → Service`.
+
+Add this server to any project — Angular, React, Vue, Svelte, or anything else — and the AI will always structure frontend code following the same reactive pattern.
+
+## Philosophy
+
+Every frontend feature follows three clearly separated layers:
+
+```
+Component → Store → Service
+   (UI)    (State)  (Data Access)
+```
+
+- **Component**: Only presentation + user interaction. Reads from store, dispatches actions.
+- **Store**: Single source of truth. Manages state (loading/error/data). Contains business logic.
+- **Service**: Pure data access. HTTP/WebSocket/storage. Stateless, no logic.
+
+## Installation
+
+```bash
+cd mcp
+npm install
+npm run build
+```
+
+## Configuration
+
+### Claude Desktop
+
+Add to `~/Library/Application Support/Claude/claude_desktop_config.json`:
+
+```json
+{
+  "mcpServers": {
+    "reactive-frontend": {
+      "command": "node",
+      "args": ["/ABSOLUTE/PATH/TO/mcp/dist/index.js"]
+    }
+  }
+}
+```
+
+### Cursor
+
+Add to `.cursor/mcp.json` in your project root:
+
+```json
+{
+  "mcpServers": {
+    "reactive-frontend": {
+      "command": "node",
+      "args": ["/ABSOLUTE/PATH/TO/mcp/dist/index.js"]
+    }
+  }
+}
+```
+
+### VS Code (Copilot)
+
+Add to `.vscode/mcp.json`:
+
+```json
+{
+  "servers": {
+    "reactive-frontend": {
+      "command": "node",
+      "args": ["/ABSOLUTE/PATH/TO/mcp/dist/index.js"]
+    }
+  }
+}
+```
+
+### Gemini CLI
+
+Add to `~/.gemini/settings.json`:
+
+```json
+{
+  "mcpServers": {
+    "reactive-frontend": {
+      "command": "node",
+      "args": ["/ABSOLUTE/PATH/TO/mcp/dist/index.js"]
+    }
+  }
+}
+```
+
+## Available Tools
+
+| Tool | Description |
+|------|-------------|
+| `get_architecture_guide` | Returns the complete reactive architecture philosophy (or a specific section) |
+| `generate_scaffold` | Generates file scaffolds for a feature in any framework |
+| `validate_architecture` | Validates if a proposed structure follows the reactive pattern |
+| `get_framework_example` | Returns concrete, copy-paste-ready examples per framework |
+
+### `get_architecture_guide`
+
+```
+Sections: overview, component, store, service, anti-patterns, file-structure, implementation-flow
+```
+
+### `generate_scaffold`
+
+```
+Params:
+  - feature_name: "user management"
+  - framework: angular | react | vue | svelte
+  - operations: [list, detail, create, update, delete]
+```
+
+### `validate_architecture`
+
+```
+Params:
+  - description: "The component fetches users directly from the API..."
+```
+
+### `get_framework_example`
+
+```
+Params:
+  - framework: angular | react | vue | svelte
+  - pattern: list | detail | form | crud
+```
+
+## Available Resources
+
+| Resource URI | Description |
+|-------------|-------------|
+| `reactive://philosophy` | Complete philosophy document as markdown |
+
+## Available Prompts
+
+| Prompt | Description |
+|--------|-------------|
+| `plan_feature` | Structured template for planning a feature with Component → Store → Service decomposition |
+
+## Development
+
+```bash
+npm run dev    # Watch mode (recompiles on changes)
+npm run build  # Production build
+npm start      # Run the server
+```
+
+## License
+
+MIT

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+#!/usr/bin/env node
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":""}

package/dist/index.js

@@ -0,0 +1,57 @@
+#!/usr/bin/env node
+// =============================================================================
+// REACTIVE ARCHITECTURE MCP SERVER
+// =============================================================================
+// An MCP server that teaches AI assistants the reactive architecture
+// philosophy: Component → Store → Service (frontend)
+// and Controller → Service → Repository (backend).
+//
+// When added to any project, the AI will always follow the same working
+// philosophy regardless of stack.
+// =============================================================================
+import { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js';
+import { StdioServerTransport } from '@modelcontextprotocol/sdk/server/stdio.js';
+// Tools
+import { registerArchitectureGuideTool } from './tools/architecture-guide.js';
+import { registerScaffoldTool } from './tools/scaffold.js';
+import { registerValidateTool } from './tools/validate.js';
+import { registerExamplesTool } from './tools/examples.js';
+import { registerDetectAndGuideTool } from './tools/detect-and-guide.js';
+import { registerStyleRulesTool } from './tools/style-rules.js';
+import { registerFolderStructureTool } from './tools/folder-structure.js';
+import { registerBackendGuideTool } from './tools/backend-guide.js';
+import { registerBackendFolderStructureTool } from './tools/backend-folder-structure.js';
+// Resources
+import { registerPhilosophyResource } from './resources/philosophy-resource.js';
+// Prompts
+import { registerPlanFeaturePrompt } from './prompts/plan-feature.js';
+// Create the MCP server
+const server = new McpServer({
+    name: 'reactive-architecture',
+    version: '1.1.0',
+});
+// Register all tools
+registerArchitectureGuideTool(server);
+registerScaffoldTool(server);
+registerValidateTool(server);
+registerExamplesTool(server);
+registerDetectAndGuideTool(server);
+registerStyleRulesTool(server);
+registerFolderStructureTool(server);
+registerBackendGuideTool(server);
+registerBackendFolderStructureTool(server);
+// Register resources
+registerPhilosophyResource(server);
+// Register prompts
+registerPlanFeaturePrompt(server);
+// Connect via stdio transport
+async function main() {
+    const transport = new StdioServerTransport();
+    await server.connect(transport);
+    console.error('🚀 Reactive Frontend MCP Server running on stdio');
+}
+main().catch((error) => {
+    console.error('Fatal error:', error);
+    process.exit(1);
+});
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";AACA,gFAAgF;AAChF,mCAAmC;AACnC,gFAAgF;AAChF,qEAAqE;AACrE,qDAAqD;AACrD,mDAAmD;AACnD,EAAE;AACF,wEAAwE;AACxE,kCAAkC;AAClC,gFAAgF;AAEhF,OAAO,EAAE,SAAS,EAAE,MAAM,yCAAyC,CAAC;AACpE,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AAEjF,QAAQ;AACR,OAAO,EAAE,6BAA6B,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAC;AACzE,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAChE,OAAO,EAAE,2BAA2B,EAAE,MAAM,6BAA6B,CAAC;AAC1E,OAAO,EAAE,wBAAwB,EAAE,MAAM,0BAA0B,CAAC;AACpE,OAAO,EAAE,kCAAkC,EAAE,MAAM,qCAAqC,CAAC;AAEzF,YAAY;AACZ,OAAO,EAAE,0BAA0B,EAAE,MAAM,oCAAoC,CAAC;AAEhF,UAAU;AACV,OAAO,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AAEtE,wBAAwB;AACxB,MAAM,MAAM,GAAG,IAAI,SAAS,CAAC;IACzB,IAAI,EAAE,uBAAuB;IAC7B,OAAO,EAAE,OAAO;CACnB,CAAC,CAAC;AAEH,qBAAqB;AACrB,6BAA6B,CAAC,MAAM,CAAC,CAAC;AACtC,oBAAoB,CAAC,MAAM,CAAC,CAAC;AAC7B,oBAAoB,CAAC,MAAM,CAAC,CAAC;AAC7B,oBAAoB,CAAC,MAAM,CAAC,CAAC;AAC7B,0BAA0B,CAAC,MAAM,CAAC,CAAC;AACnC,sBAAsB,CAAC,MAAM,CAAC,CAAC;AAC/B,2BAA2B,CAAC,MAAM,CAAC,CAAC;AACpC,wBAAwB,CAAC,MAAM,CAAC,CAAC;AACjC,kCAAkC,CAAC,MAAM,CAAC,CAAC;AAE3C,qBAAqB;AACrB,0BAA0B,CAAC,MAAM,CAAC,CAAC;AAEnC,mBAAmB;AACnB,yBAAyB,CAAC,MAAM,CAAC,CAAC;AAElC,8BAA8B;AAC9B,KAAK,UAAU,IAAI;IACf,MAAM,SAAS,GAAG,IAAI,oBAAoB,EAAE,CAAC;IAC7C,MAAM,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;IAChC,OAAO,CAAC,KAAK,CAAC,kDAAkD,CAAC,CAAC;AACtE,CAAC;AAED,IAAI,EAAE,CAAC,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;IACnB,OAAO,CAAC,KAAK,CAAC,cAAc,EAAE,KAAK,CAAC,CAAC;IACrC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AACpB,CAAC,CAAC,CAAC"}

package/dist/knowledge/backend-folder-structure.d.ts

@@ -0,0 +1,10 @@
+import type { BackendStack } from './backend-guides.js';
+export interface BackendFolderGuide {
+    stack: BackendStack;
+    displayName: string;
+    structure: string;
+}
+export declare const BACKEND_DETECTION_GUIDE: string;
+export declare function getBackendFolderStructure(stack: string): string;
+export declare function getAllBackendFolderStructures(): string;
+//# sourceMappingURL=backend-folder-structure.d.ts.map

package/dist/knowledge/backend-folder-structure.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"backend-folder-structure.d.ts","sourceRoot":"","sources":["../../src/knowledge/backend-folder-structure.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAExD,MAAM,WAAW,kBAAkB;IAC/B,KAAK,EAAE,YAAY,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;CACrB;AAupBD,eAAO,MAAM,uBAAuB,QAgDxB,CAAC;AAEb,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAU/D;AAED,wBAAgB,6BAA6B,IAAI,MAAM,CAQtD"}