Browser içi Web Geliştirme Araçları

Web browserların işe yarayan bir sürü eklentileri var. Bu eklentilerden bir kısmı da web geliştirme ile ilgili. Bu browser (ya da tarayıcı) içi eklentiler sayesinde browser’ınızın içinden çıkmadan bir çok işi halledebilirsiniz.

Kendi kullandığım ve diğer popüler eklentilerin bir listesi.

Firebug

Firebug web geliştirme araçları arasında sanırım en saygın yere sahip uygulamalardan biri. HTML, CSS, DOM ve Javascript’i incelemek ve hataları ayıklamak amacı ile yaratılmış bir eklenti. Ama Firebug’ı asıl üne kavuşturan şey herhalde Javascript ile program yazanların hataları ayıklama yöntemlerini kökten değiştirmiş olması. Artık Javascrit programcıları hataları ayıklamak için alert() fonksiyonundan daha fazlasına sahip. Ayrıca DOM’a müdahele yeteneği ile web sayfasında olabilecek değişiklikleri anında görmenizi sağlıyor.

DOM’u anında değiştirme yeteneği dışında, aynı şeyi CSS ve HTML içinde yapabiliyor. Aynı zamanda ağ hareketlerini de kontrol ediyor ve HTTP bağlantıları hakkında detaylı bilgiler verebiliyor.

Bunların dışında Firebug ile çalışan bir iki eklenti ile çok daha fazlasını da yapabiliyor. Örneğin FirePHP,  PHP ile geliştirilen Ajax uygulamalarında büyük kolaylık sağlıyor. FireScope adlı başka bir eklenti ise HTML ve CSS konusunda referans materyelleri ekleyerek Firebug’ı bir adım daha öne taşıyor.

Yahoo! tarafından geliştirilmiş başka bir eklenti Yslow‘da Firebug üzerinden çalışıyor. Sayfanın front-end içeriğini analiz ederek performansı ile ilgili bilgiler ve bir de not veriyor. (A en iyi F en kötü şeklinde) Ayrıntılı analiz sonuçlarına bakarak sayfanızda tıkanmalara yol açan yerleri görüp bunları düzeltebilirsiniz.

Firebug bir Firefox eklentisi ama diğer tarayıcılarda çalışanlar bu muhteşem eklentinin bazı özelliklerinden yararlanabilirler. Firebug’ın bir ‘lite’ sürümü var. Bu IE, Safari, Opera gibi diğer tarayıcılara da belli ölçüde bir Firebug işlevselliği kazandırıyor.

Web Developer

Web Developer Mozilla tabanlı tarayıcılar (Firefox, Flock, Seamonkey gibi) için bir eklenti. Tarayıcıya bir toolbar ve menu ekliyor. Bir web sitesini incelemek ve hatalarını ayıklamak konusunda çok sayıda seçenek sunuyor.  CSS ve stiller, sayfada bulunan seçiciler hakkında geniş bilgi veriyor.

Bunların dışında CSS’i, Javascript’i resimleri etkisiz hale getirmekten tutun da sintaks kontrolörlerine kadar bir sürü yararlı özelliği de bünyesinde barındırıyor. Formlarla çalışmayı kolaylaştıran bir başka seçeneğe daha sahip. Doğrusu Web Developer’ın o kadar yararlı özellikleri var ki hepsini saymak zor. Firebug kadar popüler başka bir eklenti.

Venkman

Venkman Mozilla’nın kendi Javascript debugger’ının kod adı. Aynı zamanda bir Firefox eklentisi olarak da mevcut. Dolayısı ile karmaşık Javascript programlarında hata ayıklamak için oldukça faydalı bir eklenti.

ColorZilla

ColorZilla basit bir eklenti. Tarayıcının sol alt köşesine bir ikon ekliyor. Bu ikona basınca gezmekte olduğunuz web sitesinde hangi renkler kullanııldığını görüp onların renk kodlarını alabiliyorsunuz. Oldukça basit ama bir o kadar da kullanışlı bir eklenti. Renklerle çalışmayı son derece kolaylaştırıyor.

MeasureIt

ColorZilla renklerle çalışmayı ne kadar kolaylaştırıyorsa MeasureIt de web sayfasında ki uzunluklara çalışmayı o kadar kolaylaştırıyor. Bir web sayfasında istediğiniz yerden istediğiniz yere kadar bir cetvel çekerek oradaki uzunlukların kaç piksel olduğunu size hemen söylüyor. Basit ama son derece faydalı.

FireShot

FireShot bir browser içi görüntü yakalama programı. Browser’ın içinde bulunan görüntüyü yakalayıp, üzerinde değişiklikler yapabilir, yazılar yazabilir, şekiller çizebilir ve onları kaydedebilirsiniz. Firefox ve IE içinde mevcut.

FireFTP

