Geliştirici araçları

Sayfanızın yanında yapay zekâyla geliştirin, ayrıntıları inceleyin ve sonucu tarayıcıda kontrol edin.

Daha az hazırlık. Daha çok üretim.

Bir sonraki fikriniz.
Şimdiden emin ellerde.

Web için geliştirme araçlarınız, web’de gezindiğiniz yerde.

01 / Önizleme

Büyük fikirler.
Her ekranda.

Her sayfayı bir telefon çerçevesinde açın. Cihaz seçin, döndürün veya ekranı yeniden boyutlandırıp özen isteyen ayrıntıları bulun.

Telefon görünümünü keşfedin
02 / İnceleme

Tanıdık bir motor.
Daha net bir iş akışı.

Chromium DevTools bir kısayol uzağınızda. Sayfa düzenini inceleyin, JavaScript hatalarını ayıklayın veya yavaş bağlantıda neler olduğunu görün.

Geliştirici araçlarını tanıyın
03 / Odaklanma

İş için bir alan.
Diğer her şey için ayrı bir alan.

Geliştirici pencereleri ayrı oturum kullanır. Günlük hesabınızın yanında bir test hesabı açın; son geliştirici penceresi kapandığında çerezler ve depolama temizlenir.

Geliştirici pencerelerini keşfedin
Elinizin altında bulunsun

Tüm araçlar, tek yerde.

Yerleşik araçlara ve kullanımlarına daha yakından bakın.

Sayfanızın yanında yapay zekâ

⇧⌘A ile yapay zekâ panelini açıp Claude, Codex veya Gemini seçin. Projenizin kodu üzerinde çalışın, açık sekmeleri bağlama ekleyin veya sayfadan bir öğe seçin. Değişiklikleri doğrudan tarayıcıda kontrol edin. Verify modu değişiklikleri tarayıcıda doğrular; Review modu dosyaları değiştirmeden inceler; Design modu öncesi ve sonrası ekran görüntüleriyle arayüze odaklanır. Proje seçmeden sayfa hakkında da soru sorabilirsiniz.

Sağlayıcı kurulumu, kimlik doğrulaması, kullanım sınırları ve ücretler Yalqen’den ayrıdır. İstemler ve eklediğiniz sayfa içerikleri seçtiğiniz yapay zekâ sağlayıcısına gönderilir.

Chromium DevTools

⌥⌘I ile geliştirici araçlarını açın. Chrome’dan bildiğiniz Elements, Console ve Network panelleri aynı Chromium motorunda çalışır. Sayfa kaynağını ⌥⌘U ile görüntüleyebilirsiniz.

Telefon görünümü

⌥⌘M ile DevTools açmadan telefon görünümüne geçin. iPhone, Pixel ve Galaxy hazır boyutlarıyla duyarlı tasarımları kontrol edin. ⇧⌥⌘M ile yönü değiştirin. Duyarlı görünümde çerçeveyi sürükleyerek veya boyutlandırma tutamacına odaklanıp ok tuşlarını kullanarak istediğiniz boyuta getirin. Bu görünüm, gerçek cihaz ve farklı tarayıcı motorlarında test ihtiyacını ortadan kaldırmaz.

Hazır cihaz boyutları
CihazGörünüm alanı (CSS piksel)
iPhone 15393 × 852
iPhone 15 Pro Max430 × 932
iPhone 16 Pro402 × 874
iPhone SE375 × 667
Pixel 8412 × 915
Pixel 9412 × 924
Galaxy S24360 × 780
iPad mini744 × 1133

Sekmeye özel ağ yavaşlatma

Bağlantıyı tek bir sekmede yavaşlatıp yüklenme durumlarını ve yavaş bağlantı deneyimini inceleyin. Çevrimdışı, yavaş 3G, hızlı 3G ve hızlı 4G seçeneklerini deneyin. Diğer sekmeler normal bağlantıyla çalışmaya devam eder. Tek komutla yavaşlatmayı kapatabilirsiniz.

İstek kuralları

İstekleri engelleyin, yanıtları taklit edin, adresleri yönlendirin veya HTTP başlıklarını değiştirin. Adres kalıplarıyla eşleştirin; durum kodu, içerik türü ve yanıt gövdesini belirleyin. Harici bir eklenti kurmadan hata durumlarını ve farklı API yanıtlarını deneyin. Kurallar kaydedilir, komut çubuğundan düzenlenir ve sekme başına açılır.

Görünüm ve kullanıcı aracısı

Koyu renk şeması ve azaltılmış hareket tercihlerini taklit ederek sayfanızın bu ayarlara yanıtını kontrol edin. Yazdırma iletişim kutusunu açmadan baskı stilini görüntüleyin. Komut çubuğundan Firefox, Safari, Edge, iPhone, Android veya Googlebot kullanıcı aracısını seçebilirsiniz. Tek komutla sayfadaki tüm geçersiz kılmaları sıfırlayın.

Yenileme ve önbellek

⇧⌘R ile önbelleği kullanmadan yenileyin. Bir sekme için önbelleği kapatabilir veya sekmeyi 5, 10, 30 ya da 60 saniyede bir otomatik yenileyebilirsiniz.

Tam sayfa ekran görüntüleri

Komut çubuğuyla görünen alanın ötesine uzanan tam sayfa ekran görüntüleri alın. Görünen alanı veya tam sayfayı yakalayın; ⇧⌘S ile PDF olarak kaydedin. Adresi Markdown bağlantısı veya çalıştırılabilir curl komutu olarak kopyalayabilirsiniz.

Ayrı geliştirici oturumu

Yan panelden geliştirici penceresi açarak kişisel hesabınızın yanında bir test hesabı kullanın. Çerez, depolama ve önbellek ayrıdır; reklam ve üçüncü taraf çerez engelleme kapalıdır. Son geliştirici penceresi kapandığında bu oturum temizlenir.

İlgili sayfalar