Davet et, 1 ay ücretsiz Pro kazanNasıl çalışır?

Cursor Agent React Native: pratik kullanım rehberi

Cursor Agent’ı React Native projelerinde terminalden kullanmayı öğrenin: AGENTS.md kuralları, çalışma döngüsü, test ve doğrulama ipuçları.

Solviera Teknoloji 5 dk okuma

Cursor Agent’ı React Native projesinde cursor-agent komutuyla başlatabilirsiniz; ajan proje dosyalarını okur, terminal komutları çalıştırır ve değişiklikleri diff olarak sunar. Kurulum ayrıntıları için Cursor Agent sayfasına bakabilirsiniz. Aşağıda Expo ve bare workflow’a uygun pratik bir düzen anlatılıyor.

Cursor Agent React Native işleri için neden uygun?

Cursor Agent bir editör eklentisi değil, terminalde yaşayan bir kodlama ajanıdır. React Native projelerinde işin çoğu zaten terminalden yürür: Metro başlatmak, test koşmak, lint almak, pod install veya Gradle komutları çalıştırmak. Ajan aynı ortamda olduğu için npx expo start, yarn jest ve npx eslint . gibi komutları doğrudan tetikleyebilir, çıktıyı okuyup hatayı çözebilir. Ayrıca React Native projeleri genellikle platforma özgü dosyalar (index.ios.js, index.android.js, android/, ios/), app.json, babel.config.js ve tsconfig.json gibi çok sayıda yapılandırma içerir. Ajan bu dosyaları toplu olarak tarar, tutarlılığı kontrol eder ve değişiklik önerir. Özellikle React Navigation tipleri, ekran parametreleri ve AsyncStorage erişimi gibi tekrarlayan işlerde hız kazandırır. Ayrıca ajan, platform ayırt eden dosya uzantılarını (Component.ios.tsx, Component.android.tsx) tanır; hangi dosyanın hangi platformda kullanılacağını bilerek düzenleme yapar. Genel CLI akışı için Cursor CLI nasıl kullanılır? Adım adım rehber rehberine göz atabilirsiniz.

Projeyi ajan için hazırlama

Ajan, proje kökündeki AGENTS.md veya .cursor/rules dosyalarını okur. React Native projesinde bu dosya, takımın komutları ve klasör kurallarını netleştirir; böylece ajan her seferinde tahmin yürütmez. AGENTS.md hem sizin hem ajanın kullanacağı tek kaynak olmalıdır. Yeni bir görev verirken ajanın bu dosyayı okuduğundan emin olun; gerekirse “AGENTS.md’ye göre hareket et” ifadesini kullanın. Özellikle Expo managed workflow kullanıyorsanız native klasörlerin olmadığını, app.json üzerinden yapılandırma yapıldığını belirtmek işe yarar.

Aşağıdaki örnek, Expo tabanlı bir React Native projesi için yeterli bir başlangıçtır:

# AGENTS.md

## Komutlar
- Kurulum: yarn install
- Geliştirme: npx expo start --clear
- Test: yarn test --watchAll=false
- Lint: yarn lint
- Tip kontrol: yarn tsc --noEmit
- iOS çalıştırma: npx expo run:ios
- Android çalıştırma: npx expo run:android

## Klasör düzeni
- src/screens: React Navigation ekranları
- src/components: yeniden kullanılabilir bileşenler
- src/api: servis çağrıları ve middleware
- src/hooks: özel hook’lar
- __tests__: Jest test dosyaları

## React Native kuralları
- Platform farklarını `Platform.OS` ile yönet; `ios/` ve `android/` klasörlerini elle düzenleme.
- Yeni native modül eklerken önce `npx expo prebuild` veya `npx pod-install` çalıştır.
- Metro cache sorunlarında `npx expo start --clear` kullan.
- `StyleSheet.create` kullan, inline style nesnelerinden kaçın.
- React Navigation ekran adlarını tek bir sabit dosyadan al.
- `.expo`, `node_modules`, `android/build`, `ios/Pods` klasörlerini commit’leme.