Bir FTP programının bir web geliştiricisi için gerekliliği ortada. Ama dosya transferi işlerinizi tarayıcınızın içinden çıkmadan halletmek istiyorsanız FireFTP tam size göre. Sistem bağımsız olması dışında, FireFTP tam teşekküllü bir FTP yazılımından hiç bir eksiği yok.

HTML Validator

HTML Validator görüntülenen sayfanın HTML kodundaki hatalar olup olmadığını gösteren basit bir yazılım. Tidy ve OpenSP algoritmalarına göre sayfayı kontrol ediyorlar. İki algoritmada Firefox’un içinde bulunduğundan kodunuz başka bir sunucuya gitmiyor.

TamperData

TamperData sunucudan gelen HTTP başlıklarını incelemenize ve aynı zamanda sunucuya gönderilen POST isteklerini değiştirerek müdahale etmenizi sağlayan bir eklenti.

Kısa Kısa…

HackBar: HackBar web sitenizin güvenliğini kontrol etmenizi sağlayan başka bir Firefox eklentisi.

Modify Headers: Sunucuya gönderilen istek başlıklarına (request headers) müdahele etmeniz gerekirse.

HttpFox: Sunucu ve istemci arasından bütün istek ve cevapları izleyen başka bir eklenti.

Siz ne kullanıyorsunuz?

Burada yazdıklarım dışından web geliştiriciler için binlerce farklı tarayıcı eklentisi var. Sizin favori eklentiniz hangisi? Ben Firefox kullandığım için buradaki eklentilerin büyük çoğunluğu Firefox eklentileri. Eğer başka bir browser kullanarak geliştirme yapıyorsanız tarayıcınız içinde kullandığınız favori eklentileri bizimle paylaşın. :)

Internet Explorer Güvenlik Alarmı

Internet Explorer her zaman için güvenlik problemi ile göz önünde oldu. Tam IE 7 ile bu sorunlar ortadan kalktı derken IE gene yapacağını yaptı.

Internet Explorer’da bulunan bir hata, saldırganların hedef bilgisayarı kontrol almalarına sebep oluyor. Şu an itibarı ile Microsoft konu hakkında hala inceleme yapıyor ama henüz bir yama mevcut değil.

Dolayısı ile hala Internet Explorer kullanmakta devam edenlerin bu zaaftan etkilenmemeleri için başka bir sürücü kullanmları gerekiyor. Söylenene göre zaaf şu an IE 7 için geçerli ama Microsoft diğer sürümlerinde potansiyel olarak tehlikede olabileceğini belirtiyor.

Bugüne kadar kendisini IE yerine başka bir tarayıcı kullanması konusunda ikna etmeye çalıştığım ama pek de sallamayan arkadaşlarıma ve onlar gibi olanlara da bir kez daha uyarıda bulunuyorum.

Bana inanmayanlar BBC‘ye itimat edebilirler.

Bu arada IE yerine Firefox veya Opera (ya da Safari) kullanmanızı bir kez daha şiddetle öneriyorum. Daha hızlı, güvenli ve kullanışlılar.

Web tarayıcısından verileri silmek

Firefox (ve güncel diğer tüm Internet tarayıcıları) girilen verileri saklamak gibi bir kolaylık getirirler. Örneğin bir form doldurduğunuzda tarayıcınız bu form alanlarına girilen bilgileri saklar ve siz tekrar bu forma geldiğinizde ve alana bir veri girmeğe çalıştığınızda size bu kelimeleri hatırlatır.

Genelde bu uygulamanın adı “autocomplete”. Bu özellik sadece formlar içinde geçerli değil. Aynı zamanda adres çubuğu da dahil olmak üzere bu autocomplete özelliği başka yerlerde de karşınıza çıkabilir. Tabii bu her zaman için istenen bir durum olmayabilir.

Bu verileri silmek için seçeneklerden kaydedilmiş bütün verileri sil benzeri bir komut verebilirsiniz ama bu kullanışlılığı önemli ölçüde etkileyebilir.

Bunun yerine Firefox’ta istediğiniz verileri silmek için bir yöntem var. Autocomplete alanında (form veya adres çubuğu) silmek istediğiniz öğenin üzerine gelip “Shift”+”Del” tuşlarına basarsınız sadece o girdiyi silebilirsiniz.

İnsan öğrendikçe Firefox’u daha çok seviyor.

Not: Bu ipucu Internet Explorer, Opera, Safari gibi diğer web tarayıcıları içinde geçerli olabilir, ama ben denemedim dolayısı ile bilemiyorum. Deneyen varsa bizimle paylaşabilir.

Firefox’ta hafıza sızıntılarına çözüm

FirefoxNeredeyse varolduğundan beri tarayıcı olarak Firefox‘u kullanmaktayım. Firefox’u seviyorum ve inanılmaz yetenekli ve çeşitli eklentileri bir çok işin çok kolay ve hızlı halledilmesini sağlıyor.

