---
title: Cursor / Claude Code ile App Geliştirme
description: Cursor, Claude Code gibi AI IDE ya da araçları kullanarak uygulamanızı geliştirin
---

LLM tabanlı araçlar (örn. **Cursor**, **Codex**, **Claude Code**) ile birlikte ikas CLI ve GraphQL API'lerini kullanarak uygulamanızın temel bileşenlerini dakikalar içinde oluşturabilirsiniz. Development kiti indirdiğinizde içerisinde cursor rules, context7 MCP ve shadcn/ui MCP hazır olarak gelecektir.

## Cursor

<video controls width="1024">
  <source src="/media/ikas-partners-photo-quick-start/cursor-rules-vid.mp4" type="video/mp4" />
  Cursor Rules videosu yüklenemedi.
</video>

## Claude Code

Claude Code ile geliştirme yapmak için önce kod editörünüzün extension bölümünden kurulumu gerçekleştirin.
<video controls width="1024">
  <source src="/media/ikas-partners-photo-quick-start/CLADUE-code-vid.mp4" type="video/mp4" />
  Claude Code videosu yüklenemedi.
</video>

Claude Code ile ilgili daha fazlası için [Anthropic'in sayfasını](https://docs.anthropic.com/en/docs/claude-code/setup) inceleyebilirsiniz.

## MCP Sunucularını Etkinleştirme

ikas CLI ile oluşturulan projeler, varsayılan olarak shadcn/ui ve ikas MCP sunucularıyla birlikte gelir. Bu video, bu MCP sunucularını nasıl etkinleştireceğinizi gösterir:

<video controls width="1024">
  <source src="/media/ikas-partners-photo-quick-start/mcp-video-tutorial.mp4" type="video/mp4" />
  MCP sunucuları etkinleştirme videosu yüklenemedi.
</video>

## Örnek Uygulama Geliştirme

AI kod editörleri kullanarak ikas uygulaması nasıl geliştirileceğini gösteren pratik örnek:

<video controls width="1024">
  <source src="/media/ikas-partners-photo-quick-start/ikas-quick-start-cli-commands/claude-code-ikas-cli-ex.mp4" type="video/mp4" />
  Örnek uygulama geliştirme videosu yüklenemedi.
</video>

Bu videoda, Cursor veya diğer LLM tabanlı kod editörleri kullanarak:
- Proje kurulumundan başlayarak
- MCP sunucularını etkinleştirme
- AI yardımı ile kod yazma
- Temel bir ikas uygulaması oluşturma sürecini adım adım görebilirsiniz.


### Test ve Doğrulama

AI ile geliştirdiğiniz uygulamayı test etmek için:

```bash
ikas app dev
```

Bu komut çalıştırıldığında:
1. **Mağaza Seçimi**: Test mağazanızı seçin
2. **Cloudflare Tunnel**: Otomatik tunnel kurulumu
3. **ikas Admin Panel**: Tarayıcı açılarak kimlik doğrulama
4. **Başarılı Bağlantı**: "Congratulations!" mesajı ile onay

<Callout type="info" title="Test Ortamı">
Uygulamanız ikas admin paneline bağlandıktan sonra:
- AI ile geliştirilen özellikler gerçek veri ile test edilebilir
- GraphQL sorgular test mağazasından veri çeker
- Değişiklikler gerçek zamanlı olarak görülebilir

Detaylı test süreci için [ikas CLI](/docs/app-development/admin-app-quick-start/ikas-cli#ikas-app-dev) sayfasındaki adım adım rehberi inceleyin.
</Callout>

---

## Ruler Configuration (AI Geliştirme Desteği)

### Ruler Nedir?
Ruler, AI agentların (Claude, Cursor, etc.) proje kurallarını ve konfigürasyonlarını yönetmek için kullanılan bir araçtır. Projede `.ruler` klasörü altında yapılandırma dosyaları bulunur.

### MCP Server Konfigürasyonu
Projede önceden konfigüre edilmiş MCP sunucuları:

| MCP Server | Kullanım Amacı | Komut |
|------------|----------------|--------|
| **[shadcn](https://ui.shadcn.com/)** | UI bileşen üretimi ve örnekleri - [MCP Docs](https://ui.shadcn.com/docs/mcp) | `npx shadcn@latest mcp` |
| **ikas** | GraphQL API keşfi ve introspection | `https://api.myikas.com/api/v2/admin/mcp` |

<Callout type="info" title="Ruler Konfigürasyon Detayları">
**`.ruler/ruler.toml` Dosya Yapısı**
- MCP sunucuları otomatik yapılandırılmış
- shadcn MCP: stdio tabanlı (npx shadcn@latest mcp)
- ikas MCP: HTTP tabanlı (api.myikas.com/api/v2/admin/mcp)
- Gitignore güncellemeleri devre dışı (enabled = false)

**AI Agent Desteği**
- Claude, Cursor, Copilot ve diğer AI agent'lar için hazır
- default_agents konfigürasyonu mevcut (opsiyonel)
- Agent-specific output path'leri ayarlanabilir
</Callout>

### AI Kurallarını Uygulama
Proje kurallarını AI agentlarına uygulamak için:

```bash
pnpm apply:ai-rules
```

Bu komut `.ruler` konfigürasyonunu kullanarak AI ajanlarının proje kurallarına uygun kod üretmesini sağlar.

---

## MCP ile Geliştirme Süreci

MCP sunucularını kullanarak AI destekli geliştirme yaparken önerilen iş akışı:

<Callout type="info" title="MCP Tabanlı Geliştirme">
**GraphQL API Keşfi (ikas MCP)**
- `ikas list` komutu ile mevcut GraphQL operasyonlarını keşfet
- `ikas introspect` ile operasyon detaylarını ve şemasını öğren
- Gerekli query/mutation'ın tam yapısını AI'ya anlat

**UI Bileşen Geliştirme (shadcn MCP)**
- `shadcn list` ile mevcut bileşenleri keşfet
- `shadcn view` ile bileşen kodunu incele
- AI'dan istediğin bileşeni projeye entegre etmesini iste

**Geliştirme Döngüsü**
1. MCP ile API/bileşen keşfi yap
2. AI'ya context ver ve istediğin özelliği anlat
3. AI'ın ürettiği kodu incele ve test et
4. İhtiyaç durumunda MCP ile ek bilgi al ve iyileştir
</Callout>

---

## MCP Kullanım Kuralları

MCP sunucularını kullanırken dikkat edilmesi gereken önemli kurallar:

<Callout type="warning" title="MCP Güvenlik Kuralları">
**API Token ve Gizli Bilgiler**
- API token'ları ve secret'ları asla log'lamayın
- Gizli bilgileri environment variable'lar ile yönetin
- Local env dosyalarını VCS'den hariç tutun

**Kod Güvenliği**
- Gizli bilgileri expose eden veya log'layan kod yazmayın
- Secret'ları ve key'leri asla repository'ye commit etmeyin
- Güvenlik best practice'lerini her zaman uygulayın
</Callout>

<Callout type="info" title="MCP Geliştirme En İyi Uygulamaları">
**ikas MCP Server Kullanımı**
- GraphQL operasyonlarını keşfetmek için `list` komutunu kullanın
- Detaylı şema bilgisi için `introspect` komutunu kullanın
- Query/mutation'ların tam yapısını AI'ya açıklayın

**shadcn MCP Server Kullanımı**
- Mevcut bileşenleri keşfetmek için `list` komutunu kullanın
- Bileşen kodunu incelemek için `view` komutunu kullanın
- AI'dan bileşeni projeye entegre etmesini isteyin

**Genel MCP Kuralları**
- MCP sunucularının güncel dokümantasyonunu takip edin
- API endpoint'lerinin rate limit'lerine dikkat edin
- Hata durumlarında uygun error handling yapın
</Callout>