Build with AI: From Zero to Your First App · Modül 4: AI ile ilk web sayfan · Lab
Araçla İskelet Artı Gerçek Metin
40 dk uygulamalı · Çekirdek
Yalnız tarayıcı. Devir kalıbıyla her sohbet ya da kod aracına brif ver; hesap gerekmez, kağıt üstünde de yürür.
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
- Proje, dosya, değişiklik ve çitli devir mesajı yazar
- Üç başlıklı ve etiketli formlu sayfa iskeleti alır
- Gerçek metni doldurup brifle satır satır karşılaştırır
Adım 1
Devir mesajını yaz
Fırın sayfası iskeleti için devir yaz: proje satırı, dosya adları (index.html), tek değişiklik (üç başlıklı iskelet artı etiketli sipariş formu), çit (sade kelimeler, henüz biçim yok). 120 kelimeyi geçmesin.
Adım 2
İskeleti kur, metni doldur
Devir mesajını her araçtan geçir (ya da şablondan elle yaz). Sonucu aç, taslağı oku, alanlarda sekmeyle gez. Sonra brifinden gerçek menü, saat ve sipariş metnini ekle, her satırı brifle kontrol et.
Adım 3
Farkı kaydet
İskeletle metin geçişi arası ne değişti yaz: hangi satırlar eklendi, her bölüm hangi brif satırını cevaplıyor. Araç istenmeden biçim ya da betik eklediyse kapsam kayması diye not et, kaldır.
Çalıştığını nasıl doğrularsın
- Devir 120 kelime altında dört bölmeli
- İskelet üç başlıkla ve etiketli, sekmeyle gezilebilir formla açılıyor
- Her metin bölümü brif satırına bağlanıyor
- İstenmemiş biçim ya da betik tutulmamış, kaldırılmış
Ç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
'Henüz CSS yok, betik yok' çiti yük taşır. Araçlar istenmeden biçim eklemeye bayılır; çit yasaklar.
Aşama 2: yön
Formda sekmeyle kendin gez. Mantıklı sekme sırası (ad, ürün, saat, gönder) ekran görüntüsünün atladığı iskelet kontrolüdür.
Aşama 3: cevaba yakın
Araç bir yerde örnek metin döndürürse o bölüm bitmemiştir. Devamdan önce brif metniyle değiştir.
Açıklamalı çözüm (dürüst denemeden sonra aç)
Çözüm. Devir örneği: 'Mahalle fırını tek sayfa site, henüz biçim yok. Dosyalar: index.html (yeni). Değişiklik: menü/saatler/sipariş başlıklı iskelet artı etiketli form (ad, ürün, teslim saati) ve gönder butonu. Çit: sade kelimeler, CSS yok, betik yok. Kontrol: aç, taslağı oku, alanlarda sekmeyle gez.' İskelet kontrolü: üç başlık görünür, dört sekme durağı sıralı. Metin geçişi: gerçek yemek ve fiyatlı menü, 08:00-19:00 pazartesi kapalı saatler, 18:00 öncesi arama söyleyen sipariş bölümü. Fark notu: üç metin bloğu eklendi, aracın eklediği istenmemiş biçim bloğu kaldırıldı. Yapı bitti, biçime dokunulmadı, tam istendiği gibi.