MCP in the browser using Javascript

note: Better to use a nodeJS websocket server on a private local network but that is much harder to demo.
Started June 11, 2025

Try these stable versions

mcp00.htmlGen 1: The most stable example of the basic mcp browser client-side setup mention "tell a joke" or "dog" in the chat.

gen2/mcp00.htmlGen 2: trying to MCP connect to a client-side LLM from huggingface

gen3/mcp00.htmlGen 3: Started July 23, 2025: Trying Gemini-Nano native to the browser client-side mcp server

GEN3: Started July 23, 2025

gen2/mcp00.htmlGen 2: trying to MCP connect to a client-side LLM from huggingface

gen2/mcp40.html Just strting

gen2/mcp41.html New Stable uses gemini-nano (needs flags set)

GEN 2: June 20, 2025 New approach using a web-worker

gen2/mcp00.htmlThe most stable example of the basic mcp browser client-side setup

gen2/mcp30.html New Stable

GEN1: Started June 11, 2025

Older method testing a single file mcp server

mcp00.htmlThe most stable example of the basic mcp browser client-side setup mention "tell a joke" or "dog" in the chat.

mcp05.html New Stable

mcp06.html

mcp07.html

mcp08.html

mcp09.html Added Joke API

mcp10.html Added dog API

mcp11.html New Stable

mcp12.html removed most CSS

mcp13.html testing removed all CSS

mcp14.html

mcp15.html main gen1 stable I like this best in the chat ask for a dog or a joke

mcp16.html failed loading new page in seperate tab

mcp17.htmlissues

mcp18.htmlworking

mcp19.html Reduced CSS, but I might not use it

mcp20.html

mcp21.html

mcp22.html using js modules

mcp23.html

mcp24.html new stable