Konular

JQuery Nedir?

Jquery, javascript ile hep yapmak isteyip, karışık JS programlama dili yüzünden bir türlü yapamadığınız kodlamayı çok kolay ve hızlıca yapmanızı sağlayan javascript kütüphanesidir.Diğer bir güzel yanı da jquery ile yazılan kodun tüm popüler tarayıcılarda sorunsuz çalışmasıdır, sizin kod üzerinde tarayıcı uyumluluğu çalışması yapamanıza gerek yoktur.

JQuery Nedir?

jQuery nedir ve kimler tarafından kullanılıyor?

jQuery hem javaScript hem ajax hem de efekt kütüphanesi olarak kullanılabilen bir framework’dür. 2006′nın Ocak ayında bir javaScript gurusu olan John Resig tarafından duyurulmuş. şu anda ise 15 kişilik bir ekip tarafından gelişimi sürdürülüyor.

Lisans konusuna da kısaca değinmek gerekirse, MIT veya GPL lisansının şartlarına uyduğunuz sürece kendi uygulamalarınızda kullanabiliyorsunuz. Bu konuda jQuery’nin resmi web sitesi olan www.jquery.com‘dan daha fazla bilgi alabilirsiniz. Hem bu web sitesinden jQuery ile ilgili dokümantasyona, eğitsellere, eklentilere ve sorularınızı yazabileceğiniz foruma da ulaşabilirsiniz.

jQuery çok geniş bir kullanıcı kitlesine sahiptir. Bunlardan da biraz örnek vermek istiyorum. Sosyal haber sitesi Digg, açık kaynak kodlu projelere ev sahipliği yapan SourceForge, blog sitelerini analiz eden Technorati, RSS kaynaklarımızı yönettiğimiz FeedBurner ve birçoğumuzun kullandığı blog yazılımı WordPress bu örneklerden yalnızca birkaçıdır. Daha fazlası için jQuery Kullanan Siteler sayfasına bakabilirsiniz.

Bir JavaScript kütüphanesidir. Daha az yaz, daha çok iş yap şeklinde bir sloganı da var. Amaç, javaScript kodları ile boğuşmadan bazı işleri kısa kodlarla yapmaktır.

Ne Bilmem Gerekiyor?

jQuery ile çalışabilmek için HTML, CSS ve temel düzeyde JavaScript bilmeniz gereklidir.

Bir site kodlarken birçok javascript kodu gerekebilir. Bir nesneyi bulmak, nesne üzerinde işlem yapmak, veri almak ve vermek gibi... Tabiki bu kısım, siteyi kodlarken sizi uğraştıracaktır. jQuery, size zaman kazandıracak bir kütüphanedir. Öyle ki içinde bu işlemleri tek bir kodla yapabilmenize yarayan birçok fonksiyon var.

Neden jQuery?

Tüm işletim sistemlerinde, tarayıcılarda çalışan jQuery büyük firmalar Google, Microsoft vb. tarafından da aktif kullanılmaktadır. Sürekli güncellenen bir yapıya sahiptir. Sizi üzmez, sevindirir.

jQuery’yi nasıl indireceğim ve kullanacağım?

jQuery, sıkıştırılmış ve sıkıştırılmamış olmak üzere iki farklı şekilde dağıtılmaktadır. Sıkıştırılmamış sürümü yaklaşık olarak 61 KB iken, sıkıştırılmış sürümü ise yaklaşık 21 KB. Gördüğünüz gibi dosya boyutları hem javaScript, hem ajax, hem de efekt kütüphanesi için yeterince hafif. Eğer ki jQuery’yi oluşturan kodlara bakmak ve kodlar üzerinde değişiklik yapmak gibi bir düşünceniz yoksa her zaman için sıkıştırılmış sürümünü indirmenizi tavsiye ediyorum.

jQuery'yi sitenizde kullanabilmek için kütüphaneyi kaynak kodlarınıza eklemelisiniz. Bunun için iki yol var:

  • jQuery'yi Yükleyerek Kullanma
  • jQuery'yi Uzaktan Çağırarak Kullanma

jQuery'yi Yükleyerek Kullanma

jQuery'yi yükleyin ve sayfanızın bulunduğu dizine atıp sayfanızda yer verin.

