OpenManager Vibe V4

OpenManager Vibe V4は、自然言語ベースのサーバー分析および監視システムです。管理者が簡単な言語でサーバーの状態を尋ねると、システムは自動的に分析して結果を提供します。

配布リンク

• フロントエンド： https://openvibe3.netlify.app

• バックエンドAPI ： https://openmanager-vibe-v4.onrender.com

Related MCP server: MCP System Info Server

プロジェクト構造

.
├── frontend/                # 프론트엔드 코드
│   ├── css/                 # 스타일시트 파일들
│   ├── public/              # 정적 자원 파일들
│   ├── index.html           # 메인 랜딩 페이지
│   ├── server_dashboard.html # 서버 모니터링 대시보드
│   ├── server_detail.html   # 서버 상세 정보 페이지
│   ├── agent.js             # 에이전트 스크립트
│   ├── ai_processor.js      # 자연어 처리 엔진
│   ├── data_processor.js    # 데이터 처리 로직
│   ├── dummy_data_generator.js # 더미 데이터 생성기
│   ├── fixed_dummy_data.js  # 고정 더미 데이터
│   ├── summary.js           # 데이터 요약 및 보고서 생성
│   └── config.js            # 설정 파일
│
└── mcp-lite-server/         # 백엔드 서버
    ├── context/             # 컨텍스트 문서 보관
    ├── server.js            # 백엔드 서버 코드
    └── package.json         # 백엔드 의존성 정의

MCPインターロックフロー

フロントエンドとMCP Liteサーバーは次のように連動します。

1. フロントエンド：ユーザーが自然言語でサーバーの状態について質問を入力する

2. API呼び出し：フロントエンドが質問とコンテキスト情報をMCPサーバーの/queryエンドポイントに送信する

3. バックエンド処理: MCP サーバーが質問をコンテキストファイルと照合して適切な応答を生成する

4. 結果の表示：応答がフロントエンドに渡され、ユーザーに視覚的に表示

デモンストレーション環境では：

• フロントエンドでほとんどのロジックが実行され、仮想データの使用

• MCPサーバーは、補助的な役割で単純な自然言語処理機能のみを提供

• 実際の環境では、MCPサーバーが実際の監視データと高度なLLMを連携する構造に拡張可能

主な機能

• 自然言語ベースのクエリ：管理者が日常言語でサーバーの状態と問題を質問する

• 自動分析: システムが質問を分析し、関連サーバーのリストと問題の原因を提供

• 直感的なダッシュボード：サーバーの状態とパフォーマンス指標を視覚的に表示する

• 詳細レポート：問題の原因と解決策を含む分析レポートの生成

• データフィルタリング:時間、サーバーの種類、場所によるフィルタリング機能

技術スタック

フロントエンド

• HTML5/CSS3/JavaScript (バニラ)

• ブートストラップUIフレームワーク

• Chart.js(データ可視化)

• Font Awesome/Bootstrap Icons (アイコン)

バックエンド

• Node.js

• Express.js

• ファイルベースのコンテキスト管理システム

🏗システム構造：大規模AIエージェント対本プロジェクト（MCPベース）

🧠実際のLLMベースのAIエージェント構造

• データフロー：リアルタイムモニタリングログ→コレクタ（Kafka / Fluentdなど）→分析エンジン

• 自然言語処理：

  • LLM API（OpenAI、Claudeなど）連動

  • Python/Javaベースのバックエンド

  • 高度なクエリ解析とコンテキスト理解機能を含む

• 分析エンジン：

  • InfluxDB、Elasticsearchなどの時系列/検索エンジンと連動

  • イベントベースのパターン分析、アラームトリガ

• UI統合：

  • ダッシュボードの完全統合

  • インタラクティブインターフェース+使用履歴学習

⚙️本プロジェクト(軽量化MCPベースデモシステム)

このプロジェクトには、LLM（巨大言語モデル）なしでAIと同様の機能を提供するために、複数層の独自開発の「AIエージェント」ロジックが含まれています。各コンポーネントは特定の役割を果たし、連携してユーザーにインテリジェントなサーバー分析と監視体験を提供しようとします。

