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

> Flowstep-ni MCP serveri sifatida ishlating, Cursor, Claude Code yoki istalgan MCP-ga mos keladigan klientdan to'g'ridan-to'g'ri UI dizaynlarini yaratish, tekshirish va boshqarish.

Flowstep o'zining dizayn vositalarini [Model Context Protocol](https://modelcontextprotocol.io/) orqali taqdim etadi, bu esa sizning AI yordamchisiga muharriringizni tark etmasdan UI ekranlarini yaratish va takroriy ishlov berish imkonini beradi.

Server `https://api.flowstep.ai/mcp` manziliga joylashtirilgan (Streamable HTTP transport). Mahalliy jarayon ishlatish kerak emas.

## Siz nima qila olasiz

Server yetti kategoriya bo'yicha 20 vositani taqdim etadi:

| Kategoriya        | Vositalar                                                                                     |
| ----------------- | --------------------------------------------------------------------------------------------- |
| **Fayllar**       | `create-file`, `list-files`, `get-file`, `update-file`, `delete-file`                         |
| **Ekranlar**      | `list-screens`, `get-screen`, `get-screen-image`, `add-screen`                                |
| **AI generation** | `create-new-design`, `regenerate-design`, `expand-design`, `edit-design`, `upload-attachment` |
| **Chat**          | `get-chat-history`                                                                            |
| **Dizayn**        | `get-design-guidelines`, `update-design-guidelines`, `delete-design-guidelines`               |
| **Figma**         | `import-figma`                                                                                |
| **Hisob-kitob**   | `get-plan-details`                                                                            |

## Keng tarqalgan foydalanish holatlari

**Promptdan ekran yarating** — `create-new-design` ni tavsif bilan chaqiring. Flowstep fayl va ekranlarni bir qadamda yaratadi. Natijani qatorida ko'rish uchun qaytarilgan `screenIds` bilan `get-screen-image`ni chaqiring.

**React komponentini tasavvur qiling** — `upload-attachment` orqali `.jsx` yoki `.tsx` faylini yuklang (`mimeType: text/javascript` dan foydalaning), keyin qaytarilgan qo'shimchani `create-new-design` ga komponentni tavsiflovchi xabar bilan o'tkazing. Flowstep manba kodini o'qiydi va mos keladigan dizayn ekranini yaratadi.

**Dizaynni takroriy ishlov bering** — `edit-design` ni maqsadli `screenId` va uni o'zgartirishga ko'rsatmalar bilan chaqiring, yoki ekranni noldan qayta qurish uchun `regenerate-design` dan foydalaning.

**Dizayn yo'riqnomalarini saqlang** — `get-design-guidelines` ni chaqiring, sizning hozirgi uslub qoidalarini (ranglar, tipografiya, bo'shliq, ton) olish uchun, keyin `update-design-guidelines` dan foydalaning, ular dizayning rivojlanishi bilan sinxron qolishini ta'minlash uchun. Izchil yo'riqnomalarni `create-new-design` yoki `edit-design` ga o'tkazish har bir yaratilgan ekranning brendda qolishini ta'minlaydi. Ularni to'liq qayta tiklash uchun `delete-design-guidelines` dan foydalaning.

**Figma-dan import qilish** — `import-figma` ni Figma ramka havolasi va `fileId` bilan chaqiring, ramkani Figma-dan Flowstep fayliga tahrirlanadigun elementlar sifatida olish uchun. Faylning tashkiloti avval Figma ulangan bo'lishi kerak.

**Kvotani tekshiring** — `get-plan-details` ni chaqiring, yaratishlarning partiyasini boshlashdan oldin qolgan kunlik va oylik foydalanishni ko'rish uchun.

## Endpoint

```
https://api.flowstep.ai/mcp
```

Transport: Streamable HTTP. Session model: stateless (har bir so'rov mustaqil, sessiya ID yo'q).

## Keyingi qadamlar

<CardGroup cols={2}>
  <Card title="Boshlash" icon="bolt" href="/uz/mcp/quickstart">
    Cursor bilan 5 daqiqadan quyi vaqtda birinchi vosita chaqiruvsi.
  </Card>

  <Card title="Autentifikatsiya" icon="lock" href="/uz/mcp/authentication">
    OAuth 2.1 PKCE qanday ishlaydi va tokenlar qanday chiqariladi.
  </Card>

  <Card title="Vositalar" icon="wrench" href="/uz/mcp/tools">
    Barcha 20 vositalar uchun to'liq kirish/chiqish havolasi.
  </Card>

  <Card title="Misollar" icon="code" href="/uz/mcp/examples">
    Keng tarqalgan vazifalar uchun oxir tutashtirilgan iş jarayonlari.
  </Card>
</CardGroup>