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

# MCP Tez Boshlash

> Flowstep-ni o'zingizning AI muharriri bilan bog'lang va birinchi asbob chaqiruvini bajaring.

## Boshlang'ich talablar

* Flowstep akkaunt ([app.flowstep.ai](https://app.flowstep.ai))

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

    ## 1-qadam — Serverni qo'shish

    `~/.cursor/mcp.json` (global) yoki proyekt ildizida `.cursor/mcp.json` yarating yoki tahrirlang:

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

    Saqlashdan keyin Cursor-ni qayta ishga tushiring.

    ## 2-qadam — Autentifikatsiya

    Cursor MCP panelini oching (Settings → MCP) va Flowstep yonida **Connect** tugmasini bosing. Cursor brauzeringizni Flowstep OAuth login sahifasiga ochadi. Flowstep hisob ma'lumotlari (elektron pochta/parol yoki Google) bilan kirish. Brauzer orqaga yo'naltiradi va Cursor token-ni avtomatik saqlaydi.

    <Note>
      Autentifikatsiyadan oldin Flowstep akkauntingiz bo'lishi kerak. Agar akkauntingiz bo'lmasa, avval [app.flowstep.ai](https://app.flowstep.ai) da roʻyxatdan oʻting.
    </Note>

    ## 3-qadam — Asbob chaqiruvini bajarish

    Cursor chatida so'roq qo'ying:

    > "List my Flowstep files"

    Cursor `list-files` chaqiradi va fayl ro'yxatini qaytaradi. Agar javob bo'sh bo'lsa, avval fayl yarating:

    > "Create a new Flowstep file called 'Dashboard'"

    ## 4-qadam — Ekran yaratish

    ```
    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 `create-new-design` chaqiradi (fayl yaratadi va bir bosqichda ekranlarni yaratadi), keyin `get-screen-image` chaqiradi. Siz chatda dizayn rasmini ko'rasiz.
  </Tab>

  <Tab title="Claude Code">
    **Claude Code CLI talab qiladi**

    ## 1-qadam — Serverni qo'shish

    Proyekt ildizida `.mcp.json` (proyekt-doirali) yoki `~/.claude/mcp.json` (global) yarating:

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

    <Note>
      Claude Code HTTP serverlari uchun `"type": "http"` maydoni talab qilinadi. Cursor unga ehtiyoj yo'q.
    </Note>

    ## 2-qadam — Autentifikatsiya

    Claude Code chatidan istalgan Flowstep asbobni ishga tushiring. Birinchi marta ishlatilganda, Claude Code brauzeringizni Flowstep OAuth login sahifasiga ochadi. Flowstep hisob ma'lumotlari (elektron pochta/parol yoki Google) bilan kirish. Brauzer orqaga yo'naltiradi va token avtomatik saqlanaadi.

    <Note>
      Autentifikatsiyadan oldin Flowstep akkauntingiz bo'lishi kerak. Agar akkauntingiz bo'lmasa, avval [app.flowstep.ai](https://app.flowstep.ai) da roʻyxatdan oʻting.
    </Note>

    ## 3-qadam — Asbob chaqiruvini bajarish

    Claude Code chatida so'roq qo'ying:

    > "List my Flowstep files"

    Claude Code `list-files` chaqiradi va fayl ro'yxatini qaytaradi. Agar javob bo'sh bo'lsa, avval fayl yarating:

    > "Create a new Flowstep file called 'Dashboard'"

    ## 4-qadam — Ekran yaratish

    ```
    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 `create-new-design` chaqiradi (fayl yaratadi va bir bosqichda ekranlarni yaratadi), keyin `get-screen-image` chaqiradi. Siz chatda dizayn rasmini ko'rasiz.
  </Tab>
</Tabs>

## Keyingi qadamlar

* [Tools reference](/uz/mcp/tools) — barcha 20 vositaning to'liq kirish/chiqish dokumentlari
* [Examples](/uz/mcp/examples) — ko'p bosqichli ish oqimlari
* [Other clients](/uz/mcp/clients/claude-code) — Windsurf, Claude Desktop, claude.ai