Build with AI: From Zero to Your First App · Modül 3: İnternet ve dosyalar · Lab
Üç Konsol Hatası, Üç Adres
30 dk uygulamalı · Çekirdek
Yalnız tarayıcı. Üç hata durumu satırlarıyla verilir; her birini dosya, satır ve tek satırlık düzeltmeye çevirirsin.
Bu labın üç yolu var. A: aşağıdaki tarayıcı adımları, ana yol, hesapsız ücretsiz. B: aynı görevi varsa kendi AI aracınla denemek (aracın koşul ve kotaları geçerli). C: verilen malzeme ve aşağıdaki açıklamalı çözümle çalışmak, aynı beceriyi öğretir. Hiçbir yol, canlı AI aracı kullanmamışa kullanmış gibi göstermez.
Hedefler
- Üç konsol hatasını dosya, satır ve sade mesaj diye çevirir
- İki durduran hatayla bir uyarıyı ayırır
- En zor duruma dört satırlık hata raporu yazar
Adım 1
Üç durumu tanıla
Durum 1: app.js:18 satırında 'Cannot read properties of null' ve document.getElementById('phone').value; girdi id phone-number. Durum 2: sayfa çalışırken sarı kullanım-dışı uyarısı. Durum 3: styles.css için 404; klasörde styles-main.css var; link etiketi styles.css gösteriyor.
Adım 2
Sırala ve raporla
Durumları düzeltme önceliğine sok (uyarıdan önce durduran hatalar). En zor duruma dört satırlık rapor yaz: ne yaptın, ne bekledin, dosya ve satırlı tam mesaj, bozulmadan önceki son değişiklik.
Adım 3
Düzeltmeleri yaz
Düzeltme başına tek satır: durum 1 id dizgisi, durum 3 href ya da yeniden adlandırma, durum 2 sayfa çalışana ertelendi ve ne dediği not edildi.
Çalıştığını nasıl doğrularsın
- Üç durumda dosya, satır ve sade mesaj var
- Durduran hatalar gerekçesiyle uyarıdan öne konmuş
- Bir durumda son değişiklik içeren dört satırlık rapor tam
- Üç tek satırlık düzeltme, her biri tek dosyaya dokunuyor
Çalışma alanı
0/2 kontrol geçiyor · Yalnız kapsam bilgisidir, kalite puanı değildir.
Taslak bu tarayıcıda saklanıyor.
İpuçları, üç aşamalı
Aşama 1: dürtme
Durum 1 12. dersin yeniden adlandırma hatası: kod HTML'de artık olmayan id'yi istiyor. Tek dizgi düzeltir.
Aşama 2: yön
Durum 3 link etiketiyle disk arası ad uyumsuzluğu. Dosyayı ya da href'i yeniden adlandır, ikisini birden değil.
Aşama 3: cevaba yakın
Sarı devam demektir. İki kırmızıyı düzelt, sayfanın çalıştığını doğrula, sonra uyarıyı sakin kafayla oku.
Açıklamalı çözüm (dürüst denemeden sonra aç)
Çözüm. Durum 1: app.js 18. satır, kod id phone istiyor, HTML phone-number tutuyor; dizgiyi phone-number yap. Durum 3: HTML bağlantısı styles.css istiyor, disk styles-main.css tutuyor; href'i gerçek dosyaya çevir (ya da dosyayı styles.css yap). Durum 2: uyarı, sayfa çalışıyor, sona ertele. Durum 1 rapor örneği: yaptım (sipariş formunu gönderdim), bekledim (onay yankısı), mesaj (app.js:18 satırında Cannot read properties of null), son değişiklik (dosya temizliğinde girdi id'sini yeniden adlandırdım). Üç adres, üç tek satırlık düzeltme, sıfır baştan yazım.