> ## Documentation Index
> Fetch the complete documentation index at: https://developer.jtl-software.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Build with AI

> Connect the JTL documentation to your AI coding tools so they can answer questions and generate code across every JTL product

JTL provides a [Model Context Protocol (MCP)](https://modelcontextprotocol.io/) server that gives AI tools direct access to the full developer documentation. Once connected, your tool can answer platform questions, generate code, and reference current behaviour for any JTL product.

## Connect to your AI Tool

Choose your AI coding tool below and follow the setup instructions.

<Tabs>
  <Tab title="Claude Code">
    Add the JTL docs MCP server with a single command:

    ```bash theme={null}
    claude mcp add --transport http jtl-docs https://developer.jtl-software.com/mcp
    ```

    Restart Claude Code, then run `/mcp`. You'll see `jtl-docs · ✔ connected` as part of the MCP servers.
  </Tab>

  <Tab title="GitHub Copilot (VS Code)">
    Add the following to your project's `.vscode/mcp.json` (create the file if it doesn't exist):

    ```json theme={null}
    {
      "servers": {
        "jtl-docs": {
          "type": "http",
          "url": "https://developer.jtl-software.com/mcp"
        }
      }
    }
    ```

    Restart VS Code and Copilot will pick up the MCP server.
  </Tab>

  <Tab title="GitHub Copilot CLI">
    Start Copilot CLI and then run the command below:

    ```bash theme={null}
      /mcp add
    ```

    Copilot will open an interactive form asking for the MCP server details. Fill in the following:

    * **Server Name:** `jtl-docs`
    * **Server Type:** Press 3 to select HTTP
    * **URL:** `https://developer.jtl-software.com/mcp`

    <Tip>
      Use the **Tab** key to navigate and **ctrl+s** to save.
    </Tip>

    Once it's saved, run `/mcp show`. You'll see `✓ jtl-docs` in the list of available MCP servers.
  </Tab>

  <Tab title="Cursor">
    Open **Cursor Settings** > **Tools & MCPs** > **Add Custom MCP**. Then paste the following:

    ```json theme={null}
    {
      "mcpServers": {
        "jtl-docs": {
          "type": "http",
          "url": "https://developer.jtl-software.com/mcp"
        }
      }
    }
    ```

    Alternatively, add it to your project's `.cursor/mcp.json` (create the file if it doesn’t exist):

    ```json theme={null}
    {
      "mcpServers": {
        "jtl-docs": {
          "type": "http",
          "url": "https://developer.jtl-software.com/mcp"
        }
      }
    }
    ```
  </Tab>

  <Tab title="Devin Editor">
    Open **Devin Settings > Devin Local > Open Devin MCP marketplace > Add custom MCP**  and add a new server, or add it manually by editing `~/.codeium/windsurf/mcp_config.json`:

    ```json theme={null}
    {
      "mcpServers": {
        "jtl-docs": {
          "type": "http",
          "url": "https://developer.jtl-software.com/mcp"
        }
      }
    }
    ```
  </Tab>
</Tabs>

<Note>
  You can also connect directly from any page in these docs. Click the contextual menu (top of any page) and select **Connect to Cursor** or **Connect to VS Code** to add the MCP server with one click.
</Note>

## Other Ways to Use the Docs

These options work without any setup and are useful for one-off questions or tools that don't support MCP.

**Copy as Markdown.** On any page, press `Cmd+C` / `Ctrl+C` or select **Copy** from the contextual menu to copy the page content as Markdown. Paste it directly into ChatGPT, Claude, or any other AI tool.

**Claude and ChatGPT links.** Select **Open in Claude** or **Open in ChatGPT** from the contextual menu on any page. This opens the AI tool with the page content pre-loaded.

**llms.txt.** The docs site hosts an [`llms.txt`](https://developer.jtl-software.com/llms.txt) file listing every page with a short description. AI crawlers use it to index the documentation, and you can fetch it directly to give a tool an overview of what is available.

## Tips for Better Results

These apply regardless of which product you build against.

**Name the product.** "How do I authenticate?" is ambiguous across products with different authentication models. "How do I authenticate a Cloud App backend?" retrieves the right page.

**Be specific about what you're building.** "Help me build a JTL Cloud App" is vague. "Create a panel app that shows customer order history in the customer sidebar" gives the tool enough context to generate accurate code.

**Reference JTL concepts by name.** Use the vocabulary listed for your product above. The tool maps these terms to the correct documentation pages.

**Ask follow-up questions.** After the tool generates code, ask "Does this follow the recommended AppBridge initialization pattern?" and it will check its answer against the docs.

**Combine with the quickstarts.** Start with [From Template](/cloud/get-started/quick-start/from-template) or [From Scratch](/cloud/get-started/quick-start/from-scratch) to get a running app, then use AI to extend it.

***

## What's Next

<CardGroup cols={2}>
  <Card title="Quickstart: From Template" icon="copy" href="/cloud/get-started/quick-start/from-template">
    Clone the sample app and get a running Cloud App in 15 minutes.
  </Card>

  <Card title="Quickstart: From Scratch" icon="hammer" href="/cloud/get-started/quick-start/from-scratch">
    Build a Cloud App step by step with React and your favourite backend (Node.js, C#, or PHP).
  </Card>

  <Card title="Marketplace Channels" icon="store" href="/marketplace-channels/guides/channel-api-overview">
    Connect a marketplace to JTL-Wawi through SCX.
  </Card>

  <Card title="Vouchers API" icon="ticket" href="/vouchers/guides/quickstart">
    Issue and manage vouchers through the Vouchers API.
  </Card>
</CardGroup>