Buna rağmen uzun zamandır Firefox ile başım dertte, bunun nedeni ise hafıza sızıntıları (Memory Leaks). Bir hafıza sızıntısı bir programın kullanmakta olduğu hafıza kısmını işi bittikten sonra düzgün olarak geri bırakamaması yüzünden meydana geliyor. Bu yüzden program sistemdeki bütün hafızayı sömürmeye başlıyor. Özellikle son zamanlarda Firefox’da da başıma gelen bir olay. Firefox üzerinde bir sürü eklenti kullanıyorum, ve aynı zamanda bir çok sekme açarak çalışıyorum. Tüm bunlar birbirine eklenince Firefoz hafıza sızıntısı yüzünden önce Firefox sonra genel olarak sistem yavaşlıyor. Özellikle Firefox uzun süre açık kadıkça hafıza kullanımı inanılmaz yüksek boyutlara ulaşıyor. Ben de genellikle 500 MB üzerine çıkıyor. Laf aramızda 800′ü gördüm. :) Firefox Hafıza Sızıntısı

Buarada yapılacak şey, Firefox sapıtınca tarayıcıyı kapatıp açmak. Ama bu her zaman mümkün olamıyor. Bende bunun üzerine alternatif yöntemler aramaya koyuldum. İşte bulduklarım.

İlk çözüm, eğer eklentilere bağımlı değilseniz hemen Firefox 3 sürümüne geçmek olacaktır. Şu an için beta sürümünde olmasına rağmen Firefox 2 gibi memory leaks hafıza sızıntıları içermiyor. Aynı zamada genel olarak da hızlı. Beta olmasına rağmen de oldukça kararlı çalışıyor.

İkinci bir çözüm ise Firefox Ultimate Optimizer adında bedava bir yazılım kullanmak. Bu yazılım Firefox’un hafıza problemine zekice bir çözüm getirmiş. Kullanması oldukça basit bir program, hiç bir ayarı yok. Çalıştırıyorsunuz ve görev çubuğunda bir ikon olarak çalışmaya devam ediyor. Hatta bakıp da Firefox’un sadece 1Kb. harcadığını görünce şaşırabilirsiniz. Yalnız biraz inceleyince görülüyor ki programın yaptığı Firefox’u ana bellekten alarak sanal belleğe (Virtual memory) yerleştirmesi. İlk olarak bu ana belleği boşaltarak diğer programların bayılmasını engelliyor. Eğer sanal belleğiniz yeterince büyükse kolay ve yeterli bir çözüm. Program sadece Windows’da çalışıyor.

Diğer bir çözüm ise Firefox’un ayarları ile ilgili. Firefox’un adres çubuğuna about:config yazarak Firefox’un ayarlarına gidiyoruz. Burada boş bir alana sağ tuşla tıklayarak new>integer (yeni>tamsayı) seçeneklerini seçiyoruz. Bu bize yeni bir girdi yaratmamızı sağlıyor. Yeni girdi için isim olarak browser.cache.memory.capacity yazın. Buna verdiğiniz değer çok büyük olmamalı aynı zamanda çok küçük de olmamalı genelde 16 MB ideal varsayılıyor. (16 MB için 16384 giremelisiniz.)

Başka bir seçenek ise gene benzer adımlardan geçiyor. Burada gene about:config ile yeni bir girdi yaratıyoruz. Bu sefer integer yerine boolean seçiyoruz. Seçeneğin adı config.trim_on_minimize değeri ise True. Bunun nedeni ise bir program genelde minimize olduğu zaman inaktif hale geliyor ve daha az kaynak harcıyor. Firefox varsayılan olarak bu kurala uymadığı için bu ayar ekleniyor.

Bu seçeneklerin bir veya bir kaçını kullanarak Firefoxa bağlı bellek problemlerinin önüne geçebilirsiniz.

Mozilla Firefox ve Opera’da güvenlik açığı

US-CERT Mozilla Firefox ve Opera internet tarayıcılarını etkileyen bir güvenlik açığı konusunda bir bildiri yayınladı. Bu güvenlik açığı bitmap (.bmp) dosyalarının uygunsuz işlenmesinden kaynaklanıyor. Bu yüzden bir saldırgan özel olarak düzenlenmiş bir bitmap dosyasını tarayıcınıza göndererek hassas bilgilere erişebilir veya DoS (hizmet inkarı) durumuna maruz bırakabilir.

Firefox kullanıcılarının Firefox 2.0.0.12 sürümüne, Opera kullanıcılarının ise Opera 9.25 sürümüne yükseltmeleri tavsiye olunur.

Netscape Navigator tarih oluyor

Netscape Logo

Uzun zamandır Internet’le haşır neşir olanlar hatırlar 1994 yılından AOL tarafından alınan Netscape internet tarayıcıları kategorisinde bir mihenk taşıdır. Bugün Mozilla Firefox onun mirası sayılabilir. Ama AOL yaptığı açıklama ile Netscape’in geliştirilmesine 1 Şubat 2008 tarihinden geçerli olmak üzere son vereceklerini açıkladı. Netscape şu an için özellikle AOL aboneleri tarafından kullanılmakta.