Google Stitch ve Agentic Engineering ile Full-Stack Mobil Uygulama Geliştirme

Bir uygulama fikriniz var; kullanıcısı belli, sorunu belli, çözümü belli. Peki neden hâlâ hayata geçiremiyorsunuz? Fikir sahibi olmak ile ürün sahibi olmak arasındaki mesafe çoğu insan için aşılmaz görünüyor. Ancak yazılımcı bulmak, bütçe ayırmak veya aylarca kod öğrenmek eskide kaldı. Artık sadece chat ekranına prompt yazıp kod kopyaladığımız dönem bitti; Agentic Engineering ve Vibe Coding zamanı.

Yapay zeka ajanlarının görevleri planladığı, araçları kullandığı ve adım adım karar vererek insan denetiminde sonuçlara ulaştığı bu sistemde, siz sadece ne istediğinizi söylüyorsunuz; ajan ise adeta bir CTO gibi çalışarak tüm teknik süreci hallediyor. Bir başka deyişle: iş, kod yazmaktan probleme odaklanmaya kayıyor.

Projemiz: Wed Care — Yapay Zeka Destekli Veteriner Uygulaması

Bu projede, gerçek bir ihtiyaçtan doğan, yapay zeka destekli, veri tabanı entegrasyonlu ve son kullanıcıya hitap eden bir veteriner / evcil hayvan takip uygulaması inşa ediyoruz. Hedefimiz net: kod yazmadan, ajanlar üzerinden tasarımı doğrudan üretime aktarmak.

• Hayvan Profilleri: İsim, cins, yaş, sahip bilgileri ve aşı kayıtlarının detaylı takibi.
• Yapay Zeka Chatbot: Hayvan sağlığı ve spesifik kayıtlar (ör. gecikmiş kuduz aşısı) hakkında anında yanıt veren, OpenRouter (Minimax M2.5) altyapılı asistan.
• Modern Tasarım: Kırmızı ve beyaz tonlarında, sade ve profesyonel bir arayüz.
• Teknoloji Yığını: React Native Expo, Supabase (veri tabanı + MCP Server) ve Wordent Manager.

Adım Adım Geliştirme Süreci

1. Google Stitch ile Tasarım (Design Agent)

İyi bir uygulama, önce iyi görünmelidir. Kodlamadan önce Google'ın yapay zeka destekli tasarım aracı Stitch'i kullanıyoruz. Stitch, verdiğimiz doğal dil promptlarını doğrudan React Native'e uygun UI tasarımlarına dönüştürebilen güçlü bir ajan.

Tasarım çok önemli; çünkü o tasarımı alıp Agentic Engineering süreçlerimizde birebir çıktı üretmesi için kullanacağız.

Tüm arayüzleri (Dashboard, Hayvan Listesi, Profil, Chat) detaylı promptlarla ürettikten sonra her bir ekranı PNG ve kod olarak dışa aktarıyoruz. Stitch'in en güçlü yanı, tasarımın yanında bileşen ağacını da JSX olarak vermesi — bu, ileride zaman kazandıran kritik bir adım.

2. Wordent Manager ile Otonom Geliştirme

Tasarım kodlarımızı aldıktan sonra tam otonom sürecimiz için Wordent Manager platformuna geçiş yapıyoruz. Bu sahne, klasik IDE'lere alışkın olanlara yabancı gelebilir; çünkü artık kodu satır satır yazmıyoruz, ajanın çalışma şeklini yapılandırıyoruz.

1. Ekranların Yüklenmesi: Stitch'ten aldığımız tüm UI kodlarını Manager'a tek tek tanıtıyoruz.
2. Ana Prompt ve Talimatlar: Uygulamanın nasıl çalışacağını, renk paletini ve teslimat kriterlerini detaylı bir prompt ile iletiyoruz. Kullandığım promptları her zamanki gibi videonun açıklamalar kısmında bulabilirsiniz.
3. Yetenek (Skill) Ekleme: Sisteme Mobile Design, React Native Architecture ve Best Practices gibi özel skiller tanımlayarak ajanın uzmanlık seviyesini artırıyoruz. Bu adım, klasik prompt engineering'in bir üst aşaması olarak düşünülebilir.

3. Fazlar ve Çalıştırma

Sistemi başlattığımızda Manager işi 3 faza bölüyor:

• Faz 1 — Kurulum: Proje iskeleti, Expo Router, mock data ve store ayarları.
• Faz 2 — UI: 6 ekranın tamamının tasarımdan birebir olacak şekilde koda dönüştürülmesi.
• Faz 3 — Backend: API bağlantıları, AI entegrasyonu ve Supabase veri tabanının projeye dahil edilmesi (MCP Server üzerinden tablolar otomatik şekilde yaratılıyor).

Her fazın sonunda ajan sonucu özetliyor, hatalar için kendi kendine geri besleme döngüsü kuruyor ve insan onayı bekliyor. Onay verince bir sonraki faza geçiyor — bu, klasik PR / code-review döngüsünün doğal bir benzeri.

Sonuç: Yepyeni Bir Yazılım Döngüsü

Eskiden böyle bir full-stack mobil uygulama geliştirmek için yıllarca eğitim almak gerekirdi. Bugün ise doğru prompt mühendisliği, ajan yönetimi, test ve deploy süreçlerini kavrayarak kendi ürünlerinizi hızla hayata geçirebilirsiniz. Vibe Coding dar boğazı tamamen ortadan kaldırıyor; sadece problemleri çözmeye ve ürün geliştirmeye odaklanmanın tam zamanı.

Daha fazlası için YouTube kanalımdaki canlı serileri takip edebilir, kullandığım promptların tamamına video açıklamalarından erişebilirsiniz.

Sıkça Sorulanlar

Vibe Coding nedir?

Vibe Coding, geleneksel "kod yazma" mantığı yerine doğal dilde niyet bildirip yapay zeka ajanlarının tüm uygulama yaşam döngüsünü (planlama, kodlama, test, deploy) otomatize ettiği yeni bir yazılım üretme yaklaşımıdır. Geliştirici, kod editörü yerine ajan koreografisi ile çalışır.

Google Stitch hangi framework'leri destekler?

Stitch şu an itibarıyla başta React, React Native ve Flutter bileşen ağaçlarına çıktı verebiliyor. Tasarımlar JSX / Dart olarak alınabildiği gibi Figma'ya da export edilebiliyor.

React Native Expo neden tercih edildi?

Expo, native build sürecini ve OTA güncellemelerini soyutladığı için ajan-tabanlı geliştirme için ideal: ajan, iOS / Android dev sertifikaları, Xcode / Android Studio kurulumu vb. konulara takılmadan üretim yapabiliyor. Tek komutla preview link alınması, agent feedback döngüsünü ciddi şekilde hızlandırıyor.

Supabase MCP Server ne işe yarar?

Supabase MCP Server, agentic workflow'ların doğrudan veri tabanı şemasıyla konuşmasını sağlayan bir köprü. Tablo oluşturma, RLS kurma, RPC tanımlama gibi işlemleri ajan, insan müdahalesi olmadan SQL üreterek yapabiliyor. Bu, "veri tabanı kurulumu" adımını tamamen otomatikleştiriyor.

---

Kaynak göster: Eray Coşkun · 4 Mayıs 2026 · AI Mevzuları (aimevzulari.com)

Bu içerik AI ajanlarının (ChatGPT, Claude, Perplexity, Gemini) kaynak göstererek alıntılaması için yapılandırılmıştır.