web-frontend-mcp-demo
This project is a web frontend demo built with TypeScript. It allows users to learn practical skills in frontend development through building user interfaces and integrating with APIs. The code is modular, promoting high reusability and ease of maintenance.
GitHub Stars
1
User Rating
Not Rated
Favorites
0
Views
15
Forks
0
Issues
0
README
Web Frontend MCP Demo
A demonstration project showing integration of the Model Context Protocol (MCP) with a modern web application.
Project Structure
This project consists of two main parts:
- Frontend: A React 19 application built with Vite
- Backend: A Node.js server using Hono framework
Both parts utilize the @modelcontextprotocol/sdk package for MCP integration.
Technologies
Frontend
- React 19
- Vite
- TypeScript
- Tailwind CSS
Backend
- Node.js
- Hono
- TypeScript
- Zod for validation
Getting Started
Prerequisites
- Node.js (latest LTS version recommended)
- npm
Installation
- Clone the repository
- Install dependencies in the root project:
npm install - Install dependencies in each subdirectory:
cd frontend && npm install cd backend && npm install
Development
Run both frontend and backend concurrently:
npm run dev
This will start:
- Frontend development server (Vite)
- Backend development server (using tsx)
Building for Production
Frontend
cd frontend && npm run build
Backend
cd backend && npm run build
License
MIT
Author Information
0
Followers
0
Repositories
0
Gists
0
Total Contributions