prodex-js
@tarasyarema
About prodex-js
The ultimate vide coding MCP!
Overview
What is prodex-js?
prodex-js is a JavaScript library that enhances AI-assisted coding ("vibe coding") by injecting component-level and page-level prompts into web pages. It includes basic vision integration so an MCP client can "ask questions" about what the screen displays. Designed for developers using MCP‑enabled agents in editors like Cursor, it works by adding a single script tag to the page.
How to use prodex-js?
Add the library script to the <head> of your HTML file and set the k parameter to load "magic components" (omit it for production). Then configure your editor’s MCP client to point to the prodex‑js MCP server (currently hosted at https://prodex-api.onrender.com/mcp/sse?api_key=sk_test). For example, in Claude Code run: claude mcp add prodex --transport sse https://prodex-api.onrender.com/mcp/sse?api_key=sk_test. For other editors, add the server definition to your MCP configuration file (e.g., claude_desktop_config.json).
Key features of prodex-js
- Component-level prompt injection
- Page-level prompt injection
- Basic vision integration (ask questions about screen content)
- Simple script tag setup (no build step required)
- Works with any MCP‑compatible agentic editor
Use cases of prodex-js
- Provide real‑time context about UI components to an AI coding agent during development.
- Enable an AI assistant to "see" the current screen and answer questions about layout or state.
- Streamline prompt engineering for vibe‑coding workflows by embedding prompts directly into the page.
- Use with React‑based (Vite) projects to give the AI agent structured component information.
FAQ from prodex-js
Which editors are supported?
Tested with Cursor, but it should work with any editor that supports MCP connections to agentic code assistants.
How do I get the magic components?
Set the k query parameter in the script tag URL (e.g., ?k=test). Without it, the components are not loaded—useful for production builds.
Is the backend server free to use?
Yes, you can use sk_test as the API key for testing. The backend is currently hosted externally; the author may release a local binary in the future.
What are the known framework limitations?
Only tested with two React‑based projects using Vite. It may not work with other frameworks or build tools.
Is prodex-js open source?
Yes, it is released under the MIT license. See the LICENSE file for details.
Basic information
More IDE & Code Editors MCP clients
VIBE-BLOCKS-MCP-FOR-ROBLOX-STUDIO
majidmanzarpourMcphub.nvim
ravitemerA powerful Neovim plugin for managing MCP (Model Context Protocol) servers
BrowserTools MCP
wimpywarlordMCP for React Dev Tools - Use directly inside cursor
NASA API Integration with MCP
jmand626The MCP Project for CSE 473 Winter 2025. Coded with the assistance of Cursor AI and Claude 3.7
Comments