Yapay Zekâyla Yapılmış Bir Uygulama Nasıl Hata Ayıklanır: Pratik Yöntem

Yapay zekâyla yapılmış bir uygulamada hata ayıklamak için önce hatayı kasıtlı olarak yeniden tetikleyin, sonra kanıt toplayın — tam adımlar, hata mesajı ve tarayıcı konsolu ile ağ sekmesinin gösterdikleri — ve bunu yapay zekâya "X yaptım, Y bekledim, Z oldu" şeklinde verin. Bir düzeltme işleri daha da kötüleştirirse, düzeltmeleri üst üste yığmak yerine son çalışan sürüme geri dönün. Bunların hiçbirini iyi yapmak için kodu okumanız gerekmez.

Bu rehber, teknik olmayan kullanıcılar için kısa bir tarayıcı geliştirici araçları turu dahil olmak üzere tüm döngüyü kapsar.

Hata ayıklama döngüsü

Her hata düzeltmesi, bir kişi ya da yapay zekâ tarafından yapılsın, aynı döngüyü izler:

1. Yeniden üretin — hatayı güvenilir biçimde tekrar oluşturun.
2. Gözlemleyin — hata mesajını ve uygulamanın o sırada ne yaptığını toplayın.
3. Tarif edin — yapay zekâya kesin adımları, beklenen sonucu ve gerçek sonucu verin.
4. Düzeltin — yapay zekânın tek bir şeyi değiştirmesine izin verin.
5. Doğrulayın — tam adımları tekrarlayın, düzeltildiğini ve yakındaki hiçbir şeyin bozulmadığını onaylayın.
6. Gerekirse geri alın — işler kötüleştiyse geri alın ve daha iyi bilgiyle yeniden deneyin.

Yapay zekâyla yapılmış uygulamalarda harcanan zamanın çoğu 1, 2 ve 5. adımların atlanmasından gelir: "bozuk" demek, bir değişikliği test etmeden kabul etmek, ardından bozuk bir düzeltmenin üzerine bir düzeltme daha istemek.

Adım 1: Hatayı yeniden üretin

İstediğiniz zaman tetikleyebildiğiniz bir hata, yarı düzeltilmiş demektir. Ona neden olan en kısa adım dizisini bulmaya çalışın.

Kendinize sorun:

• Her seferinde oluyor mu? Yalnızca bazen oluyorsa, olduğunda neler farklı — belirli bir kayıt, yavaş bir bağlantı, oturumun kapalı olması?
• Her kullanıcı için oluyor mu? Farklı bir hesapla giriş yapın. Birçok hata yalnızca hiç verisi olmayan yeni kullanıcılarda ya da farklı bir role sahip bir kullanıcıda görünür.
• Her cihazda oluyor mu? Telefon genişliğindeki bir ekranı ve farklı bir tarayıcıyı deneyin.
• Belirli bir değişiklikten sonra mı başladı? Dün çalışıyorduysa, son birkaç değişiklik başlıca şüphelilerdir.

Adımları kısa, numaralı bir liste olarak yazın. Bunu daha sonra istemine yapıştıracaksınız.

Adım 2: Hata mesajını okuyun

Hata mesajları korkutucu görünür, ama yalnızca birkaç bölümüne ihtiyacınız var.

Anlamanız gerekmez; tam olarak kopyalamanız gerekir. "Cannot read properties of undefined (reading 'name')", kodun orada olmasını beklediği bir verinin (muhtemelen bir rezervasyon ya da bir kullanıcı) bulunmadığını yapay zekâya söyler. "Bir undefined hatası" gibi bir özetleme bunu kaybeder.

Birkaç yaygın olanı, kabaca çevirisiyle:

• undefined / null hataları — kod beklediği verinin gelmediğini gösterir. Çoğu zaman kodun ele almadığı bir yükleme durumu ya da boş bir liste.
• 404 Not Found — sayfa ya da API adresi yok. Çoğu zaman bir yoldaki yazım hatası ya da adı değiştirilmiş bir sayfaya verilen bağlantı.
• 401 Unauthorized / 403 Forbidden — istek oturum açılmadan yapıldı ya da kullanıcının bunu yapmasına izin yok.
• 500 Internal Server Error — sunucu tarafı kod çöktü. Asıl neden tarayıcıda değil, sunucu günlüklerindedir.
• CORS hataları — tarayıcı farklı bir alan adına yapılan bir isteği engelledi. Genellikle sunucu tarafında bir yapılandırma sorunu.

