Eki.12

Eki.10

Eki.10

HTML5 API’leri ile Çalışmak – Ders 13 : IndexedDB API ve Dexie.JS – PART 1

İsmine bakıldığında pek de anlaşılmayan yeni bir veritabanı sistemidir. Yine tarayıcı üzerinde çalışmaktadır. Bir önceki konumuzda WebSQL’i işlerken normal bir MySQL veritabanında nasıl çalışıyorsak aynı şekilde SQL sorgularını kullanarak verilerimizi yönettik. Ancak, WebSQL de bazı durumlarda yavaş kalabiliyor ve bir takım güvenlik sorunları da oluşturabiliyor (Gerçi kullanıcı tarafındaki verileri zaten korumanız mümkün değil). Özellikle verileri okuma konusunda hız ihtiyacından dolayı WebSQL’in yerine JSON tabanlı çalışan ve NoSQL (yani SQL sorguları olmadan) verileri yönetebilmemizi sağlayan yeni bir veri yönetim sistemi geliştirilmiştir. JSON’da key-value mantığı kullanılarak veriler kaydedilebilir, okunabilir, silinebilir ve güncellenebilir (CRUD).
HTML5,JavaScript

Eki.10

HTML5 API’leri ile Çalışmak – Ders 12 : Web Messaging API

Web Messaging API, temelde iki farklı sayfa arasında iletişimin kurulmasını sağlar. Sayfalardan birisi gönderici, diğeri alıcı olur. Mesela aynı domain altındaki sayfalara veya direkt olarak hedef gösterilmiş bir iframe’e mesaj gönderilebilir. Gönderilen mesaj düz metin olabileceği gibi JSON gibi çok fazla veri içeren bir veri formatı da olabilir. Gönderilen verileri karşılayan taraf, verileri işleyip gerekli fonksiyonları da tetikleyebilir.
HTML5,JavaScript

Eki.10

HTML5 API’leri ile Çalışmak – Ders 11 : Notifications API

Notifications API’yi belki son zamanlarda sıkça görüyorsunuzdur. Özellikle de alışveriş sitelerinde güncel kampanyalardan müşterileri haberdar etmek için kullanılır. Asıl amacı fayda vermek olsa da şahsi görüşüme göre zorla bilgi dayatılması amacıyla kullanılan ve insanları rahatsız eden bir bildirim aracı olduğunu düşünüyorum. Çünkü bildirim yapan web sayfasını açtığınızda, o sayfanın sekmesinde değilseniz bile (yani başka bir sayfadaysanız) yine size ekranın sağ alt köşesinde (dikkat, tarayıcının değil!) bildirim gönderebilir. Bunun nedeni, o bildirimin web sayfası ile bir arayüz bağlantısı olmaması, tamamen tarayıcının bir özelliği olmasından dolayıdır. Notifications API, tarayıcının bildirim araüyüznün açılmasını tetikler. Kullanıcı isterse bu bildirimi kapatabilir, hatta bildirim ayarlarına girerek o sayfayı bir daha bildirim yapamaması için bloklayabilir. Mesela Google Chrome’da şu adrese girildiğinde bildirim yapan web sayfalarının listesi ve izinleri görülebilir.
HTML5,JavaScript

Tem.04

JavaScript OOP (Nesne Yönelimli Programlama) Yaklaşımı Ders 4 : Object Veri Tip ile Sınıf, Özellik ve Metot Kavramını İlişkilendirmek

Söylediklerimiz toparlayacak olursak; Object nesnesini bir Class gibi kullanacağız. Class’lar OOP’de metotları bir arada barından kod yığını demektir. Object içinde oluşturacağımız Fonksiyonlar, Class’larda kullandığımız Metot’lar olacaktır. Object içinde tanımladığımız Değişkenler de Özellik olacaktır. Böylece en azından basit seviyede olsa da JavaScript ile nesne yönelimli programlamanın kolaylıklarından faydalanmış olacağız.
JavaScript

Tem.04

JavaScript OOP (Nesne Yönelimli Programlama) Yaklaşımı Ders 3 : Yeni Bir Obje Yapılandırmak

Bir önceki makalede Object oluşturup özelliklerine (değişkenlerine) değer atayıp yazdırmıştık. Ancak bu nesneyi tek bir seferde kullandık. Bazı durumlarda bir nesne oluşturup (Object değil de Function olarak tanımlayacağız), bunu farklı farklı değerlerle de kullanmak istetebilirsiniz. Yani nesne içinde yer alan Özellik’lerin (değişkenlerin) değerleri başlangıç anında boş olacaktır. Aslında bu işlem biraz da parametreli fonksiyon kullanımına benzemektedir. Hazırladığımız nesneyi yeniden türetip, değerlerini girerek içindeki metotları çağırabiliriz. Hemen bir örnek ile inceleyelim…
JavaScript

Tem.04

JavaScript OOP (Nesne Yönelimli Programlama) Yaklaşımı Ders 2 : new Anahtar Kelimesi ile Object Üretmek

Bir Object üretmenin en pratik yolu, new anahtar kelimesi kullanılmaktadır.
<!DOCTYPE html>
  <head>
    <meta charset="utf-8">
	<script type="text/javascript">
		var kisi = new Object();
		kisi.isim = "Uğur";
		kisi.soy_isim = "Gelişken";
		kisi.yas = "33",
		mesaj = "Merhaba. Ben " + kisi.isim + " " + kisi.soy_isim + ", yaşım " + kisi.yas + ".";
		document.write(mesaj);
	</script>
  </head>
</html>
JavaScript

Tem.04

JavaScript OOP (Nesne Yönelimli Programlama) Yaklaşımı Ders 1 : Object Veri Tipi ve Class Mantığı

Bu veri tipi, bir grup içinde daha alt değişkenleri toplayarak birden fazla değeri tutabilmektedir. Mesela Insan bir Object olursa, isim, soyisim ve yas değerleri de alt değişkenleri olur. Eğer elimizde bir kişi olsa, sadece bu alt değişkenlerle işimizi görebiliriz. Fakat bir sınıfta yer alan 50 kişinin değerlerini tutmak istersek, o zaman Object kullanmak kaçınılmaz olur.
JavaScript

Tem.02

AniJS Dersleri 3: jQuery, Bootstrap ve AniJS ile Resimler Arası Geçiş

Bu örnekte, başlıkta da belirtmiş olduğumuz jQuery, Bootstrap ve AniJS ile basit bir örnek yapacağız. Örneğimizde 3 adet buton olacak. Bu butonlar Bootstrap ile stillendirilecek. AniJS ile de bu butonlara tıklandığında, 3 farklı div içinde yer alan resimleri efektli bir şekilde geçiş yaptırarak göstereceğiz. div’lerin görünürlüklerini de kontrol edebilmek için jQuery kullanacağız.
JavaScript