脚本プランナー▸ 
AIアプリ 
AIニュース y-gui：複数のAIモデルとMCP統合に対応したWebベースのAIチャットツール
小编 ·
y-gui：複数のAIモデルとMCP統合に対応したWebベースのAIチャットツール
y-gui とは？
y-gui は、Web ベースのグラフィカルインターフェースで、AI とチャット形式で対話するためのツールです。複数の AI モデルと MCP 統合をサポートしています。MCP プロトコルを通じて AI の機能を拡張し、Gmail、Google カレンダー、画像生成サービスなどと接続できます。
y-gui の機能と特徴
インタラクティブなチャットインターフェース：AI モデルと対話するためのチャット画面を提供します。
複数のボット設定のサポート：異なる base_url、api_key、model の組み合わせを含む、複数のボット設定をサポートします。
包括的な MCP 統合システム：
Gmail のアクセスと管理：チャット画面から直接 Gmail のメールにアクセスし、管理できます。
Google カレンダー統合：自然言語でカレンダーイベントの作成と管理を行います。
画像生成機能：チャットの対話中に直接画像を生成できます。
拡張可能なフレームワーク：より多くの MCP サーバーやツールを追加できます。
安全な認証：Auth0 と Google ログインを使用した安全な認証を提供します。
テーマサポート：ダークテーマとライトテーマの両方をサポートします。
データストレージ：すべてのチャットデータは Cloudflare R2 に保存され、アクセスと同期が容易です。
リアルタイム更新：SWR を使用してリアルタイムでデータを更新します。
レスポンシブデザイン：あらゆるデバイスに対応したインターフェースです。
y-gui のアーキテクチャ設計
フロントエンド：React、TypeScript、Tailwind CSS、SWR を使用してデータ取得を行います。
バックエンド：Cloudflare Workers に基づいて構築され、データストレージには R2 を使用します。
技術スタック
フロントエンド：React、TypeScript、Tailwind CSS、SWR、Auth0。
バックエンド：Cloudflare Workers、R2。
統合：MCP サーバー、OAuth2、Gmail API、Google Calendar API、画像生成 API。
ビルドツール：Vite、Wrangler、TypeScript。
y-gui のインストールと使用方法
前提条件
Node.js と npm をインストールします。
Cloudflare のアカウントを所有していること。
Auth0 のアカウントを所有していること。
AI プロバイダーの API キーを取得します。
インストール手順
1. リポジトリのクローン：
git clone https://github.com/luohy15/y-gui.git cd y-gui
2. 依存関係のインストール：
npm install
3. 環境変数の設定：
backend/wrangler.toml で Cloudflare Worker の設定を行います。
frontend/src/index.tsx と backend/src/utils/auth.ts で Auth0 の設定を変更します。
4. アセットのビルド：
npm run build
5. Cloudflare Worker のデプロイ：
npm run deploy
Github：https://github.com/luohy15/y-gu