Adım 3: Tarayıcı geliştirici araçlarını kullanın

Her masaüstü tarayıcının yerleşik geliştirici araçları ("devtools") vardır. Sayfanın perde arkasında ne yaptığını gösterirler. Chrome, Edge ve Firefox'ta sayfada herhangi bir yere sağ tıklayıp İncele'yi seçin ya da F12'ye basın (Mac'te Cmd+Option+I). Safari'de önce Safari ayarlarından Geliştir menüsünü açın.

Yalnızca üç sekmeye ihtiyacınız var.

Konsol

Konsol sekmesi, sayfanın kodundan gelen hataları ve mesajları listeler. Hatalar kırmızıyla gösterilir. Bir düğme tıkladığınızda hiçbir şey yapmıyorsa, konsol çoğu zaman tam tıkladığınız anda kırmızı bir hata gösterir. Hatanın tam metnini kopyalayın (çoğu tarayıcıda kopyalama seçeneği için üzerine sağ tıklayın).

Ağ

Ağ sekmesi, sayfanın yaptığı her isteği — veri yükleme, form kaydetme, giriş yapma — listeler. Açın, ardından hatayı tetikleyen adımları tekrarlayın.

• Kırmızı satırlara ya da 400 ve üzeri bir durum koduna bakın.
• Başarısız bir satıra tıklayıp Yanıt'ı görün. Sunucu hatası çoğu zaman ekrandaki herhangi bir şeyden daha faydalı bir mesaj içerir.
• İsteğin URL'sini ve durum kodunu not edin — "/api/bookings adresine yapılan POST 500 döndürdü" yapay zekâya verilecek çok faydalı bir cümledir.

Hata bir sayfa yenilemesi ya da yönlendirme içeriyorsa, istekler kaybolmasın diye Günlüğü koru seçeneğini işaretleyin.

Öğeler

Öğeler (ya da Denetçi) sekmesi sayfanın yapısını ve stillerini gösterir. Yerleşim hataları için en faydalısıdır: bir öğenin üzerine gelerek boyutunu ve aralığını vurgulanmış görün. Burada bir şeyi düzenlemenize gerek yoktur; "alt bilgi mobilde 2.000 piksel genişliğinde ve sayfayı yana itiyor" demek yeterlidir.

Adım 4: Sunucu günlüklerini kontrol edin

Bazı hatalar sunucuda olur ve tarayıcı bunları göremez. Ağ sekmesindeki bir 500 hatası klasik işarettir. Sunucu günlükleri — arka ucunuzun çalışırken ürettiği metin çıktısı — genellikle bir yığın izi (hata oluştuğunda çalışan fonksiyonların listesi) ile birlikte gerçek hatayı içerir.

Bunları nerede bulacağınız aracınıza bağlıdır. Çoğu yapay zekâ uygulama oluşturucusunda projenin bir terminalini ya da günlük görünümünü açabilirsiniz ya da doğrudan yapay zekâya sorabilirsiniz: "Son istekten gelen hataları sunucu günlüklerinde kontrol et ve neyin başarısız olduğunu söyle."

Adım 5: Hatayı yapay zekâya tarif edin

Topladıklarınızı şu biçime koyun:

Rezervasyonlar sayfasında, üye olarak giriş yapmış durumdayım: yarınki 09:00 dersinde İptal'e tıkladım. Beklenen: rezervasyon kaybolur ve dersin bir boş yeri daha artar. Gerçek: ekranda hiçbir şey değişmiyor. Konsolda BookingCard.tsx:31 konumunda TypeError: Cannot read properties of undefined (reading 'id') görünüyor ve ağ sekmesinde DELETE /api/bookings/123 isteği 500 döndürdü. Nedeni bul, düzelt ve iptalin bir rezervasyonu olan ve birden fazla rezervasyonu olan bir üye için çalıştığını kontrol et.

Her parçanın neden önemli olduğu:

