css-mcp-server

css-mcp-server

13
developer_tools

This project provides a demonstration of building a Model Context Protocol (MCP) server using Node.js and TypeScript, designed to function as a CSS Tutor that offers AI-driven CSS feature updates. It showcases fundamental MCP concepts such as Resources, Tools, and Prompts to manage and deliver personalized content efficiently.

Building a CSS Tutor MCP Server

This repository contains a simple MCP server built with Node.js and TypeScript. It serves as a "CSS Tutor," offering personalized updates about CSS features to a connected AI client. Key MCP concepts demonstrated include defining Resources, Tools, and Prompts.

Prerequisites

  • Node.js (v18 or later recommended)
  • npm or equivalent package manager
  • An AI client capable of connecting to MCP
  • An OpenRouter API Key

Quick Start

  1. Clone the Repository
  2. Install Dependencies
  3. Prepare API Key
  4. Build the Server
  5. Configure Your MCP Client
  6. Connect

Using with Cursor

  • Configure Server in Cursor
  • Create a Cursor Project Rule for the Prompt
  • Connect and Use

Understanding the Code

This section provides an overview of how the server is implemented using Resources, Tools, and Prompts.

Debugging with MCP Inspector

MCP Inspector can be used for debugging and inspecting JSON-RPC messages. Commands for usage are provided.