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

# Flowstep MCP — Windsurf

> Verbinden Sie Flowstep mit Windsurf über den Streamable HTTP MCP-Transport.

## Konfiguration

Bearbeiten Sie `~/.codeium/windsurf/mcp_config.json`:

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

Starten Sie Windsurf nach dem Speichern neu.

## Authentifizierung

Beim ersten Mal öffnet Windsurf Ihren Browser auf der Flowstep OAuth-Anmeldungsseite. Melden Sie sich mit Ihren Flowstep-Anmeldedaten (E-Mail/Passwort oder Google SSO) an und Windsurf speichert das Token.

<Note>
  Sie benötigen ein Flowstep-Konto, bevor Sie eine Verbindung herstellen. Erstellen Sie eines unter [app.flowstep.ai](https://app.flowstep.ai).
</Note>

## Verbindung überprüfen

Öffnen Sie das MCP-Panel in Windsurf und bestätigen Sie, dass Flowstep aufgeführt ist. In einem Cascade-Chat:

```
List my Flowstep files
```

## Verwendungsbeispiel

```
Create a Flowstep file called "Empty states", then generate a mobile empty-state screen
for a task list app with an illustration placeholder and a call-to-action button.
Show me the rendered result.
```