mcp

Name: mcp
Availability: InStock
Author: Magic UI

このMCPは、Magic UIのための公式ModelContextProtocolサーバーです。特定のクライアントに対して簡単にインストールでき、さまざまなツールを提供します。ユーザーは、アニメーションやデザイン要素を簡単に追加するためのコマンドを使用できます。

GitHub Website Docs

GitHubスター

138

ユーザー評価

未評価

お気に入り

閲覧数

フォーク

イシュー

インストール方法

難易度

中級

推定所要時間

10-20 分

必要な環境

Node.js 18.0.0以上

npm 8.0.0以上

インストール方法

前提条件

必要なソフトウェアとバージョンを明記してください。

Node.js: 18.0.0以上

npm: 8.0.0以上

インストール手順

1. MCPのインストール

bash
npx @magicuidesign/cli@latest install

2. 手動インストール

IDEのMCP設定に以下を追加します：

json
{
  "mcpServers": {
    "@magicuidesign/mcp": {
      "command": "npx",
      "args": ["-y", "@magicuidesign/mcp@latest"]
    }
  }
}

トラブルシューティング

よくある問題

問題: サーバーが起動しない 解決策: Node.jsのバージョンを確認し、依存関係を再インストールしてください。

設定方法

基本設定

Claude Desktop設定

~/.config/claude-desktop/claude_desktop_config.json（macOS/Linux）または %APPDATA%\Claude\claude_desktop_config.json（Windows）を編集：

json
{
  "mcpServers": {
    "@magicuidesign/mcp": {
      "command": "npx",
      "args": ["-y", "@magicuidesign/mcp@latest"]
    }
  }
}

環境変数

必要に応じて以下の環境変数を設定：

bash
export API_KEY="your-api-key"
export DEBUG="true"

セキュリティ設定

APIキーは環境変数または安全な設定ファイルに保存

ファイルアクセス権限の適切な設定

ログレベルの調整

使用例

基本的な使用方法

MCPサーバーの基本的な使用方法を以下に示します：

プログラムでの使用

javascript
// JavaScript例（Node.js）
const { MCPClient } = require('@modelcontextprotocol/client');

const client = new MCPClient();
await client.connect();

// ツールの実行
const result = await client.callTool('toolName', {
  parameter1: 'value1',
  parameter2: 'value2'
});

console.log(result);

応用例

API統合

python
Python例
import requests
import json

def call_mcp_tool(tool_name, params):
    response = requests.post(
        'http://localhost:3000/mcp/call',
        json={
            'tool': tool_name,
            'parameters': params
        }
    )
    return response.json()

使用例
result = call_mcp_tool('analyze', {
    'input': 'sample data',
    'options': {'format': 'json'}
})