Web geliştirme araçları

[bullvar_katip]

küçükresim|Öğe seçici ve CSS özellik düzenleyicili sayfa denetçisi Web geliştirme araçları (genellikle devtools veya inspect element olarak adlandırılır), web geliştiricilerinin kaynak kodlarını test etmelerine ve hata ayıklamalarına olanak tanır. Bir web sayfasının doğrudan oluşturulmasına yardımcı olmamaları, bunun yerine bir web sitesinin veya web uygulamasının kullanıcı arayüzünü test etmek için kullanılan araçlar olmaları bakımından web sitesi oluşturuculardan ve entegre geliştirme ortamlarından (IDE'ler) farklıdırlar. Web geliştirme araçları, modern web tarayıcılarında tarayıcı eklentileri veya yerleşik özellikler olarak gelir. Google Chrome, Firefox, Internet Explorer, Safari, Microsoft Edge ve Opera gibi tarayıcılar, web geliştiricilerine yardımcı olacak yerleşik araçlara sahiptir ve ilgili eklenti indirme merkezlerinde birçok ek eklenti bulunabilir. Web geliştirme araçları, geliştiricilerin HTML, CSS, DOM, JavaScript ve web tarayıcısı tarafından yönetilen diğer bileşenler dahil olmak üzere çeşitli web teknolojileriyle çalışmasına olanak tanır. Web tarayıcılarından daha fazlasını yapma talebinin artması nedeniyle, popüler web tarayıcıları, geliştiricilere yönelik daha fazla özellik içeriyor. Web geliştirici araçları desteği Birkaç önemli web tarayıcısı, web tasarımcılarının ve geliştiricilerin sayfalarının yapısına bakmalarına olanak tanıyan web geliştirici araçlarını destekler. Bunların tümü, tarayıcıda yerleşik olan ve ek modüller veya yapılandırma gerektirmeyen araçlardır. Firefox – Web Konsolunu / Tarayıcı Konsolunu açar (Firefox 4'ten beri). Web Konsolu, tek bir içerik sekmesi için geçerlidir; Tarayıcı Konsolu tüm tarayıcı için geçerlidir. Firebug dahil olmak üzere birçok eklenti de mevcuttur. Google Chrome – Chrome Geliştirici Araçları (DevTools) Internet Explorer ve Microsoft Edge – Web Geliştirici Araçlarını açar (sürüm 8'den itibaren) Opera – Opera Dragonfly Safari – Safari Web Geliştirme Araçları (sürüm 3'ten itibaren)</link> En çok kullanılan özellikler Tarayıcıdaki yerleşik web geliştirici araçlarına genellikle bir web sayfasındaki bir öğenin üzerine gelinerek ve içerik menüsünden "Öğeyi İncele" veya benzer bir seçenek seçilerek erişilir. Alternatif olarak tuşu başka bir yaygın kısayol olma eğilimindedir. HTML ve DOM HTML ve DOM görüntüleyici ve düzenleyici, genellikle yerleşik web geliştirme araçlarına dahil edilir. HTML ve DOM görüntüleyici ile web tarayıcılarındaki kaynağı görüntüle özelliği arasındaki fark, HTML ve DOM görüntüleyicinin, HTML ve DOM'da değişiklik yapmanıza ve değişiklik yapıldıktan sonra sayfaya yansıyan değişikliği görmenize izin vermesinin yanı sıra DOM'u işlendiği gibi görmenize olanak sağlamasıdır. Seçme ve düzenlemeye ek olarak, HTML öğeleri panelleri genellikle DOM nesnesinin görüntüleme boyutu ve Basamaklı stil sayfası özellikleri gibi özelliklerini de görüntüler. küçükresim|3B sayfa denetçisi, Firefox sürüm 11'den 46'ya kadar olan bir özellik idi Firefox'un 11 ila 46 sürümleri, WebGL kullanan bir 3B sayfa denetçisi ile donatıldı; burada öğelerin iç içe yerleştirilmesi, sayfa yüzeyinden çıkıntı yapan katmanlarla görselleştirildi. Web sayfası ögeleri, kaynakları ve ağ bilgileri Web sayfaları genellikle resimler, komut dosyaları, yazı tipi ve diğer harici dosyalar biçiminde ek içerik yükler ve gerektirir. Web geliştirme araçları, geliştiricilerin web sayfasında yüklenen ve mevcut olan kaynakları bir ağaç yapısı listesinde incelemesine de olanak tanır ve stil sayfalarının görünümü gerçek zamanlı olarak test edilebilir. Web geliştirme araçları ayrıca geliştiricilerin, yükleme süresi ve bant genişliği kullanımının ne olduğu ve hangi HTTP üstbilgilerinin gönderilip alındığı gibi ağ kullanımı hakkındaki bilgileri görüntülemesine olanak tanır. Profil oluşturma ve denetim Profil oluşturma, geliştiricilerin bir web sayfasının veya web uygulamasının performansı hakkında bilgi toplamasına olanak tanır. Bu bilgilerle geliştiriciler, komut dosyalarının performansını artırabilir. Denetim özellikleri, bir sayfayı analiz ettikten sonra geliştiricilere, sayfa yükleme süresini azaltacak ve yanıt hızını artıracak optimizasyonlar için öneriler sağlayabilir. Web geliştirme araçları tipik olarak sayfanın işlenmesi için geçen sürenin, bellek kullanımının ve meydana gelen olay türlerinin kaydını da sağlar. Bu özellikler, geliştiricilerin web sayfalarını veya web uygulamalarını optimize etmelerini sağlar. JavaScript hata ayıklama JavaScript genellikle web tarayıcılarında kullanılır. Web geliştirme araçları genellikle, geliştiricilerin JavaScript'te hata ayıklarken izleme ifadeleri, kesme noktaları eklemesine, çağrı yığınını görüntülemesine ve duraklatmasına, üzerinde adım atmasına, işlevlere adım atmasına ve işlevlerin dışına adım atmasına izin vererek betiklerde hata ayıklamak için bir panel içerir. Genellikle bir JavaScript konsolu dahildir. Konsollar, geliştiricilerin JavaScript komutları yazmasına ve işlevleri çağırmasına veya bir komut dosyasının yürütülmesi sırasında karşılaşılmış olabilecek hataları görüntülemesine olanak tanır. Uzantılar ve eklentiler Modern web tarayıcıları, işlevsellik eklemek veya artırmak için eklentilerin veya uzantıların kullanımını destekler. Çok çeşitli ek özellikler sağlayabilen birçok yaygın eklenti vardır. Ayrıca bakınız Web Developer (yazılım) Web geliştirme yaşam döngüsü Kaynakça Kategori:Web geliştirme Kategori:WebOS Kategori:Bilgisayar programlama araçları Kategori:İncelenmemiş çeviri içeren sayfalar