MCP hızlı başlangıç

Ön koşullar

Bir Flowstep hesabı (app.flowstep.ai)

claude.ai veya Claude Desktop üzerinde Claude mu kullanıyorsunuz? Flowstep, Claude’un dizininde listelenen bir bağlayıcıdır — claude.ai/directory/flowstep adresinden tek tıkla ekleyin. Bkz. claude.ai.

Cursor
Claude Code

Cursor v0.43+ sürümü gerektirir

Adım 1 — Sunucuyu ekleyin

Tek tıkla yüklemek için Add Flowstep to Cursor seçeneğine tıklayın; ya da ~/.cursor/mcp.json (genel) dosyasını veya proje kökünüzdeki .cursor/mcp.json dosyasını oluşturun ya da düzenleyin:

{
  "mcpServers": {
    "flowstep": {
      "url": "https://api.flowstep.ai/mcp"
    }
  }
}

Kaydettikten sonra Cursor’u yeniden başlatın.

Adım 2 — Kimlik doğrulayın

Cursor MCP panelini (Settings → MCP) açın ve Flowstep’in yanındaki Connect seçeneğine tıklayın. Cursor tarayıcınızı Flowstep oturum açma sayfasına açar. Flowstep kimlik bilgilerinizle (e-posta/parola veya Google) oturum açın, ardından onay ekranında Allow seçeneğine tıklayın. Tarayıcı geri yönlendirir ve Cursor belirteci otomatik olarak kaydeder.

Kimlik doğrulamadan önce bir Flowstep hesabına ihtiyacınız var. Hesabınız yoksa önce app.flowstep.ai adresinden kaydolun.

Adım 3 — Bir araç çağrısı çalıştırın

Bir Cursor sohbetinde şunu sorun:

“Flowstep dosyalarımı listele”

Cursor, list-files çağrısını yapar ve dosya listenizi döndürür. Yanıt boşsa önce bir dosya oluşturun:

“‘Dashboard’ adında yeni bir Flowstep dosyası oluştur”

Adım 4 — Bir ekran oluşturun

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, ai-design-screens çağrısını yapar (bu, yeni bir dosya oluşturur ve ekranları tek adımda üretir), ardından get-screen-image çağrısını yapar. Oluşturulan tasarımı sohbette satır içinde görürsünüz.

Claude Code CLI gerektirir

Adım 1 — Sunucuyu ekleyin

Projenizde şunu çalıştırın:

claude mcp add --transport http flowstep https://api.flowstep.ai/mcp

Sunucuyu ekibinizle paylaşmak için bunun yerine proje kökünüzdeki .mcp.json dosyasına ekleyin:

{
  "mcpServers": {
    "flowstep": {
      "type": "http",
      "url": "https://api.flowstep.ai/mcp"
    }
  }
}

"type": "http" alanı, Claude Code HTTP sunucuları için zorunludur. Cursor’un buna ihtiyacı yoktur.

Adım 2 — Kimlik doğrulayın

Bir Claude Code sohbetinden herhangi bir Flowstep aracını çalıştırın. İlk kullanımda Claude Code, tarayıcınızı Flowstep oturum açma sayfasına açar. Flowstep kimlik bilgilerinizle (e-posta/parola veya Google) oturum açın, ardından onay ekranında Allow seçeneğine tıklayın. Tarayıcı geri yönlendirir ve belirteç otomatik olarak kaydedilir. Flowstep’in bağlı olduğunu kontrol etmek için Claude Code’da /mcp yazın.

Kimlik doğrulamadan önce bir Flowstep hesabına ihtiyacınız var. Hesabınız yoksa önce app.flowstep.ai adresinden kaydolun.

Adım 3 — Bir araç çağrısı çalıştırın

Bir Claude Code sohbetinde şunu sorun:

“Flowstep dosyalarımı listele”

Claude Code, list-files çağrısını yapar ve dosya listenizi döndürür. Yanıt boşsa önce bir dosya oluşturun:

“‘Dashboard’ adında yeni bir Flowstep dosyası oluştur”

Adım 4 — Bir ekran oluşturun

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, ai-design-screens çağrısını yapar (bu, yeni bir dosya oluşturur ve ekranları tek adımda üretir), ardından get-screen-image çağrısını yapar. Oluşturulan tasarımı sohbette satır içinde görürsünüz.

ai-design-screens ve diğer yapay zekâ tasarım araçları Flowstep mesaj kotanızı kullanır. Ekranları listelemek, okumak ve görüntülemek ücretsizdir. Bkz. Kullanım limitleri.

Sonraki adımlar

Araç başvurusu — 22 aracın tamamı için giriş ve çıkış belgeleri
Örnekler — çok adımlı iş akışları
Diğer istemciler — Windsurf, Codex, Claude Desktop, claude.ai

Başlarken

Flowstep Kullanımı

Ekipler ve Organizasyonlar

Dışa Aktarma ve Entegrasyonlar

MCP Sunucusu

Faturalandırma ve Planlar

Güvenlik ve Gizlilik

MCP hızlı başlangıç

Ön koşullar

Adım 1 — Sunucuyu ekleyin

Adım 2 — Kimlik doğrulayın

Adım 3 — Bir araç çağrısı çalıştırın

Adım 4 — Bir ekran oluşturun

Adım 1 — Sunucuyu ekleyin

Adım 2 — Kimlik doğrulayın

Adım 3 — Bir araç çağrısı çalıştırın

Adım 4 — Bir ekran oluşturun

Sonraki adımlar

​Ön koşullar

​Adım 1 — Sunucuyu ekleyin

​Adım 2 — Kimlik doğrulayın

​Adım 3 — Bir araç çağrısı çalıştırın

​Adım 4 — Bir ekran oluşturun

​Adım 1 — Sunucuyu ekleyin

​Adım 2 — Kimlik doğrulayın

​Adım 3 — Bir araç çağrısı çalıştırın

​Adım 4 — Bir ekran oluşturun

​Sonraki adımlar

Ön koşullar

Adım 1 — Sunucuyu ekleyin

Adım 2 — Kimlik doğrulayın

Adım 3 — Bir araç çağrısı çalıştırın

Adım 4 — Bir ekran oluşturun

Adım 1 — Sunucuyu ekleyin

Adım 2 — Kimlik doğrulayın

Adım 3 — Bir araç çağrısı çalıştırın

Adım 4 — Bir ekran oluşturun

Sonraki adımlar