> ## 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.

# Inici ràpid de MCP

> Connecta Flowstep al teu editor d'IA i executa la teva primera crida de ferramenta.

## Requisits previs

* Un compte de Flowstep ([app.flowstep.ai](https://app.flowstep.ai))

<Tabs>
  <Tab title="Cursor">
    **Requereix Cursor v0.43+**

    ## Pas 1 — Afegeix el servidor

    Crea o edita `~/.cursor/mcp.json` (global) o `.cursor/mcp.json` a la root del teu projecte:

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

    Reinicia Cursor després de guardar.

    ## Pas 2 — Autentica't

    Obri el panell MCP de Cursor (Configuració → MCP) i feu clic a **Connect** al costat de Flowstep. Cursor obri el teu navegador a l'inici de sessió OAuth de Flowstep. Inicia sessió amb les teves credencials de Flowstep (correu electrònic/contrasenya o Google). El navegador et redirigeix enrere i Cursor emmagatzema el token automàticament.

    <Note>
      Necessites un compte de Flowstep abans d'autenticar-te. Si no en tens un, registra't a [app.flowstep.ai](https://app.flowstep.ai) primer.
    </Note>

    ## Pas 3 — Executa una crida de ferramenta

    En un xat de Cursor, pregunta:

    > "Llista els meus fitxers de Flowstep"

    Cursor crida a `list-files` i retorna la teva llista de fitxers. Si la resposta està buida, crea un fitxer primer:

    > "Crea un nou fitxer de Flowstep anomenat 'Dashboard'"

    ## Pas 4 — Genera una pantalla

    ```
    Create a new Flowstep file called "Login flow", then generate a mobile login screen
    for a SaaS app with email/password fields and a Google sign-in button.
    After it finishes, show me the image.
    ```

    Cursor crida a `create-new-design` (que crea el fitxer i genera les pantalles en un pas), a continuació `get-screen-image`. Veuràs el disseny representat en línia al xat.
  </Tab>

  <Tab title="Claude Code">
    **Requereix CLI de Claude Code**

    ## Pas 1 — Afegeix el servidor

    Crea `.mcp.json` a la root del teu projecte (abast del projecte) o `~/.claude/mcp.json` (global):

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

    <Note>
      El camp `"type": "http"` és obligatori per als servidors HTTP de Claude Code. Cursor no el necessita.
    </Note>

    ## Pas 2 — Autentica't

    Executa qualsevol ferramenta de Flowstep des d'un xat de Claude Code. En el primer ús, Claude Code obri el teu navegador a l'inici de sessió OAuth de Flowstep. Inicia sessió amb les teves credencials de Flowstep (correu electrònic/contrasenya o Google). El navegador et redirigeix enrere i el token s'emmagatzema automàticament.

    <Note>
      Necessites un compte de Flowstep abans d'autenticar-te. Si no en tens un, registra't a [app.flowstep.ai](https://app.flowstep.ai) primer.
    </Note>

    ## Pas 3 — Executa una crida de ferramenta

    En un xat de Claude Code, pregunta:

    > "Llista els meus fitxers de Flowstep"

    Claude Code crida a `list-files` i retorna la teva llista de fitxers. Si la resposta està buida, crea un fitxer primer:

    > "Crea un nou fitxer de Flowstep anomenat 'Dashboard'"

    ## Pas 4 — Genera una pantalla

    ```
    Create a new Flowstep file called "Login flow", then generate a mobile login screen
    for a SaaS app with email/password fields and a Google sign-in button.
    After it finishes, show me the image.
    ```

    Claude Code crida a `create-new-design` (que crea el fitxer i genera les pantalles en un pas), a continuació `get-screen-image`. Veuràs el disseny representat en línia al xat.
  </Tab>
</Tabs>

## Passos següents

* [Referència de les eines](/ca/mcp/tools) — documentació completa d'entrada/sortida de les 20 eines
* [Exemples](/ca/mcp/examples) — fluxos de treball de diversos passos
* [Altres clients](/ca/mcp/clients/claude-code) — Windsurf, Claude Desktop, claude.ai