KIRUPA

Search and read 420+ web development, JavaScript, CSS, canvas, animation, and DSA tutorials from KIRUPA.com.

Documentation

If you use an AI coding assistant like GitHub Copilot, Claude, OpenAI Codex, or Cursor, you can connect it directly to kirupa.com using our Model Context Protocol (MCP) Server.

Streamable HTTP MCP Endpoint (No API key required):

https://www.kirupa.com/mcp/

  • Protocol: MCP 2025-03-26 / JSON-RPC 2.0
  • Transport: Streamable HTTP (POST)
  • Indexed Library: Hundreds of Tutorials & Code Guides
  • Auth: Public & Read-Only

What is it?

The Model Context Protocol (MCP) is an open standard that lets AI assistants and coding agents plug directly into external knowledge sources and tools. Think of it like a USB-C port for AI tools: instead of relying only on frozen training data or scraping noisy web pages full of navigation menus and scripts, an MCP-aware agent can ask a site's server for structured search results, clean Markdown explanations, and tested code snippets.

The kirupa.com MCP Server exposes over two decades of tutorials, visual explainers, and working code across JavaScript, TypeScript, CSS & Canvas animations, React, and Data Structures & Algorithms as fast, deterministic tools that your AI assistant can call on demand:

search_tutorials

Full-text search (SQLite FTS5 + BM25 ranking) across hundreds of tutorials on kirupa.com, with optional topic section filtering.

Inputs: query (required), section (optional), limit (1–15)

get_tutorial

Fetches the complete, clean Markdown version of any tutorial—or extracts just the fenced code blocks when code_only: true is passed.

Inputs: identifier (URL, section/slug, or title), code_only (boolean)

find_related_links

Finds related kirupa.com tutorials and canonical Markdown links for any technical concept or existing article URL.

Inputs: topic_or_url (required), limit (1–15)

list_sections

Lists every tutorial category on kirupa.com (Algorithms, Canvas, JavaScript, Animations, React, HTML5, Podcast, and more) with counts and articles.

Inputs: section (optional), limit (1–100)

In addition to those four tools, the server also exposes MCP Resources (including kirupa://llms.txt, kirupa://sections, and kirupa://tutorial/{section}/{slug}) and reusable MCP Prompts (explain_like_kirupa and find_kirupa_tutorial).

How would I use it?

Once you add the kirupa.com MCP server to your coding agent, you don't need to manually copy-paste tutorial code into your chat window. Your agent automatically knows how to search and read kirupa.com whenever you ask questions like:

  • "Use the kirupa MCP server to look up how frame-rate independent requestAnimationFrame loops work with delta time, and apply that pattern to my canvas animation."
  • "Fetch Kirupa's JavaScript implementation of a Trie / Quicksort / Breadth-First Search via MCP and port it to TypeScript with unit tests."
  • "Find related kirupa.com tutorials for our team's documentation on JavaScript closures, event bubbling, and CSS keyframe animations."

Connect Your MCP Client

Pick your favorite AI coding tool below and copy the configuration snippet:

GitHub Copilot / VS Code

Add the following to your workspace .vscode/mcp.json (or your user MCP settings in VS Code / JetBrains):

{
  "servers": {
    "kirupa": {
      "type": "http",
      "url": "https://www.kirupa.com/mcp/"
    }
  }
}

Claude Code & Desktop

Run this single command in your terminal to register the kirupa.com HTTP MCP server in Claude Code:

claude mcp add --transport http kirupa https://www.kirupa.com/mcp/

Or in your project's .mcp.json file:

{
  "mcpServers": {
    "kirupa": {
      "type": "http",
      "url": "https://www.kirupa.com/mcp/"
    }
  }
}

OpenAI Codex CLI

Add the server to your ~/.codex/config.toml file:

[mcp_servers.kirupa]
url = "https://www.kirupa.com/mcp/"

Cursor / Windsurf

Add this entry to ~/.cursor/mcp.json (or your project's .cursor/mcp.json):

{
  "mcpServers": {
    "kirupa": {
      "url": "https://www.kirupa.com/mcp/"
    }
  }
}

Direct JSON-RPC 2.0 via curl

Because the server uses standard Streamable HTTP JSON-RPC, you can call it directly from any terminal or script:

curl -s https://www.kirupa.com/mcp/ \
  -H "Content-Type: application/json" \
  -d '{
    "jsonrpc": "2.0",
    "id": 1,
    "method": "tools/call",
    "params": {
      "name": "search_tutorials",
      "arguments": { "query": "requestAnimationFrame delta time", "limit": 3 }
    }
  }'