Konular

Eskiler

Bootstrap Hazır Tema Kullanımları 1

Bootstrap Hazır Tema Kullanımları Bu yazımızda Bootstrap hazır tema kullanımları konusundan bahsedeceğiz. Aşağıdaki soruları yanıtlamaya çalışacağız. Temel olarak bir HTML sayfasının hangi bölümlerden oluşur? Bootstrap temalarının sitemizde nasıl kullanılması gerekir? İnceleyeceğimiz Şablonlar: Temel Web Sitesi Şablonu Blog Web Sitesi Şablonu Sosyal Web Sitesi Şablonu Portfolyo Web Sitesi Şablonu   Temel Web Sitesi Şablonu Bootstrap ve HTML kullanarak oluşturulan web sayfası HTML etiketleri içerisinde dört bölümden meydana gelir. HTML sayfası ise Head ve Body olmak üzere iki temel alandan meydana gelmiştir. 1.Head Meta tanımlamaları,script yapıları ve link atamaları bu kısımda yapılmaktadır. Temel bir HTML sayfasında bulunması gereken, önemli bir kısımdır. Bootstrap hazır tema kullanımları için kritik öneme sahip bir bölümdür. 2.Header ve Navigasyon Kısmı (Body İçerisinde) Menü ve logoları yer aldığı kısımdır. Navigasyon menüsü birden fazla sayfadan veya tek sayfadan oluşmuş web sitelerinde sıklıkla kullanılmaktadır. Bir sitenin kimliği sayılabilecek logolar da web tasarımda önemli bir yerdedir. Bu kısımların tanımlamaları ve tasarımları genel olarak…

HTML Nedir ? – HTML5 ve CSS – JS ile Uyumu

HTML5 ve CSS – JS ile Uyumu HTML5 temel web teknolojilerinin başında gelen, web üzerinde statik sayfaları oluşturmak için geliştirilmiş yüksek metin işaretleyici dil olarak adlandırılan bir işaretleme dilidir. Çoğu bilişim otoritesi için HTML dili bir programlama dili değil XML gibi bir işaretleme dilidir çünkü tek başına server taraflı ya da kod arkası olarak işlev yapmaz. ÖNEMLİ NOT: Web Teknojileri her geçen gün kendini geliştirmekte ve kullanıcılara spesifik deneyimler kazandırmayı amaçlamaktadır.Bir web sitesinin görünümü tasarlanırken ilk olarak temel bir HTML yapısı tanımlanarak , kullanıcıya sunmaya çalıştığımız hizmet ne ise ona göre bir tasarım planı çıkartılması gerekir. Örneğin üst düzey bir e-ticaret web sitesi oluşturduğumuzu düşünürsek şüphesiz bir web sitesi dinamik bir şekilde olacak ve server tarafında çalışacak olan bir programlama dili kullanılması gerekecektir. Hiç şüphesiz bu dillerin en popülerleri ASP.Net ve PHP dir. HTML yapısı oluşturulurken etiket yapıları kullanılır ve bunlara bazı özellikler (attribitues) atayarak çeşitli ayarlamalar ve sınıflamalar yapabilirsiniz.…

HTML Canvas Nedir? Nasıl Kullanılır?

HTML Canvas Nedir ? HTML sayfası üzerinde istediğiniz bir şekilde çizim yapmaya ve bu çizimleri kullanarak dinamik bir görünüm sağlamaya yarayan bir HTML etiketidir. Canvas ile Javascript’den de faydalanarak çeşitli oyunlar kodlanabilmekte ya da çeşitli animasyonların gerektiği HTML sayfalarının tasarımları da gerçekleştirilebilmektedir. Daha iyi anlamanız adına teknik detaylar yerine günlük dile daha yakın bir anlatımı sizler için uygun gördüm.Canvas tasarımları 2D (iki boyutlu) veya 3D (özellikle oyun tasarımlarında) şekilde oluşturulabilmektedir. HTML5 teknolojisinin sağladığı en önemli özelliklerden biri hiç şüphesiz “canvas” etiketinin ortaya çıkmasıdır. Temel Şekiller Çizgi (Line) Web sayfası üzerine bir çizgi çizebilmesini sağlayan bir özelliktir. Çizilecek çizginin kalınlığı,uzunluğu,eğimi,rengi gibi bir çok özelliği yapacağınız tanımlamalar ile belirleyebilirsiniz. Temel bazı fonksiyonları kullanarak çizgi özelliklerini belirleriz.İşte bunlardan bazıları : 1.lineTo(): Çizgi eğimini belirlemek için kullanılır. Çizginin eğik yada düz olmasını bu özellik sayesinde ayarlayabiliriz. 2.beginPath(): Çizim yapılmaya başlandığığını deklara eden canvas metodudur. Bu metot line(çizgi) oluşturmak için her zaman gereklidir. 3.stroke(): Çizimin…

Hafıza Oyunu Uygulaması

AngularJS Uygulamamız Hakkında Bilgiler AngularJS Uygulama Linki: http://www.tolgasariyildiz.com.tr/angularjs-match-master Bu yazımızda AngularJS ve bootstrap kullanarak basit bir eşini bulma oyunu tasarlayacağız. Bildiğiniz gibi bu oyunda seçtiğiniz bir karakterin bir eşini diğer boş karelere tıklayarak bulmaya çalışıyoruz. Hangi oyundan bahsediyorsun tarzında sorularınız devam ediyorsa yazıyı okudukça anlayacağınızdan şüpheniz olmasın Projemiz için gerekli olan Bootstrap ve Javascript( AngularJS – JQuery ) kütüphanelerine aşağıda vermiş üç linkten ulaşabilirsiniz : AngularJS için gerekli dosyalar : https://code.angularjs.org/1.2.9/ //Bağlantıda yer alan .zip uzantılı dosyayı indirmeniz yeterlidir. Bootstrap için gerekli dosyalar https://github.com/twbs/bootstrap/releases/download/v3.3.5/bootstrap-3.3.5-dist.zip //Bağlantıda yer alan .zip uzantılı dosyayı indirmeniz yeterlidir. Jquery için gerekli dosyalar : https://code.jquery.com/jquery-1.11.0.min.js //Bağlantıda yer alan .js uzantılı dosyayı sağ tıklayıp gerekli yere farklı kaydet demeniz yeterlidir. Angular-ui için gerekli dosya : https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.10.0/ui-bootstrap-tpls.js yolunda bulunan dosyayı sağ tıklayıp gerekli yere farklı kaydet demeniz gerekir. Gerekli yeri yazıda açıkça belirttik sadece adımları doğru izlemeniz yeterlidir. Projemiz için gereken üç adet klasör ve anasayfamız olan index.html dosyasını tanımladıktan sonra yukarıda…