• Nerede ve kim olarak sorunu tek bir ekrana ve tek bir role indirger.
• Tam adımlar yapay zekânın hatayı yeniden üretmesini sağlar.
• Beklenen ve gerçek, "düzeltildi"nin ne anlama geldiğini tanımlar.
• Hata metni ve başarısız istek doğrudan nedene işaret eder.
• "Kontrol et ki…" yapay zekâdan yalnızca düzenleme değil, doğrulama ister.

Yapay zekâ iki kez düzeltmeyi denediyse ve başarısız olduysa, hiçbir şeyi değiştirmeden önce açıklamasını isteyin:

Henüz kodu değiştirme. Sence bunun nedeni ne ve bunu destekleyen kanıt nedir?

Yanlış bir teori, yazıya dökülünce kolayca fark edilir ve yanlış bir düzeltmeden çok daha ucuza düzeltilir.

Adım 6: Doğrulayın, sonra yakındakileri kontrol edin

Yapay zekâ düzelttiğini söylediğinde, Adım 1'deki tam adımları tekrarlayın. Ardından çevresindeki şeyleri kontrol edin:

• Farklı bir kullanıcı rolü için aynı eylem
• Hiç veri olmadan ve çok veri olduğunda aynı eylem
• Düzelttiğiniz bileşenle ortak bileşenleri paylaşan sayfalar
• Düzeltme yerleşime dokunduysa telefon genişliğindeki ekran

Yapay zekâ değişiklikleri bazen bir yolu düzeltirken başka bir yolu sessizce bozar. Şimdi yapılacak iki dakikalık bir kontrol, sonradan harcanacak karışık bir saati kurtarır.

Adım 7: Üst üste yığmak yerine geri alın

Bir düzeltme işleri kötüleştirdiyse ya da üç turda ilerleme olmadıysa, geri dönün. Son çalışan sürüme geri dönmek ve daha iyi kanıtla yeniden ifade etmek, üç yanlış düzeltmenin üzerine dördüncü bir düzeltme istemekten neredeyse her zaman daha iyidir. Her başarısız deneme arkasında kod bırakır ve bu kod bir sonraki denemeyi karıştırır.

Geri almayı kolaylaştıran iyi alışkanlıklar:

• Her değişiklikten sonra test edin, böylece hangi değişikliğin bir şeyleri bozduğunu bilirsiniz.
• Değişiklikleri küçük tutun — mesaj başına bir özellik ya da düzeltme.
• Riskli bir şeye başlamadan önce son iyi sürümü not edin.
• Kod Git'teyse, çalışan sürümleri commit'leyin ki onlara dönebilesiniz.

Yapay zekâyla yapılmış uygulamalarda yaygın hata kalıpları

Sorun bir hata değilse

Bazı "hatalar", yapay zekânın tam olarak söylenen şeyi inşa etmesi ve açıklamanın belirsiz olmasıdır. İstediğiniz düzeltme aslında bir davranış değişikliğiyse bunu açıkça söyleyin: "Şöyle olacak şekilde değiştir…". Doğru davranışın ne olduğundan emin değilseniz, önce bunu karar verin. Yapay zekâ uygulama oluşturucuları için istem yazma rehberimiz kuralların nasıl açıkça belirtileceğini anlatır. Bir uygulamayı gerçek kullanıcılar için hazırlıyorsanız, bir yapay zekâ prototipini canlıya nasıl taşırsınız rehberi yayından önce yapılması gereken kontrolleri kapsar.

Mythex'te hata ayıklama

Mythex'te döngünün her adımı için araçlar vardır:

• Önizleme, hatayı yeniden üretmek için; telefon boyutunda bir çerçeve dahil.
• /test, ajanın canlı önizlemenizde bir kullanıcı gibi tıklayıp bozuk akışları raporlamasını sağlar.
• /fix, ajanı özellikle bozulmalara yöneltir.
• Plan modu, ajanın herhangi bir şeyi düzenlemeden önce araştırıp açıklamasını sağlar.
• Kod → terminal, uygulamanızın sunucu günlüklerini gösterir.
• Herhangi bir yanıttaki Bu noktaya geri dön, projeyi o kontrol noktasına geri alır.

Bir yayımlama başarısız olursa, yayımlama penceresi genellikle Yapay zekâyla düzelt seçeneğini sunar; bu, derleme çıktısını ya da uygulamanın günlüklerini okur. Dokümanlarda Uygulamanızda hata ayıklama ve Yayımlama sorun giderme sayfalarına bakın.

Sorular