jQuery çalıştırmak için gerekli kütüphaneyi yüklemek için resmi sitesini ziyaret edin.

Yükleme işi bittikten sonra sayfanızla aynı dizine yükleyin. Ardından sayfanızın kaynak kodlarında elementleri arasına şu kodu yerleştirin:

<script src="jquery-1.10.2.min.js"></script>

  jQuery'yi Başka Siteden Bağlantı Yoluyla Çalıştırmak

Bazı siteler jQuery'yi uzaktan çağırmanıza izin verir. Google API bunlardan biridir. Örneğin jQuery kütüphanesi yüklemeden çalıştırabilmek için aşağıdaki kodu yazabilirsiniz.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">

Eğer indirdiyseniz artık sıra onu kullanmaya gelmiş demektir. jQuery tek bir dosyadan oluşuyor. Bu dosyayı da web sayfanıza aşağıdaki örnekte olduğu gibi dâhil etmelisiniz. Web sayfanıza dahil ettikten sonra artık jQuery’nin bizlere sunmuş olduğu özellikleri kullanmaya başlayabilirsiniz. Özellik demişken şimdi de jQuery’nin özelliklerine kısaca göz atalım 

$('a').addClass('deneme').click(fonksiyon);

 

Eklentiler:

jQuery’nin bir başka mükemmel özelliği de eklentileridir. Eklentileri, belli görevleri yapan ve jQuery kütüphanesi üzerinden geliştirilmiş kod parçacıkları olarak tanımlayabiliriz. Örneğin web sitenizde “sekme (tab) menüler” kullanmak isterseniz Tabs eklentisi, web sayfanıza bir mp3 player yerleştirmek isterseniz jMP3 eklentisi ya da bir dosya yükleme uygulaması sunmak isterseniz jqUploader eklentisi ihtiyacınızı karşılamaya hazırdır. Buna benzer yüzlerce jQuery eklentisi vardır ve vakti geldikçe de bu konuda tanıtımlar yapacağım .

Uyumluluk:

jQuery, şu anda en çok kullanılan web tarayıcılarında çalışabilmektedir. Internet Explorer 6.0+, Firefox 1.5+, Safari 2.0+ ve Opera 9.0+ ile sorunsuzca jQuery kullanabilirsiniz. Bunun haricinde Prototype.js gibi başka kütüphaneler ile birlikte de uyum içerisinde kullanabilirsiniz. Bu konuda jQuery’yi Diğer Kütüphaneler ile Birlikte Kullanmak sayfası size yardımcı olacaktır.

Efektler:

jQuery, script.aculo.us gibi tamamen bir efekt kütüphanesi olmamasına rağmen yine de sık kullanılan efektleri sunuyor. Örneğin fadeOut efekti sayesinde bir nesnenin görünürlüğünü yavaş yavaş azaltırken, show efekti sayesinde daha önceden gizlenmiş bir nesneyi görünür kılabiliyorsunuz. En önemlisi de bu efektleri kullanmak çok basittir. Alttaki örnek kodda, “hide” efektini kullanarak “myDiv” isimli nesneyi yavaşça gizlemiş oluyoruz.

$("#myDiv").hide("slow");

AJAX:

jQuery diğer konularda olduğu gibi AJAX konusunda da kullanıcılarına kolaylıklar sağlıyor. Böylece web sayfanızın tamamı yüklenmeden, başka bir web sayfası ile etkileşime geçebiliyorsunuz. AJAX işlemi başlamadan önce veya bittikten sonra bir olayı tetiklemek, sunucudan gelen veri türüne göre (xml, json) işlem yapmak, belli zaman aralıklarında tekrar tekrar istekler yollamak v.s. jQuery ile yapabileceklerinizin küçük bir bölümü. Örneğin alttaki örnek kod ile AJAX kullanarak form.php dosyasına Erhan ve 23 verilerini post etmiş oluyoruz.

$.ajax({
        type: "POST",
        url: "form.php",
        data: "isim=Erhan&yas=23"
});

Bu da basitleştirilmiş ve kolaylaştırılmış versiyonu:

$.post( "form.php", {isim:"Erhan", yas:"23"} );

 

Kaynak

 

Yorumunuzu Ekleyin

Control HTML5 Audio With Jquery
Yükleniyor...