logo
Login
Cover image
MCP-CHAT-Demo
Public

MCP-CHAT-Demo

Try Now
2024-12-02

Un exemple d'application de chat démontrant l'intégration avec les serveurs de protocole de contexte de modèle (MCP)

3 years

Works with Finder

1

Github Watches

1

Github Forks

1

Github Stars

MCP Chat Demo

A sample chat application demonstrating integration with Model Context Protocol (MCP) servers.

Project Structure

mcp-chat-demo/
├── package.json
├── README.md
├── .gitignore
├── src/
│   ├── App.tsx
│   ├── main.tsx
│   ├── components/
│   │   ├── Chat.tsx
│   │   ├── MessageList.tsx
│   │   ├── MessageInput.tsx
│   │   └── MCPConnection.tsx
│   ├── lib/
│   │   ├── mcp-client.ts
│   │   └── types.ts
│   └── styles/
│       └── main.css
└── public/
    └── index.html

Setup Instructions

  1. Clone the repository:
git clone https://github.com/yourusername/mcp-chat-demo.git
cd mcp-chat-demo
  1. Install dependencies:
npm install
  1. Start the development server:
npm run dev

Features

  • Connect to local or remote MCP servers
  • Real-time chat interface
  • Support for MCP tools and resources
  • Message history
  • Error handling and reconnection logic

Technology Stack

  • React 18
  • TypeScript
  • Vite
  • TailwindCSS
  • MCP TypeScript SDK

相关推荐

Namer de céréales GPT

Namer de céréales GPT

  • NiKole Maxwell

    • I craft unique cereal names, stories, and ridiculously cute Cereal Baby images.

    1.1 (331)
    Entreprise Commercialisation
    Latvju gpts palīgs

    Latvju gpts palīgs

  • Andris Teikmanis

    • Latvian GPT assistant for developing GPT applications

    2.1 (226)
    Code Outils de développeur
    Bases GG33

    Bases GG33

  • Joshua Armstrong

    • Confidential guide on numerology and astrology, based of GG33 Public information

    3.3 (205)
    plus récent autre
    Créateur GPT

    Créateur GPT

  • https://suefel.com

    • Latest advice and best practices for custom GPT development.

    5 (186)
    plus récent autre
    Aide à code FLASK

    Aide à code FLASK

  • Navid RezaeiSarchoghaei

    • Professional Flask/SQLAlchemy code guide. Follow: https://x.com/navid_re

    4.7 (268)
    Entreprise Productivité
    Figma à frontal

    Figma à frontal

  • Emmet Halm

    • Converts Figma frames into front-end code for various mobile frameworks.

    1.8 (173)
    plus récent autre
    Digestion vidéo

    Digestion vidéo

  • https://cantaspinar.com

    • Summarizes videos and answers related questions.

    3.5 (267)
    Entreprise Productivité
    E-mails NAS

    E-mails NAS

  • Khalid kalib

    • Write professional emails

    2.9 (168)
    Productivité Assistant d'écriture
    West-Vlamsn Boer

    West-Vlamsn Boer

  • https://tovuti.be

    • Oede knorrepot die vasthoudt an de goeie ouwe tied van 't boerenleven

    1.5 (439)
    plus récent autre
    Stagiaire logiciel

    Stagiaire logiciel

  • Elijah Ng Shi Yi

    • Advanced software engineer GPT that excels through nailing the basics.

    4.7 (135)
    plus récent autre
    MCP-Servers-Hub

    MCP-Servers-Hub

  • apappascs

    • Découvrez la collection la plus complète et la plus à jour de serveurs MCP sur le marché. Ce référentiel sert de centre centralisé, offrant un vaste catalogue de serveurs MCP open-source et propriétaires, avec des fonctionnalités, des liens de documentation et des contributeurs.

    4 (1)
    micropython-mcp230xx

    micropython-mcp230xx

  • ShrimpingIt

    • Manipulation basée sur Micropython I2C de l'exposition GPIO de la série MCP, dérivée d'Adafruit_MCP230XX

    4 (1)
    tamiser

    tamiser

  • OffchainLabs

    • Aller la mise en œuvre de la preuve de la participation Ethereum

    4 (1)
    OATPP-MCP

    OATPP-MCP

  • oatpp

    • Implémentation du protocole de contexte du modèle d'Anthropic pour l'avoine ++

    4 (1)
    1Scan

    1Scan

  • huahuayu

    • Une passerelle API unifiée pour intégrer plusieurs API d'explorateur de blockchain de type étherscan avec la prise en charge du protocole de contexte modèle (MCP) pour les assistants d'IA.

    2 (1)
    mbotmcp

    mbotmcp

  • deemkeen

    • Contrôlez votre MBOT2 avec un combo d'alimentation: MQTT + MCP + LLM

    5 (1)
    Dingtalk-MCP

    Dingtalk-MCP

  • zhaoyunxing92

    • 本项目是一个钉钉 MCP （Protocole de connecteur de message） 服务 ， 提供了与钉钉企业应用交互的 API 接口。项目基于 Go 语言开发 ， 支持员工信息查询和消息发送等功能。

    5 (1)

    Reviews

    4 (1)
    Avatar
    user_jFxHAUFF
    2025-04-15

    The MCP book by fxamauri is a must-read for MCP enthusiasts. It offers a comprehensive understanding of the platform and its applications. The author has done an incredible job simplifying complex concepts, making this book invaluable for both beginners and advanced users. Highly recommend diving into this resource to unlock the full potential of MCP. Check it out here: https://mcp.so/server/mcpbook/fxamauri