AJAX nedir?
Zaman uyumsuz JavaScript ve XML (AJAX), web uygulamalarını kullanıcı etkileşimine daha duyarlı hale getiren web uygulaması geliştirme teknolojilerinin bir kombinasyonudur. Kullanıcılarınız düğmelere veya onay kutularına tıklamak gibi yollarla bir web uygulamasıyla her etkileşim kurduğunda tarayıcı, uzak sunucuyla veri alışverişinde bulunur. Veri alışverişi, sayfaların yeniden yüklenmesine ve kullanıcı deneyiminin kesintiye uğramasına neden olabilir. AJAX ile web uygulamaları arka planda veri gönderebilir ve alabilir, böylece sayfanın yalnızca küçük bölümleri gerektiği şekilde yenilenir.
AJAX kullanım örnekleri nelerdir?
Web uygulamalarında çeşitli özellikler oluşturmak için AJAX'ı kullanabilirsiniz.
Otomatik Tamamlama
Arama motorları, kullanıcılar arama çubuğunda belirli bir anahtar kelimeyi aradığında gerçek zamanlı olarak otomatik tamamlama seçenekleri sunar. AJAX, web sayfasının girilen her karakteri web sunucusuna aktarmasına ve ilgili önerilerin bir listesini mevcut sayfa üzerinde döndürmesine olanak tanır.
Form doğrulama
AJAX sayesinde web uygulamaları, formlardaki belirli bilgileri, kullanıcılar henüz bu bilgileri göndermeden önce doğrulayabilir. Örneğin, yeni bir kullanıcı bir hesap oluştururken, kullanıcı bir sonraki bölüme geçmeden önce, web sayfası istenen kullanıcı adının müsait olup olmadığını otomatik olarak doğrulayabilir.
Sohbet işlevselliği
Yazı tabanlı mesaj uygulamaları ve sohbet robotları, tarayıcılarda gerçek zamanlı konuşmaları görüntülemek için AJAX kullanır. AJAX, bir kullanıcı tarafından yazılan metni sunucuya gönderir ve eş zamanlı olarak diğer kullanıcıların sohbet arabirimlerinde yayımlar.
Sosyal medya
Sosyal medya platformları, tarayıcıda yeni bir sayfa yüklemeden kullanıcıların akışlarını en son içeriklerle güncellemek için AJAX kullanır. Örneğin, takip ettiğiniz birisi bir güncelleme tweetlediğinde, Twitter sizin akışınızı hemen yeniler.
Oylama ve derecelendirme sistemleri
Bazı forumlar ve sosyal yer işaretleme siteleri, belirli gönderilerin derecelendirmesini veya oylarını gerçek zamanlı olarak görüntülemek için AJAX kullanır. Örneğin, tüm sayfayı yenilemek zorunda kalmadan Reddit'teki bir gönderiye olumlu veya olumsuz oy verebilirsiniz.
AJAX'ın bazı pratik örnekleri nelerdir?
Gerçek hayattan birkaç AJAX uygulamasını aşağıda paylaşıyoruz.
- Jeo-uzamsal verileri gerçek zamanlı olarak getirmek ve işlemek için WIND araç setinin AJAX'ı nasıl kullandığını okuyun. Kullanıcılar ayrıntılı bir görünüm için harita üzerinde belirli bir bölgeyi yakınlaştırabilir.
- Bir akıllı sohbet uygulamasında otomatik olarak çalınan ses dosyalarını getirmek için Pubnub sohbet motorunun AJAX'ı nasıl kullandığını okuyun.
- Gerçek zamanlı kullanıcı kaydını kolaylaştırmak amacıyla, çok dilli bir SMS tabanlı klinik izleme çözümünün, kayıt portalında AJAX'ı nasıl kullandığını okuyun. Kullanıcılar kaydolduktan sonra, AJAX uygulaması kendilerine tercih ettikleri dilde SMS gönderir.
AJAX hangi teknolojileri kullanır?
AJAX, web uygulamalarının web sunucularıyla zaman uyumsuz olarak veri alışverişi yapmasına imkan tanıyan birkaç web ve programlama teknolojisinden oluşur.
XHTML, HTML ve CSS
Genişletilebilir Köprü Metni Biçimlendirme Dili (XHTML), HTML ve Basamaklı Stil Sayfaları (CSS) birer biçimlendirme dilidir. Web sayfanızdaki içeriklerin tasarımı ve stili hakkında web tarayıcılarına bilgi aktarmak için bunları kullanabilirsiniz.
Örneğin, bir web sayfasındaki metinleri ve görüntüleri konumlandırmak için XHTML veya HTML kullanabilirsiniz. Ardından, yazı tipini ve arka plan rengini değiştirmek için CSS kullanabilirsiniz.
XML
XML, farklı uygulamaların veri alışverişi yapmasına imkan tanıyan bir programlama dilidir. Veriler çeşitli uygulamalarda farklı şekillerde temsil edildiğinden, verileri düz metin çerçevesine yerleştirmek için XML kullanabilirsiniz. Böylece AJAX uygulamaları ortak bir XML formatında veri alışverişi yapabilir ve verileri işleyebilir.
XMLHttpRequest
XMLHttpRequest, web tarayıcılarının web sunucusuyla zaman uyumsuz olarak iletişim kurmasını sağlayan bir API'dir. Kısmi web sayfası bilgilerini sunucuya XML biçiminde göndermek için XMLHttpRequest nesnesini kullanabilirsiniz.
API'ler hakkında bilgi edinin »
Belge Nesne Modeli
Belge Nesnesi Modeli (DOM), HTML ve XML sayfalarını ağaç benzeri bir yapıda organize eder. DOM, daha fazla alt düğüme veya nesneye ayrılan düğümlerden oluşur. Belirli sayfalardaki kodları daha verimli bir şekilde şekillendirmenize veya değiştirmenize olanak tanır.
JavaScript
JavaScript, web sayfalarına dinamik içerik sunmak için kullanabileceğiniz bir betik dilidir. Dinamik içerik, gerçek zamanlı olarak güncellenen veya kullanıcı etkileşimlerine bağlı olan web sayfası bilgilerini ifade eder. Örneğin, AJAX söz konusu olduğunda, JavaScript ve bu gönderide bahsettiğimiz diğer web teknolojileri birlikte çalışarak zaman uyumsuz sayfa güncellemelerini mümkün kılar.
AJAX nasıl çalışır?
AJAX, tarayıcılarla sunucular veri alışverişi yaparken zaman uyumsuz çağrıları mümkün kılmak için JavaScript ve XML kullanır. Şimdi, tarayıcıların geleneksel olarak nasıl veri alışverişi yaptığını açıklayacağız ve bunu AJAX aracılığıyla yapılan veri alışverişleriyle karşılaştıracağız.
AJAX olmadan veri alışverişi
Geleneksel bir modelde, kullanıcı bir eylem gerçekleştirdiğinde tarayıcı, sunucu tarafına bir HTTP isteği gönderir. Web sunucusu isteği alıp işler ve güncellenmiş verileri tarayıcıya gönderir. Ardından tarayıcı, web sayfasını yeni verilerle yeniler.
Bu yaklaşımda, istenen veriler küçük değişikliklerden oluşsa bile tarayıcı tüm sayfayı yeniden yükler. Dahası, tarayıcı sık sık istek gönderebilir ve bu da web sunucusu yazılımına gereksiz yük bindirebilir.
AJAX ile veri alışverişi
AJAX tüm sayfayı güncellemek yerine, bir JavaScript işlevi kullanarak tarayıcıda bir XMLHttpRequest nesnesi oluşturur. Ardından, sayfa bilgilerini XML biçiminde derler ve XMLHttpRequest nesnesi bunu web sunucusuna gönderir. Web sunucusu isteği işler ve istenen verilerle yanıt verir. Son olarak tarayıcı, sayfayı yenilemeden mevcut ekranı en son verilerle günceller.
AJAX neden daha verimlidir?
AJAX, veri alışverişi ve bilgi akışındaki benzerliklere rağmen, geleneksel web isteklerinden daha verimlidir. AJAX kullanıldığında, tarayıcı yalnızca istenen verilere dayalı olarak belirli web içeriklerini günceller. Sayfadaki diğer içeriklerde gereksiz yenilemeler yapmaz. Bu, AJAX uygulamalarını geleneksel web uygulamalarından daha hızlı ve daha duyarlı hale getirir.
AWS, web uygulaması geliştirme gereksinimlerinizi nasıl destekleyebilir?
Amazon Web Services (AWS), web uygulaması geliştirmede sizi destekleyecek çeşitli teknolojilere sahiptir:
- AWS Amplify, web uygulamalarını ve mobil uygulamaları zahmetsizce oluşturmak, dağıtmak ve ölçeklendirmek için bir dizi araç sunar. AWS Amplify'ı kullanarak platformlar arası uygulamalar oluşturabilir, kullanıcı dostu uygulama arabirimleri geliştirebilir ve web uygulamalarını güvenli AWS içerik teslim ağlarında barındırabilirsiniz.
- AWS API Ağ Geçidi, geniş ölçekte API'ler oluşturmak, dağıtmak ve yönetmek için tam olarak yönetilen bir hizmettir. Yüzlerce eş zamanlı API çağrısını güvenli, esnek ve şeffaf bir ortamda işleyebilir. AWS API Ağ Geçidi'ni kullanarak web uygulamaları için RESTful ve HTTP API'leri oluşturabilirsiniz.
- AWS Lambda, altyapı tedarik etmeden kod çalıştırmanıza olanak tanıyan sunucusuz bir hizmettir. Uygulamanız için işlem kaynaklarını istek üzerine ölçeklendirebilir ve yalnızca kullandığınız kaynaklar için ödeme yapabilirsiniz.
Lambda işlevlerinizi RESTful API olarak ortaya koymak için Amazon API Ağ Geçidi'ni kullanabilirsiniz. Ardından, ortaya çıkan API'lere AJAX çağrıları yapan istemci tarafı JavaScript'i ekleyerek dinamik bir web uygulaması oluşturabilirsiniz. AWS Amplify, AWS Lambda ve AWS API Ağ Geçidi ile sunucusuz bir uygulama oluşturmayı öğrenin.
Hemen bir hesap oluşturarak AWS'de AJAX'ı kullanmaya başlayın.