• **フロントエンド：**純粋なHTML / JSで構築、Netlifyに配布。ほとんどの複雑なAIエージェントロジックがここに含まれています。

• MCPサーバー（バックエンド）： Node.jsに基づいて、Renderに展開。主に簡単なクエリ応答と統計ベースの分析機能を担当します。

多層「LLMレスAIエージェント」コンポーネント

1. 単純な MCP サーバー ( mcp-lite-server/server.jsの/queryエンドポイント):

   • 役割： context/フォルダ内のテキストファイルの内容に基づいて、基本的なキーワードマッチングクエリ応答機能を提供します。

   • **動作方法：**ユーザーのクエリ内の単語がコンテキストファイルの特定の行に含まれていることを確認して応答します。

   • **限界点：**単純な文字列マッチングは文脈の理解が不足し、無関係な情報を返す可能性があります。

2. バックエンドAIエージェント（ mcp-lite-server/ai_agent.jsおよび/api/ai/queryエンドポイント）：

   • **役割：**サーバーメトリックデータの統計的分析（Z-scoreなど）を介して異常の兆候を検出し、いくつかの特定の質問タイプに対するパターンベースの単純な自然言語の回答を生成します。

   • **動作方法：**数値データを分析して統計的異常値を識別し、事前定義された応答テンプレートを使用します。

   • **限界点：**限られたシナリオと質問タイプにのみ対応可能。

3. フロントエンド AI プロセッサ ( frontend/ai_processor.js ):

   • **役割：**現在のシステムで最も洗練されたLLMのないエージェントロジックを実行します。詳細なルールベースの問題パターンの定義、ユーザーの自然言語クエリ分析（簡単なNLU）、原因分析と解決策の提案、動的レポートコンテンツの生成などを担当します。

   • 動作方法： problemPatternsで定義されている規則と条件に基づいてサーバーデータを分析し、 analyzeQueryを介してユーザーの質問の意図を特定し、さまざまなgenerate...Response関数を使用してカスタマイズされた情報を提供します。

   • **特徴：**ほとんどのインテリジェントロジックはフロントエンドJavaScriptコード内に実装されています。

このアプローチの利点と限界

• 利点：

  • LLMなしでAIのように動作する（低コスト/高効率）

  • ドキュメントだけを追加すると応答を拡張できます（単純なMCPサーバーの場合）

  • 導入とメンテナンスコストが低い（外部LLM API依存性とコストなし）

  • 特定ドメイン（サーバー監視）に最適化されたルール設定可能

• 限界：

  • 質問解釈能力が制限的(文脈理解X、自然言語理解の深さが制限的)

  • 大容量リアルタイム分析には不適

  • ルールとパターンの精巧さによってパフォーマンスが左右され、新しい問題の種類や質問に柔軟に対処するのが難しい（特にフロントエンドAIプロセッサ）

  • フロントエンドにコアロジックが集中しており、スケーラビリティとメンテナンス性に制約がある可能性があります。

🤖開発方式(Vibe Codingベース)

このプロジェクトはGPTベースのツールにプロンプトを入力し、Cursorを介してAIコーディング指示方法で開発されました。

開発段階別フロー

ステップ1：初期計画と機能の定義（GPTを使用）

• プロジェクト構造提案

• MCPサーバーの役割、コンテキストベースの応答方式の定義

• 技術スタックとUIの基本方向の設定

ステップ2：機能の実装とフロントインターロック（Cursorを使用）

• フロントJSコードの設定

• MCP 要求 fetch 処理

• マークダウンレスポンスレンダリング

ステップ3：高度化と文書パターンの対応（Cursor + GPTコラボレーション）

• context マルチドキュメント対応構造の拡張

• 自動レポートテンプレートの設計

• 障害タイプ別対応文書の設計と分岐処理

📐開発ガイドライン

✅ UIとデザイン

• index.htmlとUIスタイルは現在の状態を維持する（90％以上の保存を推奨）

