> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flowstep.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Průvodce rychlým startem MCP

> Připojte Flowstep ke svému agentovi pro programování a spusťte první volání nástroje.

## Předpoklady

* Účet Flowstep ([app.flowstep.ai](https://app.flowstep.ai))

<Tip>
  Používáte Claude na claude.ai nebo v Claude Desktop? Flowstep je uvedený konektor v adresáři Claude. Přidejte jej jedním kliknutím na [claude.ai/directory/flowstep](https://claude.ai/directory/flowstep). Viz [claude.ai](/cs/mcp/clients/claude-ai).
</Tip>

<Tabs>
  <Tab title="Cursor">
    **Vyžaduje Cursor v0.43+**

    ## Krok 1 — Přidejte server

    Kliknutím na [**Add Flowstep to Cursor**](https://cursor.com/install-mcp?name=flowstep\&config=eyJ1cmwiOiJodHRwczovL2FwaS5mbG93c3RlcC5haS9tY3AifQ%3D%3D) jej nainstalujte jedním kliknutím. Případně vytvořte nebo upravte `~/.cursor/mcp.json` (globální) nebo `.cursor/mcp.json` v kořenu projektu:

    ```json theme={"system"}
    {
      "mcpServers": {
        "flowstep": {
          "url": "https://api.flowstep.ai/mcp"
        }
      }
    }
    ```

    Po uložení restartujte Cursor.

    ## Krok 2 — Ověřte se

    Otevřete panel MCP v Cursoru (Settings → MCP) a vedle Flowstepu klikněte na **Connect**. Cursor otevře váš prohlížeč na přihlašovací stránku Flowstepu. Přihlaste se pomocí přihlašovacích údajů Flowstep (e-mail a heslo, nebo Google) a na obrazovce se souhlasem klikněte na **Allow**. Prohlížeč vás přesměruje zpět a Cursor token uloží automaticky.

    <Note>
      Před ověřením potřebujete účet Flowstep. Pokud ho nemáte, nejdřív se zaregistrujte na [app.flowstep.ai](https://app.flowstep.ai).
    </Note>

    ## Krok 3 — Spusťte volání nástroje

    V chatu Cursoru se zeptejte:

    > „Vypiš mi moje soubory Flowstep“

    Cursor zavolá `list-files` a vrátí seznam vašich souborů. Pokud je odpověď prázdná, nejdřív vytvořte soubor:

    > „Vytvoř nový soubor Flowstep s názvem 'Dashboard'“

    ## Krok 4 — Vygenerujte obrazovku

    ```
    Generate a mobile login screen in Flowstep for a SaaS app with email/password
    fields and a Google sign-in button. After it finishes, show me the image.
    ```

    Cursor zavolá `ai-generate-screens` (které v jednom kroku vytvoří nový soubor a vygeneruje obrazovky), poté `get-screen-image`. Vykreslený návrh uvidíte přímo v chatu.
  </Tab>

  <Tab title="Claude Code">
    **Vyžaduje Claude Code CLI**

    ## Krok 1 — Přidejte server

    Spusťte toto ve svém projektu:

    ```bash theme={"system"}
    claude mcp add --transport http flowstep https://api.flowstep.ai/mcp
    ```

    Chcete-li server sdílet s týmem, přidejte jej místo toho do `.mcp.json` v kořenu projektu:

    ```json theme={"system"}
    {
      "mcpServers": {
        "flowstep": {
          "type": "http",
          "url": "https://api.flowstep.ai/mcp"
        }
      }
    }
    ```

    <Note>
      Pole `"type": "http"` je u serverů HTTP v Claude Code povinné. Cursor je nepotřebuje.
    </Note>

    ## Krok 2 — Ověřte se

    Spusťte libovolný nástroj Flowstep z chatu Claude Code. Při prvním použití Claude Code otevře váš prohlížeč na přihlašovací stránku Flowstepu. Přihlaste se pomocí přihlašovacích údajů Flowstep (e-mail a heslo, nebo Google) a na obrazovce se souhlasem klikněte na **Allow**. Prohlížeč vás přesměruje zpět a token se uloží automaticky. Zadáním `/mcp` v Claude Code ověřte, že je Flowstep připojený.

    <Note>
      Před ověřením potřebujete účet Flowstep. Pokud ho nemáte, nejdřív se zaregistrujte na [app.flowstep.ai](https://app.flowstep.ai).
    </Note>

    ## Krok 3 — Spusťte volání nástroje

    V chatu Claude Code se zeptejte:

    > „Vypiš mi moje soubory Flowstep“

    Claude Code zavolá `list-files` a vrátí seznam vašich souborů. Pokud je odpověď prázdná, nejdřív vytvořte soubor:

    > „Vytvoř nový soubor Flowstep s názvem 'Dashboard'“

    ## Krok 4 — Vygenerujte obrazovku

    ```
    Generate a mobile login screen in Flowstep for a SaaS app with email/password
    fields and a Google sign-in button. After it finishes, show me the image.
    ```

    Claude Code zavolá `ai-generate-screens` (které v jednom kroku vytvoří nový soubor a vygeneruje obrazovky), poté `get-screen-image`. Vykreslený návrh uvidíte přímo v chatu.
  </Tab>
</Tabs>

<Note>
  `ai-generate-screens` a ostatní nástroje AI pro design čerpají z vašeho limitu zpráv Flowstepu. Výpis, čtení a vykreslování obrazovek je zdarma. Viz [Limity použití](/cs/mcp/usage-limits).
</Note>

## Další kroky

* [Referenční dokumentace nástrojů](/cs/mcp/tools): úplná dokumentace vstupů a výstupů všech 23 nástrojů
* [Příklady](/cs/mcp/examples): vícekrokové pracovní postupy
* [Další klienti](/cs/mcp/clients/claude-code): Windsurf, Codex, Claude Desktop, claude.ai


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