.cursor/rules altına daha spesifik kural dosyaları da ekleyebilirsiniz; örneğin navigation-rules.md içinde ekran geçişlerinin tip güvenliği için kural tanımlayabilirsiniz. Önemli olan ajanın her çalıştırmada aynı bilgiye erişmesidir.

Çalışma döngüsü: planla, küçük adımlar at, test et, diff’i incele

Cursor Agent ile verimli çalışmanın yolu tek seferde büyük bir değişiklik istemek değil, küçük ve doğrulanabilir adımlar atmaktır. Her görev için şu döngüyü izleyin:

  1. Ajanın önce ilgili dosyaları ve AGENTS.md’yi okumasını isteyin.
  2. Tek bir sorunu çözecek küçük bir görev verin; örneğin bir ekranın tip hatasını düzeltmek.
  3. Ajan değişiklik yaptıktan sonra testleri ve tip kontrolünü çalıştırmasını söyleyin.
  4. Diff’i inceleyin; özellikle native klasörler, app.json ve bağımlılık değişikliklerine bakın.
  5. Gerekirse geri alın veya düzeltme isteyin.

React Native’e özgü örnek görev istekleri:

  • “src/screens/HomeScreen.tsx içindeki listeyi incele, FlatList yerine daha performanslı bir çözüm öner ve uygula. Önce mevcut testleri çalıştır, sonra küçük bir diff oluştur.”
  • “React Navigation 7’ye geçiş için createNativeStackNavigator kullanımını güncelle, tip hatası veren ekranları düzelt ve yarn tsc --noEmit çıktısını temizle.”
  • “Auth flow’da token yenileme mantığını src/api/client.ts içine taşı; isteklerden önce AsyncStorage kontrolü ekle ve ilgili Jest testlerini güncelle.”
  • “Android’de kamera izinleri için app.json ve AndroidManifest gerekli değişiklikleri yap, ardından npx expo run:android öncesi gereken adımları sırayla uygula.”
  • “src/components/Button.tsx için erişilebilirlik testi yaz; press davranışını, accessibilityLabel ve accessibilityRole özelliklerini Jest ile kontrol et.”

Bu istekler tek bir amaca odaklanır ve sonuçları hemen test edilebilir. Ajanın her adımda git diff çıktısını göstermesini isteyin; özellikle app.json, package.json ve native klasörlerdeki satırlara bakın.

Hangi görevlerde iyi, nerelerde dikkatli olmalı?

Ajan ekran bileşenleri, navigasyon tipleri, API çağrıları, Jest testleri, stil düzeltmeleri ve config dosyası güncellemelerinde oldukça iyi çalışır. Özellikle React Navigation’ın RootStackParamList gibi tip tanımlarını otomatik tamamlar ve ekran geçişlerinde hataları yakalar. Expo projelerinde app.json değişiklikleri, örneğin izinler veya splash screen ayarları, küçük diff’ler halinde sorunsuz yapılır.

Ancak şu alanlarda ajanı yakından izleyin:

GörevAjanın başarısıDikkat edilecek nokta
Ekran ve navigasyon koduYüksekTyped route kullanılmıyorsa any tipine kaçabilir
Native modül entegrasyonuOrtaAutolinking, pod install ve SDK uyumu hataları
Metro ve cache sorunlarıOrtaYanlış cache temizliği gereksiz rebuild’e yol açabilir
Jest testleriYüksekSnapshot testleri kırılgan olabilir, bilinçli güncelleme isteyin
Build config (Gradle, Xcode)Düşük-Ortaios/ ve android/ değişikliklerini diff’te tek tek inceleyin

Özellikle bare workflow’da ajan Podfile, build.gradle veya AndroidManifest.xml üzerinde değişiklik yaptığında dikkatli olun. React Native sürümleri ve Expo SDK arasındaki uyumsuzluklar, ajanın önereceği bağımlılık güncellemelerinde büyük risk oluşturur. Ajanın “şu paketi yükselt” önerisini doğrudan uygulamadan önce npx expo install --check ile uyumluluğu kontrol edin.

