Bootstrap 4 _{Responsive Tasarım Teknikleri ve Front-end Toolkit'leri}

“İlk Önce Mobil” sloganı ile üretilmiş olan JavaScript ve CSS birleşimi olan melez bir Framework olan Bootstrap, günümüzde neredeyse yeni nesil bütün web sayfalarının tasarımlarında ve hybrid olarak üretilen mobil uygulamaların arayüz tasarımında, geliştiricilerinin de iş yükünü hafifletmektedir.

Bootstrap kitabı ile ilgilendiğinize göre, tahmin ediyorum ki az çok web tasarımından az çok anlıyor olan birisiniz. Öyleyse çok fazla boş lafa girmeden, direkt olarak bu kitabın size ne kazandıracağından bahsedeyim.

Öncelikle Bootstrap nedir, ne değildir kısaca açıklayayım…

Bootstrap; “İlk Önce Mobil” sloganı ile üretilmiş olan JavaScript ve CSS birleşimi olan melez bir Framework'tür. Günümüzde neredeyse yeni nesil bütün web sayfalarının tasarımlarında ve hybrid olarak üretilen mobil uygulamaların arayüz tasarımında kullanılmaktadır. Twitter tarafından üretilmiş, Open Source olarak ücretsiz bir şekilde dağıtıma verilmiş, web sayfalarında önyüz geliştirmek için kullanılan, arayüz geliştiricilerinin iş yükünü neredeyse tamamen üzerine alan bir Framework'tür.

Kitap, şu an release sürüm olmaya hazırlanan Bootstap v4 sürümünü bütün yönleriyle ele almıştır. Genel olarak tipografi, grid sistemi, bileşenler, bileşenlerin jQuery ile kullanımı, CSS ile ortak kullanımları ve daha birçok özellik uygulamalı olarak işlenmiştir.

Ayrıca, yeni nesil Frond-end Toolkit'ler dediğimiz Node.js tabanlı çalışan npm paket yöneticisi ve Grunt görev yöneticisi de uygulamalı olarak ele alınmış, şu an sektörde en çok ihtiyaç duyacağınız uygulama örnekleri (proje oluşturma, sürüm notları, dosya değişikliği izleme, real-time yansıtma, yedekleme, SASS derleme, HTML, JS ve CSS dosyalarını minimize etme, dosya birleştirme gibi) de video destekli olarak anlatılmıştır.

Kitapta edineceğiniz bilgilerle, responsive (duyarlı) ve adaptive (adapte olan) web arayüzü geliştirme kendinizi geliştirmiş olacaksınız.

Kitabın ilk baskısı Alpha v1'e göre hazırlanmıştı. Şu an kitabın ikinci baskısı hazırlanırken Beta v2'ye göre yeni gelen özellikler de eklendi, değişiklikler yeniden revize edildi. Ancak Beta sürümlerinde de birtakım değişiklikler meydana gelebilmektedir. Bu nedenle Bootstrap'ın resmi sitesinden veya Github reposundan mutlaka versiyon güncellemelerini inceleyin, bunu da bir alışkanlık haline getirin. Daha doğrusu bir proje hazırladığınızda ve sonrasında projeyi güncel framework'lerle update etmek istediğinizde, mutlaka yeni sürüm notlarını inceleyin ve varsa düzenlemelerinizi gerçekleştirdikten sonra güncellemenizi yapın.

CD içeriğinde de framework dosyaları, kitapta anlatılan örneklere ait kaynak kodlar ve gerekli araçlar yer almaktadır. Ayrıca, kitabın ikinci kısmında anlatılan uygulama örneklerine ait Eğitim Videoları da CD'de yer almaktadır. Çevremden ve vermiş olduğum eğitimlerden gözlemlediğim kadarıyla, bu tür araçlara aşina olmayan kişilerin en çok zorlandıkları konular oluyor. Bu nedenle video hazırlama ihtiyacı duydum. Videolar ve kitapta anlatılan konular birbirini tamamlayıcı niteliktedir. Öncelikle kitabı okumalı, sonrasında da ilgili bölüme ait videoyu izleyerek bilgilerinizi pekiştirmelisiniz.

Genel olarak kitaptaki ana başlıklar şunlardır:

• A'dan Z'ye Bootstrap 4
• Bootstap'a Giriş ve Temel Kavramlar
• Responsive ve Adaptive Kavramları
• Sublime Text ile Kodlama
• Responsive Tasarım Test Araçları
• Bootstrap 4 ile Gelen Yenilikler ve Geride Bırakılanlar
• Grid (Izgara) ve Media Object (Medya Nesnesi) Düzen Sistemi
• Bootstrap CSS (Tipografik Stiller)
• Bootstrap Components (Bileşenler) ve jQuery Plug-in'leri
• jQuery ile Bootstrap Bileşenlerini Kontrol Etme
• PHP ile Bootstrap Navbar Kullanımı
• Yazdırma İşleminde Gösterilecek Alanları Belirleme ve Yazdırma için Sade Stil Verme
• @media Sorgularına Göre Stil Değiştirme ve DOM Gizleme/Gösterme
• FrontEnd Toolkit'leri ile Otomasyon ve Optimizasyon Sağlama npm ile Boostrap Projesi Oluşturma
• Versiyonlama Mantığı ve Avantajları
• Grunt ile Görevleri Otomatikleştirme
• Paket Yapılandırması
• Grunt Task Tanımlama Teknikleri
• Uygulamalı Olarak Aşama Aşama Dosya İzleme, Real-time Yansıtma, Yedekleme, SASS'ı CSS'e Derleme, CSS/JS Birleştirme, CSS/JS/HTML Minimize Etme
• Grunt Task'larını Kullanma