"javascript" etiketine sahip yazılar:
14 Nisan 2010, ÇarşambaGoogle Buzz için bir bookmarklet hazırladım.
Uzun süredir ertelediğim teknik kitap alma işini nihayet hallettim ve aşağıdakileri aldım. Gelelim ilk görüşlerime:
Version Control with Git: Powerful Tools and Techniques for Collaborative Software Development
Git geliştiricilerinden Jon Loeliger'ın kitabı. Pro Git arasında kararsız kalıp, epey yorum okuduktan sonra almaya karar verdim. Pro Git'in ücretsiz versiyonunu da okuyup satın alacağım büyük ihtimalle. Özellikle Subversion'dan Git kullanmaya başlayanlar için Git'in dağıtık mimarisini çok güzel açıklıyor kitap.
Hadoop: The Definitive Guide
Apache Hadoop projesinin geliştiricilerinden Tom White'ın kitabı. FriendFeed'de Berk D. Demir'in tavsiyesi üzerine aldım. Zaten Hadoop üzerine pek fazla kitap yok. Henüz ilk iki bölümü tamamladım ve oldukça açıklayıcı bir kitap olduğunu söyleyebilirim rahatlıkla. Eğer benim gibi başlangıç düzeyinde teorik bilginiz varsa, kitapla beraber Wikipedia ve Google'ı kullanarak kısa sürede "temel" bilgi edinebilirsiniz.
JavaScript: The Good Parts
Douglas Crockford amcanın kitabını duymayan yoktur herhalde. Daha önce korsanlık yapıp e-book versiyonunu okumuştum. "Emeğe saygı kardeş +rep" deyip orijinalini de aldım :) YDN Theater'daki sunumlarını izlediyseniz ve ortalamanın biraz üzerinde JavaScript bilginiz varsa çok yeni şeyler anlatmadığını göreceksiniz. Yine de her şekilde kitaplığınızda bulunması gereken güzel bir kitap.
Pro JavaScript Design Patterns
Web günlüğünü zevkle takip ettiğim Dustin Diaz'ın Ross Harmes ile beraber yazdığı kitabı. Scope, closure gibi kavramlardan haberdar değilseniz kitaba dalmadan önce temel JavaScript bilgisine sahip olmanızı tavsiye ederim. Aksi takdirde kitaptan istediğiniz verimi alamayabilirsiniz.
Object-Oriented JavaScript: Create scalable, reusable high-quality JavaScript applications and libraries
Stoyan Stefanov'un kitabı hakkında çok fazla basite inerek anlattığına dair eleştiriler var. JavaScript'le ilgilenip, kitabı almış geliştiriclerin çoğunun zaten bildiği şeyleri tekrar tekrar okumak bazen rahatsızlık verse de çok da göze batacak bir şey değil. Üst düzen JavaScript bilginiz olduğunu düşünseniz de ilk iki bölümü dikkatli okumanızı tavsiye ederim. JavaScript konulu üç kitap içerisinde, fazla seviye ayrımına girmeden tavsiye edebileceğim yegane kitap budur diyebilirim rahatlıkla. Tabii bu başlangıç seviyesindekilere önerdiğim anlamına gelmesin :)
Coders at Work
Sıra geldi en ilginç ve eğlenceli kitaba. Practical Common Lisp'in yazarı Peter Seibel, bilgisayar dünyasına yön vermiş gurularla sohbet ediyor; programcılığa nasıl başladıklarını, önemli kararları nasıl aldıkları gibi sorular soruyor. Yanıtlar çok ilginç. Mesela çoğunluğu programcılığa BASIC ile başlamışlar; Lisp ve Emacs gurularından Jamie Zawinski aynı zamanda gece kulübü sahibiymiş :) Kısıtlı İngilizceniz bile olsa, küçük bir sözlük yardımıyla okumanızı kesinlikle tavsiye ediyorum. Bu arada, muhtemelen serinin devam kitapları da gelecektir. Zira epey eksik üstad var :) Kim bilir belki Paul Graham'ın Hackers & Painters kitabı gibi Türkçeye de çevirilir.
Son olarak, düzenli olarak okumasam da boş zamanlarımda devam ettiğim okuyabileceğiniz özgür kitapları da verip, 2010'un ilk -umarım son olmaz!- kitap girdisini bitiriyorum :)
Bugün, Internet Explorer'ın başa bela sorunlarından biriyle daha karşılaştım. Eğer, aşağıdaki gibi bir kodunuz varsa Internet Explorer'da çalışmayacaktır.
var div = document.createElement('div');
div.setAttribute('style', 'border: 1px solid #ff0000');
div.innerHTML = 'Iron Maiden\'s gonna get all of you!';
QuirksMode sağolsun, Internet Explorer 8. sürümüne kadar setAttribute style niteliğini set etmiyormuş.
Çözüm için kodumuzda küçük bir değişiklik yapmak yeterli:
var div = document.createElement('div');
div.style.cssText = 'border: 1px solid #ff0000;';
div.innerHTML = 'Iron Maiden\'s gonna get all of you!';
Yine uzun süredir yazamasam da bu sefer zamanı iyi kullanamamın veya tembelliğimin arkasına sığınmıyorum :) Efendim, kısa süre içerisinde blogun tasarımı, altyapısı ve içeriğinde büyük değişiklikler olacak. En önemlisi, İngilizce yazılarımı da yayımlamaya başlayacağım. Aslında format konusunda hala kararsızım: Blog içerisinde Türkçe ve İngilizce yazıları kategorilere ayırmakla, yeni bir sub domain oluşturma arasında gidip geliyorum. Hatta, -eğer okuyan varsa- görüşlerinizi almak isterim.
Gelelim işin teknik kısmına: Ofisteki yoğunluğumun azalması ve zamanımı daha iyi kullanmaya başlamamla kişisel projelerime ayırdığım zaman da artmış oldu. Böylece sadece blogun tasarımını değil altyapısını da tekrardan kodlamaya başladım. Bu sefer kendi basit(ve yetersiz) framework'üm yerine Kohana'yı kullanıyorum. Aslında birçok projede CodeIgniter kullanıyordum ama arkasında bir şirket olması özellikle patch gönderiminde ve kabul ettirmede epey dezavantaja dönüşüyor. Kohana tercihimin en önemli sebeplerinden birisi de bu aslında - ki önümüzdeki günlerde birkaç şey yazmak istiyorum bu konuyla alakalı.
Şu ana kadar DOM(Document Object Model) başlıklı makalem -yeri gelmişken bu makaleyi de yeniden yazdığımı ve içeriğini genişlettiğimi de belirteyim :)- haricinde planladığım kadar detaylı döküman yazamadım ama bu aralar HTML5 ve CSS3 hakkında epey detaylı iki makale hazırlıyorum. Yeni konseptle beraber bu içeriği de ayrı bir bölüme alacağım. Böylece, mevcut yapıdaki en büyük sıkıntım olan içeriği sınıflandıramama sorununu da halletmiş olacağım. Lab bölümüne, projelere ek olarak küçük kod parçalarım için küçük bir bölüm eklemeyi planlıyorum. Böylece, günlük bölümünü biraz daha "günlük" formatına çevirmiş olacağım.
Fatih Hayrioğlu'nun FriendFeed'deki Internet Explorer 6 konulu girdisinde, sadece IE6 kullanıcıları için tarayıcıyı kilitleyecek bir kod yazmayı önermiştim.
Bugün, uykusuzluğumu da gidermek amacıyla küçük bir çalışma yaptım. Aşağıdaki kod ile, sayfayı IE6 ile ziyaret ederseniz tarayıcı göçecektir :)
var IE6 = false /*@cc_on || @_jscript_version <= 5.7 @*/;
if(IE6) for(x in document.write) document.write(x); // [1]
[1] Wikipedia
Google Translate'in yayınladığı bookmarklet'ların sonucu aynı sekmede görüntülemesine sinir olduğum için küçük bir değişiklik yaptım. Artık seçilen metnin çevirisini yeni sekmede gösteriyor. Aşağıdaki örnek sadece Türkçe için geçerli. Diğer diller için aynı değişikliği kolayca yapabilirsiniz.
Bu arada, daha önce Google Translate için bir Firefox eklentisi olup olmadığını sormuştum. Kimseden ses çıkmayınca, "iş başa düştü deyip" yazmaya başladım. Bu sene içinde biter umarım :)
Daha önce JavaScript'e yeni metodlar eklemiştik. Bu seferde new line(\n) karakterini otomatik olarak <br /> etiketine çevireceğiz.
String.prototype.nl2br = function() {
return this.replace(/\n/g, "<br />");
};
Kullanımı:
var s = "Iron Maiden\n\nSteve Harris\nBruce Dickinson" +
"\nAdrian Smith\nDave Murray\nJanick Gers\nNicko McBrain";
document.write(s.nl2br());
Son yazımdan bu yana(12 Ağustos) neredeyse 2 ay geçmiş. Bu süre zarfı boyunca yeni hayatıma adapte olmaya ve yarım kalan projelerimi tamamlamaya çalıştım(ki hala da çalışıyorum). Tabii bunca hengamenin arasında blogumla pek fazla ilgilenemedim. Ama bu haftadan itibaren burasını biraz daha hareketlendireceğim :)
Geçtiğimiz hafta içinde bloga son yorumlar gibi birkaç yeni özellik daha ekledim. Mart ayından bu yana ilgilenemediğim, web teknolojileri konusundaki denemelerimi ve çalışmaları paylaştığım lab bölümünü ise kapsamlı bir yenilikten geçiriyorum. Arayüz tasarımı aynı kalacak ama altyapısında büyük değişiklikler olacak ve biraz daha kullanıcılarla etkileşimli hale gelecek.
Tamamen amatör olarak hazırladığım jQuery eklentim jGrow onca eksiğine rağmen oldukça iyi tepkiler aldı. Epey hata bildirisi ve özellik isteğinin -hatta sitemin :)- ardından yeni versiyonu için çalışmalara başladım. Bunun yanında yeni projem için hazırladığım bir eklentiyi daha paylaşacağım. Birde dilim döndüğünce jQuery eklentisi yazmayla alakalı bir dizi yazı yazmayı planlıyorum.
Görevi, stringin baş ve sonundaki boşlukları temizlemekten ibaret olsa da pek çok programlama dilinin hayat kurtaran fonksiyonlarından biridir trim(). Ne yazık ki JavaScript'te bu fonksiyon bulunmuyor. Biz bu yazıda JavaScript'e bu fonksiyonu ekleyeceğiz.
String.prototype.trim = function() {
s = this.replace(/^\s+/, "");
return s.replace(/\s+$/, "");
};
Bu fonksiyonu biraz daha kısaltabiliriz.
String.prototype.trim = function() {
return this.replace(/^\s+|\s+$/g, "");
};
Her iki fonksiyonu da " sağ ve soldaki boşluklar silinecek ".trim() şeklinde kullanabiliriz.
...ne yazık ki -halen- varsayılan olarak değil :)
Web geliştiriciliği yaptığım süre boyunca, Internet Explorer'ın her türlü uyumsuzluğunu zamanla kabullendiğimi söyleyebilirim. Ancak CSS seçicileri konusundaki uyumsuzluklarına gıcık olmadan edemiyorum.
Bu sebeple, uzun süredir Internet Explorer üzerinde tüm seçicilerin desteklendiği bir JavaScript kütüphanesi üzerinde çalışıyordum ki zaten benden önce yapıldığını tesadüfen gördüm!
Dean Edwards'ın geliştirdiği kütüphane ve kullanımı hakkında bilgi almak için proje sayfasını ziyaret edebilirsiniz. Ayrıca, uygulamalı özellik listesi içinde buraya* bakabilirsiniz.
Bildiğiniz gibi autocomplete niteliği tıpkı target gibi web standartlarına uygun değil. Bu günlük kullanımda pek bir sorun teşkil etmese de benim gibi web standartlarına takıntılı geliştiriciler için epey büyük bir sorun :)
Bunu aşabilmek için imdadımıza JavaScript yetişiyor. Biz jQuery kütüphanesini kullanacağız:
$("input[@class='autocomplete']").each(function(){
$(this).attr("autocomplete", "off");
});
Kullanımı:
<input type="text" class="autocomplete" name="frmAra" />
Bu şekilde niteliği class ve değeri autocomplete olan tüm input elementlerine autocomplete = "off" niteliği eklenir.
Tabii kullanım şekline göre gerekli değişiklikler yapılarak -örneğin tüm input elementlerine uygulanabilir- kullanılabilir.
Ocak ayında, hem ihtiyaç hem de jQuery'yi biraz daha öğrenmek amacıyla jGrow'un ilk versiyonunu hazırlamıştım.
İlk sürümün ardından gelen yorumlar neticesinde, iki adet küçük değişiklik yaptım.
Sürüm Notları
jGrow hakkında bilgi almak ve son sürümünü indirmek için proje sayfasını kullanabilirsiniz.
Bu yazıyı henüz blogumun altyapısı bitmeden yazıyorum. Büyük ihtimalle siz okuduğunuzda epey önce yazılmış olacak.
MPH'i kapatmamın üzerinden 3 yıla yakın bir süre geçti. Zaman zaman arkadaşlarımın bloglarında kısa süreli yazılar yazsam da aklımın bir köşesinde her zaman kişisel blogumu yeniden açmak vardı. Şimdiye kadar açılmamasına pek çok sebep gösterebilirim ama direkt olarak "uyuşuğum!" dersem yeterli olacağına inanıyorum :)
Gelelim blogun oluşum hikayesine: Tasarımın ilk taslağı neredeyse 2 sene öncesine dayanıyor. Küçük değişikliklerle bu hale geldi. Bu uzuuun gelişim sürecine sebep olarak, yukarıdaki paragrafı referans alabilirsiniz. Site içerisinde, çeşitli yerlerde göreceğiniz ikonların kaynağı ise FamFamFam. Neyse ki Smarty'nin nimetleri sayesinde bir sonraki tasarım değişikliği için blogu kapatmak ya da bu kadar uzun zaman beklemek zorunda kalmayacağım :) Smarty demişken, başka bir dala atlayıp blogun altyapısından bahsetmek istiyorum. Öncelikle, PHP ve MySQL ikilisi ana iskeleti oluşturuyor. Template sistemimiz Smarty, veritabanı sınıfımızsa ezSQL. JavaScript frameworkümüz ise tabii ki jQuery.
Efendim koskoca 2 seneyi anlatmaya çalışırsak, Türkiye standartlarında okunmayacak kadar uzun bir yazı olacağından -şimdilik- kısa kesiyorum. Bundan sonra dilim döndükçe CSS, PHP, Smarty, jQuery, JavaScript ve ActionScript hakkında bilgiler vermeye ve kendi çözümlerimi paylaşmaya çalışacağım. Tabii arada sırada günlük hayattan, futboldan, oyunlardan, sinemadan ve 2. Dünya Savaşı'ndan da bahsedeceğim.
Her türlü soru ve öneriniz için berker.peksag at gmail.com e-posta adresini kullanabilirsiniz.
Buraya kadar okuduğunuz için teşekkür ederim. Her zaman okunabilir olmak dileğiyle.
Yayımlanan yazılar, kaynak gösterildiği müddetçe kullanılabilir.
Yapılan yorumların sorumluluğu yazarına aittir.