> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-agent-native-development.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Build CometChat Apps with Lovable

> Connect the CometChat Docs MCP to Lovable as a chat connector so Lovable builds chat and calling features from CometChat's current documentation.

[Lovable](https://lovable.dev) builds apps from a conversation. Connect the **CometChat Docs MCP** to Lovable and it can read CometChat's current documentation while it builds, so the chat and calling features it writes use the real CometChat APIs.

The Docs MCP is a Lovable **chat connector**: it gives Lovable context in the project chat and in Chats. It isn't part of your published app. Your app talks to CometChat directly through the CometChat UI Kit or SDK that Lovable adds to your code.

## Before you start

* A [Lovable](https://lovable.dev) account. Custom MCP servers work on every Lovable plan.
* A CometChat app. [Sign up free](https://app.cometchat.com) and create an app to get its **App ID**, **Region** and **Auth Key**.

## Connect the Docs MCP

<Steps>
  <Step title="Open the MCP server form">
    In Lovable, open **Connectors**, select **+** in the top right of the catalog, and choose **MCP server**.

    If **MCP server** is greyed out, a workspace admin has turned off custom MCP servers for your workspace.
  </Step>

  <Step title="Name the server">
    Set **Server name** to `CometChat Docs`.

    If a **Connection** option appears, keep **Direct connection**.
  </Step>

  <Step title="Enter the server URL">
    Set **Server URL** to:

    ```
    https://mcp.cometchat.com/mcp
    ```
  </Step>

  <Step title="Choose No authentication">
    The CometChat Docs MCP is public and read-only, so it needs no credentials. Choose **No authentication**, then select **Add server**.
  </Step>
</Steps>

To check the connection, ask Lovable:

```text wrap theme={null}
Using the CometChat Docs connector, how do I install the CometChat React UI Kit?
```

<Note>
  Chat connections in Lovable are personal. Each person in your workspace connects the Docs MCP themselves.
</Note>

## Build with Lovable

Describe what you want and name the connector so Lovable uses it:

* *"Using the CometChat Docs connector, add one-to-one chat to this app with the CometChat React UI Kit."*
* *"Using the CometChat Docs connector, add a group chat page with a member list."*
* *"Using the CometChat Docs connector, add voice and video calling to the chat."*

When Lovable asks for your CometChat credentials, give it your App ID, Region and Auth Key from the [CometChat dashboard](https://app.cometchat.com).

<Warning>
  The Auth Key is for development only. Before you launch, log users in with auth tokens created on a server. See [User Authentication](/fundamentals/user-auth).
</Warning>

## What Lovable can read

The Docs MCP gives Lovable four read-only tools: search the CometChat docs, fetch a full docs page, list the ready-made implementation bundles, and get one, such as the React UI Kit quickstart. See [MCP Integration](/mcp-server) for the full list and for connecting other agents.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.