JQUERY NEDİR?
2006'da John Resig isimli bir geliştirici, JavaScript ile uğraşırken çok yaygın bir sorunla karşılaşıyordu: aynı kodun Internet Explorer, Firefox ve diğer tarayıcılarda farklı davranması. O dönemde bir tarayıcıda çalışan kod, diğerinde hiç çalışmıyor olabilirdi. Çözüm üretmek için "JavaScript yazmayı kolaylaştıracak küçük bir yardımcı kütüphane" yazdı. Adını jQuery koydu.
Sonraki 10 yıl boyunca jQuery web'in en yaygın kullanılan JavaScript kütüphanesi oldu. 2015'te dünya web sitelerinin yüzde 80'inden fazlasında bulunuyordu. Bugün bu oran düşmüş olsa da hâlâ yüzde 70 civarındadır; özellikle WordPress siteleri ve eski kurumsal projeler jQuery'ye bel bağlamış durumda.
Bu yazıda jQuery'nin ne olduğunu, ne işe yaradığını, nasıl çalıştığını, modern JavaScript dünyasındaki yerini ve bugün hâlâ öğrenilmesi gerekip gerekmediğini açıklıyoruz.
jQuery nedir?
jQuery, JavaScript üzerine kurulmuş açık kaynak bir kütüphanedir. Programlama dili değil, bir araç setidir. Kendi başına çalışmaz; bir HTML sayfasının içinde JavaScript ile birlikte çalışır. Metotların tam listesi ve parametreleri için resmi API referansı en güvenilir kaynaktır.
Sloganı şudur: "Write less, do more" (daha az yaz, daha çok yap). Bu söz tam olarak jQuery'nin var oluş amacını anlatır. Saf JavaScript ile 5 satır gerektiren bir işlemi jQuery ile 1 satıra düşürebilirsiniz.
Saf JavaScript vs jQuery: pratik karşılaştırma
Bir butona tıklandığında bir metnin değişmesi örneği:
// Saf JavaScript (vanilla)
document.querySelector("button").addEventListener("click", function() {
document.querySelector("#mesaj").textContent = "Merhaba!";
});
// jQuery
$("button").click(function() {
$("#mesaj").text("Merhaba!");
});jQuery sürümü daha kısa ve okunabilir. 10 yıl önce bu farkın büyük değeri vardı; çünkü JavaScript syntax'i bugünkü kadar olgun değildi.
jQuery ne işe yarar?
jQuery beş ana iş için kullanılır:
1. DOM manipülasyonu
HTML elemanlarını seçmek, içeriğini değiştirmek, eklemek veya silmek. jQuery'nin asıl gücü buradadır.
$("#baslik").text("Yeni başlık"); // Metni değiştir
$(".kart").addClass("aktif"); // Sınıf ekle
$("p").remove(); // Tüm paragrafları sil
$("ul").append("<li>Yeni öğe</li>"); // Liste sonuna ekle2. Event yönetimi
Kullanıcı etkileşimlerine (tıklama, fare hareketi, klavye, form gönderimi) tepki vermek.
$("button").click(function() {
alert("Tıklandı!");
});
$("input").keyup(function() {
console.log($(this).val());
});
$("form").submit(function(event) {
event.preventDefault();
// Form gönderimini engelle
});3. Animasyonlar
CSS animasyonlarından önce, jQuery'nin animate(), fadeIn(), slideDown() gibi fonksiyonları sayfa içi hareket için ana çözümdü.
$("#kutu").fadeOut(500); // Yarım saniyede solar
$("#kutu").slideUp(300); // Yukarı kayarak gizlenir
$("#kutu").animate({
opacity: 0.5,
marginLeft: "100px"
}, 1000); // 1 saniyede animasyon4. AJAX istekleri
Sayfa yenilemeden sunucudan veri çekmek. jQuery'den önce AJAX çağrısı yapmak karmaşıktı.
$.ajax({
url: "/api/urunler",
method: "GET",
success: function(data) {
console.log(data);
},
error: function(err) {
console.error("Hata:", err);
}
});
// Kısayol versiyon
$.getJSON("/api/urunler", function(data) {
console.log(data);
});5. Tarayıcı uyumluluğu
jQuery'nin orijinal değeri buradaydı. Aynı kod Internet Explorer 6'da, Firefox'ta, Chrome'da aynı şekilde çalışıyordu. Bu sıkıntı bugün büyük ölçüde ortadan kalktı çünkü modern tarayıcılar standartlara uyuyor.
jQuery selector mantığı
jQuery'nin en sevilen tarafı CSS-benzeri seçicilerle elemanları kolayca seçebilmesidir.
$("p") // Tüm paragraflar
$("#baslik") // id="baslik" olan eleman
$(".kart") // class="kart" olan tüm elemanlar
$("ul li") // ul içindeki tüm li'ler
$("input[type='text']") // Type'ı text olan input'lar
$("li:first") // İlk li
$("p:contains('hata')") // İçinde "hata" geçen paragraflarBu söz dizimi CSS bilen herkes için tanıdıktır. Bu sayede yeni öğrenenler jQuery'yi hızla benimsiyordu.
jQuery nasıl projeye eklenir?
İki ana yöntem var.
1. CDN ile (en yaygın)
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>2. İndirip projeye koyma
jquery.com sitesinden minified versiyonu indirip projenin kendi klasörüne koymak.
Her iki durumda da $ sembolü tüm sayfada kullanılabilir hale gelir.
Modern JavaScript dünyasında jQuery'nin yeri
2015'ten itibaren JavaScript ekosistemi büyük değişim yaşadı:
- ECMAScript 2015 (ES6) ile modern JavaScript syntax'i geldi
document.querySelector()jQuery selector mantığını dile getirdifetch()API'si AJAX'ı saf JavaScript ile basitleştirdi- CSS animasyonları ve
transitionjQuery animate'in yerini aldı - React, Vue ve Angular gibi framework'ler reaktif DOM manipülasyonu sundu
Bu değişimler jQuery'nin "olmazsa olmaz" durumunu sona erdirdi. Bugün yeni projelerde jQuery kullanım oranı her yıl düşüyor.
Aynı işlemler bugün nasıl yapılır?
// Eleman seçme
document.querySelector("#baslik") // jQuery'deki $("#baslik")
// Event ekleme
document.querySelector("button")
.addEventListener("click", () => {
console.log("Tıklandı");
});
// AJAX
fetch("/api/urunler")
.then(res => res.json())
.then(data => console.log(data));
// Animasyon: CSS ile
.kutu { transition: opacity 0.5s; }
.kutu.gizli { opacity: 0; }Görüldüğü gibi modern JavaScript jQuery kadar pratik olabiliyor. jQuery'nin sunduğu kısa söz dizimi avantajı büyük ölçüde dağıldı.
Bugün jQuery kullanılan yerler
jQuery hâlâ tamamen ölmedi. Şu durumlarda kullanılmaya devam ediyor:
- WordPress siteleri: Çoğu tema ve eklenti jQuery ile yazılmış; WordPress core jQuery'yi yerleşik olarak yüklüyor
- Eski kurumsal projeler: 5-10 yıllık iç ağ uygulamaları jQuery ile yazılmış; sürekli bakım gerektiren mevcut kod tabanları
- Bootstrap 4 projeleri: Bootstrap 4 jQuery bağımlısı; Bootstrap 5 bunu kaldırdı
- Eklenti ekosistemi: jQuery için yıllar içinde yazılmış binlerce eklenti (slider, datepicker, mask gibi)
- Hızlı prototip: Tek sayfa basit etkileşim için hâlâ pratik
StatCounter ve W3Techs verilerine göre 2026 itibarıyla dünya web sitelerinin yaklaşık yüzde 70'inde jQuery hâlâ kullanılıyor (azalmakla beraber). Bu nedenle bir geliştirici jQuery'yi hiç bilmeden çoğu projeye giremez; en azından kod okuyup anlayabilmek gerekir.
Yeni başlayanlar için: jQuery öğrenmeli mi?
2026'da yeni başlayan bir geliştirici için tavsiye şudur:
Önce modern JavaScript
Doğrudan jQuery'ye dalmak yerine önce vanilla JavaScript'i sağlam öğrenin. querySelector, addEventListener, fetch, async/await, ES6+ syntax temel olmalı. Sıralı bir yol haritası için kapsamlı JavaScript eğitimi uygun bir başlangıç noktasıdır.
Sonra ihtiyaca göre jQuery
WordPress veya eski projelerde çalışacaksanız jQuery temel seviyede bilmeniz iş hayatınızı kolaylaştırır. Selector mantığı, event handler ve AJAX kısımları öğrenilmesi 2-3 günü almayan konulardır.
Yeni proje açıyorsanız: jQuery'siz başlayın
Sıfırdan başlayan bir projede jQuery seçmek 2026'da artık önerilmez. Vanilla JavaScript veya React/Vue gibi modern framework'ler daha verimlidir.
jQuery'nin geleceği
jQuery'nin son büyük sürümü 3.7'dir (2023). Hâlâ aktif geliştirme yapılıyor ama yeni özellik eklemekten çok kararlılık ve güvenlik güncellemelerine odaklanıyor. Bootstrap 5'in jQuery bağımlılığını kaldırması semboliktir; jQuery yıldızının söndüğünü gösteriyor.
Önümüzdeki 5-10 yıl içinde jQuery muhtemelen tamamen yok olmayacak ama "yeni projede kullanılan" değil "eski projede bakımı yapılan" bir kütüphane konumunu alacak. Bu nedenle jQuery bilen bir geliştirici "modern" değil "geçmiş projelerde işe yarayan" profili çiziyor.
Toparlarsak
jQuery, 2006-2016 arasındaki dönemde web'in en güçlü JavaScript aracıydı. DOM manipülasyonu, event yönetimi, animasyon ve AJAX işlemlerini kısa kodla mümkün kılarak milyonlarca geliştiricinin işini hızlandırdı. Bugün modern JavaScript bu işlerin çoğunu kütüphane gerektirmeden yapabiliyor; bu nedenle yeni projelerde jQuery tercih edilmiyor. Ancak mevcut WordPress siteleri ve eski kurumsal projeler için temel jQuery bilgisi hâlâ kariyere katkı sağlıyor. Yeni başlayanların stratejisi net: önce modern JavaScript'i sağlam öğren, sonra ihtiyaca göre jQuery'yi temel seviyede öğren.