• ユーザーエクスペリエンスフローを損なわない範囲内でのみ変更を許可する

✅ MCP バックエンド

• サーバー機能の拡張とコンテキスト構造の追加は自由に改善可能

• context ドキュメント構造は、テキストベースの.txtまたは.mdに従う

• API 拡張時に RESTful 構造を推奨

開発ガイドライン

プロジェクトを作業するときは、次のガイドラインに従ってください。

UIとデザイン関連(Commit ad03d5f基準)

• インデックスファイルとユーザーインターフェイス：現在のUI / UXデザインは徹底的に保存する必要があります。

  • index.htmlおよび外部で表されるユーザーインターフェースコンポーネントは、現在のスタイルを90％以上維持する必要があります。

  • やむを得ない場合は、フロントエンドのデザインを変更しないでください。

バックエンド開発

• バックエンド機能の改善：サーバー側の機能の改善と拡張は自由に進行可能です。

  • データ処理ロジックの改善

  • API エンドポイントの追加と最適化

  • パフォーマンスの向上とスケーラビリティの強化作業

インストールと実行

フロントエンド

cd frontend
# 정적 서버로 실행 (예: VS Code의 Live Server 또는 기타 정적 파일 서버)

バックエンドサーバー

cd mcp-lite-server
npm install
node server.js

展開環境

• フロントエンド：Netlify（ https://openvibe3.netlify.app ）

• バックエンド：Render.com（ https://openmanager-vibe-v4.onrender.com ）

今後の開発計画

1. AI統合:実際の自然言語処理LLM連動

2. リアルタイムデータ：実サーバー監視システム（Prometheus、Zabbixなど）と連動

3. 可視化拡張: データ分析グラフとチャートの多様化

4. 通知システム：障害が発生した場合の自動通知とレポート送信

開発者情報

このプロジェクトは、Claude、GPT、Geminiなど、さまざまなAIモデルベースのVibe Coding方式で開発されました。

ライセンス

このプロジェクトは内部開発用に作成され、関連するライセンスは別途記載されていません。

最近の改善点 (Release v4.1.0)

1.軽量NLU構造の改善と一貫性

• フロントエンドとバックエンドの両方に軽量NLU（Natural Language Understanding）構造を実装しました。

• ユーザーのクエリをインテント（意図）とエンティティ（オブジェクト）に一貫して分離して処理します。

• インテント：CPU_STATUS、MEMORY_STATUS、DISK_STATUS、INCIDENT_QUERY、SERVER_STATUSなど

• エンティティ：server_type、threshold、time_range、severityなど

2. フロントエンド-バックエンドクエリ処理ロジックの改善

• フロントエンドprocess_query.jsにバックエンドと互換性のあるNLU分析機能を追加しました。

• バックエンドAPIレスポンス構造を改善し、インテントとエンティティ情報を明示的にフロントエンドに提供します。

• エラー処理を強化し、すべてのAPIエンドポイントに一貫したエラー処理を適用しました。

3. コンテキスト処理方式の改善

• 会話のコンテキストを活用して、後続の質問に対してより正確でコンテキストに応じた応答を提供します。

• 例：特定のサーバーに関する質問の後、「なぜそれを説明してください」などの後続の質問にコンテキストを維持します。

• 前の会話で述べたメトリックタイプ（CPU、メモリなど）を覚えて、後続の質問に使用します。

4. 開発者体験の改善

• APIレスポンス構造を一貫して維持することで、フロントエンドの開発が容易になりました。

• すべてのAPIにエラー処理ロジックを追加して信頼性を向上させました。

• バックエンドコード構造を改善することでメンテナンス性が向上しました。

今後の改善計画

1. コンテキストファイルの構造化 - 現在のテキストファイルベースのコンテキストをJSON / YAML形式に変更する

2. NLU機能の強化 - より多様なインテントとエンティティ認識の追加

3. フロントエンドUIの改善 - コンテキスト認識機能を視覚的に表現

4. バックエンドのパフォーマンスの最適化 - 大規模メトリックデータ処理のパフォーマンスの向上