JavaScript

Intercooler.js ile Ajax’ı HTML’ye karıştırın

Herhangi bir web sitesine Ajax eklemenin kolay bir yöntemini arıyorsanız. Doğru yere geldiniz. 😉 Aslında Tek Sayfalı Uygulamalar(Single-Page Apps) veya SPAs adı verilen Ajax isteklerine dayalı web siteleri oluşturmak oldukça yaygındır.

Lakin her zaman sayfa içeriğini güncellemek için biraz jQuery ve bir kaç teknik bilgi gerekmektedir. Basit olarak yanlızca Ajax işlevselliğine kullanmaya ihtiyaç duyarsanız. Bu ihtiyacınıza karşılık olarak HTML kodlarıyla birlikte harmanlanmış intercooler.js kullanabilirsiniz.

Intercooler, doğal olarak Ajax istek(request) URL’leri içeren HTML öznitelik(attributes) yazmanıza izin verir. Kullanıcılar belirli bağlantılara tıkladığında normal tıklama eylemi yerine Ajax isteklerinin çalıştırılmasını emredebilirsiniz.

ic-post-to özelliğini bir button’a veya bir link’e ekleyebilirsiniz. Bir Ajax POST isteği için jQuery’ye otomatik olarak bağlanacaktır.

Kütüphanede ic-post-to özelliği gibi niteliklerin hepsinin bir arada olduğu sayfayı ziyaret edebilirsiniz. Nasıl kullanıldığını görmek için basit bir örnek kodu aşağıdaki örnekte görebilirsiniz.

Bu örnekte /buton_click URL’sine bir Ajax POST isteği gönderilir ve response(cevap) kapsayıcı elemente yüklenir. Intercooler oldukça basit bir kütüphanedir ve nasıl çalıştığını anladığınızda inanılmaz derecede güçlüdür.

Bir jQuery ve local Intercooler CDN kullanarak herhangi bir dosya indirmeden denemeye koyulabilirsiniz. <script> elementiyle yerleştirdikten sonra istediğiniz gibi HTML niteliklik referanslarını yerleştirip kullanabilirsiniz. Bunların yanında Bower yardımıyla paketi yükleme işlemi gerçekleştirebilirsiniz.

CDN

Bower

Github sayfasına bu linkten ulaşabilirsiniz. Üzerinde oynamalar yapabileceğiniz demoların tam listesini görmek için demolar sayfasına göz atabilirsiniz. Özellikle Click to Edit demosu intercooler kütüphanesinin front-end kısmında olup bitenleri özetlemektedir. Her bir demo farklı bir eylem gerçekleştirir; bu nedenle neyin nasıl çalıştığını incelemek oldukça çok önemlidir.

Umarım faideli olmuştur. Herkese verimli iyi çalışmalar diliyorum. Mutfakta kalın. Çayımız ve kahvemiz her zaman tazedir. 😉



Yazar hakkında

Fatih Özel

Developer Teknovol | Çırak JavaScript Engineering

Yorumlar

Bir yorum yaz