If you use an AI coding assistant — Cursor, GitHub Copilot, or Claude Code — you have probably run into the same problem at some point: the AI generates code that looks plausible but uses the wrong API, mixes up components from different frameworks, or confuses Mobiscroll UI’s component code with Mobiscroll Connect’s backend API. This happens because AI tools work from training data that may not reflect the current Mobiscroll API, and without additional context, they have no reliable way to tell the two products apart.
We have put together AI tooling for both Mobiscroll UI and Mobiscroll Connect to address this directly. The tooling — LLM-optimized documentation, a hosted MCP server, and per-tool instruction files — gives your AI coding assistant accurate, structured context about the product you are actually using. This post covers what is available and how to connect it to the tools you already use.
If you want to jump straight in: for Mobiscroll UI, go to the AI integration guide for your framework — React, Angular, Vue, JavaScript, or jQuery. If you are using Mobiscroll Connect, start with the Connect AI integration guide.
Give your AI assistant the right context
The core problem with using AI coding tools against a specialized library is context. A general-purpose AI model does not know which version of Mobiscroll you are on, which framework you are targeting, or which product — UI or Connect — you are working with. Without that grounding, the suggestions it produces can look credible while being wrong in ways that take time to diagnose.
The AI tooling we have built works in three layers, each targeting a different part of the problem. The first layer is LLM-optimized documentation: structured llms.txt files that give AI tools a clear, parseable view of the Mobiscroll API and documentation. The second layer is a hosted MCP server at mcp.mobiscroll.com — no local install required — which exposes separate tool namespaces for Mobiscroll UI and Mobiscroll Connect so the AI can query Mobiscroll-provided information about the product you are using. The third layer is per-tool instruction and rules files: configuration you add to your project that provides documentation URLs, component-to-intent mappings, enforcement rules, and anti-pattern constraints specific to your tool.
Together, these layers are designed to reduce the most common failure modes: hallucinated APIs, cross-framework component mixing, and conflating UI component code with Connect’s backend API.
Setup for Mobiscroll UI
Mobiscroll UI has per-framework AI integration docs for React, Angular, Vue, JavaScript, and jQuery. The setup varies slightly by tool.
For Cursor and GitHub Copilot, you have two options: add a basic rules file that points the AI at the right documentation and component patterns, or combine that rules file with the MCP server for richer, query-driven context. For Claude Code, setup uses an installable plugin (mobiscroll@mobiscroll) rather than a rules file — the plugin connects Claude Code to the Mobiscroll tooling directly.
The rules files do more than point to documentation. They include intent-to-component mappings (so the AI understands which component to reach for in a given situation), enforcement rules that steer the AI away from known anti-patterns, and constraints that prevent cross-framework component mixing. Combined with the MCP server, they give the AI a better working context for the Mobiscroll UI API for your specific framework.
Start with the guide for your framework: React · Angular · Vue · JavaScript · jQuery
Setup for Connect
Mobiscroll Connect has its own AI integration setup, kept clearly separate from the UI tooling. The MCP server exposes a distinct Connect tool namespace — the same server, but the AI is working with Connect’s backend API surface, not the UI component layer.
For Cursor, the setup uses .mdc rules files combined with the MCP server. For GitHub Copilot, the same .mdc rules apply, with the MCP server as an optional addition for deeper context. For Claude Code, a CLAUDE.md routing file handles the configuration, again with the MCP server available as an optional layer.
This matters because Connect’s API — REST endpoints, SDK methods, authentication flows, and calendar data structures — is substantially different from anything in the UI layer. Without the right routing, an AI assistant working on a Connect integration can pull in UI component patterns that have no place in a backend context. The Connect rules files and MCP namespace are designed to keep that separation clear.
Connect supports backend SDKs for Node.js, Python, PHP, .NET, Java, Go, and Ruby, as well as a REST API. The AI integration guide covers how to connect your AI tool to the right context regardless of which SDK or integration path you are using.
Go to the Connect AI integration guide to get started.
How this fits with Mobiscroll UI and Connect
This is not a separate product — it is supporting infrastructure for Mobiscroll UI and Mobiscroll Connect, designed to work alongside the documentation and SDKs you are already using.
If you use UI and Connect together — for example, building an appointment scheduling product where Connect handles calendar connectivity and Mobiscroll UI handles the scheduling interface — the MCP server’s separate namespaces matter. Your AI assistant can work in the UI layer or the Connect layer without conflating the two, because the tooling keeps them distinct. The same is true if you use only one product: the instructions and MCP tools are scoped to the product you have configured, so the AI’s context stays accurate.
Developers already using Mobiscroll who have not yet set up an AI coding assistant, or who have found AI suggestions unreliable for Mobiscroll-specific code, are the primary audience for this tooling. The setup involves adding a rules or configuration file to your project and, optionally, connecting to the hosted MCP server — the documentation covers the specifics for each tool and product.
What’s next
We are continuing to invest in this area. One of the things we are working on next is new features and additional tools for the Mobiscroll MCP server — expanding what AI coding assistants can query and do when working with Mobiscroll UI and Connect.
Another area we are preparing is further optimization of the LLM-optimized documentation — improving the structure and coverage of the llms.txt files so AI tools can work with more of the Mobiscroll API surface accurately. We will share more when these are ready.
Getting started
The AI integration docs are available now for both Mobiscroll UI and Mobiscroll Connect. The right starting point depends on which product you are using.
If you are using Mobiscroll UI, go to the AI integration guide for your framework: React, Angular, Vue, JavaScript, or jQuery. Each guide covers setup for Cursor, GitHub Copilot, and Claude Code, with instructions for both the basic rules-file approach and the MCP server option. If you are using Mobiscroll Connect, start with the Connect AI integration guide, which covers all three tools and all supported SDK languages.
If you have questions or run into anything unexpected while setting up, the Mobiscroll documentation is the best first stop — and the support team is available if you need to go further.