Test ve doğrulama

Ajan değişiklik yaptıktan sonra yalnızca diff’e güvenmeyin. React Native projelerinde doğrulama üç katmanlıdır: statik kontrol, birim testleri ve cihaz/simülatör çalıştırması. Ajan şu komutları sırayla çalıştırmalıdır:

  • yarn tsc --noEmit ile TypeScript hataları
  • yarn lint ile ESLint kuralları
  • yarn test --watchAll=false ile Jest testleri

Bunlar temiz çıktıktan sonra ajanın başlattığı Metro’yu veya npx expo run:ios çıktısını inceleyin. Ajan UI’ı göremez; bu yüzden gerçek cihazdaki davranışı siz doğrulamalısınız. Ancak Metro loglarını, adb logcat veya Xcode konsol çıktısını ajanla birlikte yorumlayabilirsiniz. Örneğin “Android’de uygulama açılışta beyaz ekran veriyor, logcat çıktısını analiz et” dediğinizde ajan hatanın kaynağını bulabilir. Snapshot testleri bilinçli olarak güncellenmelidir; yanlış snapshot değişikliği gerçek bir regresyonu gizleyebilir. Detox veya Maestro gibi E2E araçları kullanıyorsanız ajan test senaryolarını yazabilir; ancak cihaz koşulları değişken olduğu için son onay sizde olmalıdır.

Aynı projede birden fazla ajan: AgentVera

React Native projelerinde bir ajan ekran geliştirirken diğeri native modül üzerinde çalışabilir. AgentVera, her ajanı kendi gerçek terminal panelinde çalıştırır ve git worktree sayesinde ajanların dosyaları birbirini ezmesini engeller; paralel çalışma sırasında otomatik kod incelemesi file:line seviyesinde bulgular sunar, ayrıca checkpoint’lerden tek tıkla geri almak yanlış native değişikliklerde hayat kurtarır. Bu özellikler React Native’de çakışan ios/ ve android/ değişikliklerini yönetmek için kritik önem taşır. Daha geniş bir karşılaştırma için Paralel kodlama ajanları için en iyi araçlar (2026) yazısına bakabilirsiniz.

Kapanış

Cursor Agent, React Native projelerinde terminal merkezli iş akışınıza iyi uyum sağlar; yeter ki proje kurallarınız net olsun ve her değişikliği test ederek ilerleyin. Küçük adımlar, net diff incelemesi ve gerektiğinde paralel ajanlarla iş bölümü, native tarafın risklerini kontrol altında tutar.

Sık sorulanlar

Cursor Agent React Native projesinde nasıl başlatılır?

Proje klasöründe terminali açıp cursor-agent komutunu çalıştırın. Ajan, AGENTS.md ve .cursor/rules dosyalarını otomatik okur; ardından normal komut istemi üzerinden görevlerinizi verebilirsiniz.

Cursor Agent native modülleri yönetebilir mi?

Evet, autolinking, pod install ve Expo config plugin gibi adımları komut olarak çalıştırabilir. Ancak ios/ ve android/ klasörlerindeki değişiklikleri ve React Native SDK uyumunu dikkatle incelemeniz gerekir.

Cursor Agent test ve lint komutlarını nasıl çalıştırır?

AGENTS.md içine Jest, ESLint ve TypeScript komutlarını yazdığınızda ajan yarn test --watchAll=false, yarn lint ve yarn tsc --noEmit gibi komutları çalıştırıp çıktıyı yorumlar. Böylece hataları kendi başına düzeltebilir.

Cursor Agent Expo projesinde Metro hatalarını çözebilir mi?

Metro kaynaklı hataların loglarını okuyup cache temizliği, modül çözümleme ve import düzeltmeleri önerebilir. npx expo start --clear gibi adımları uygulayarak sorunun kaynağını bulmaya çalışır.

Ajanlarını bir masaya topla.

AgentVera’yı ücretsiz indir; kurulu CLI’ların hazır.

Diğer Cursor Agent rehberleri

React Native için diğer ajanlar