Bootstrap
Herkese merhaba, bu hafta Bootstrap hakkında bilmemiz gereken temel konulara dokunarak hızlı bir giriş yapıyoruz.
Bootstrap Nedir?
Bootstrap, farklı cihazlar için responsive tasarıma duyarlı bir CSS kütüphanesidir. Geliştiricilerin ve tasarımcıların hızlı ve tam olarak duyarlı web siteleri oluşturmalarını sağlayan, araçlar bütünü ve önyüz çatısıdır.
Bootstrap Neden Tercih Edilir?
Dünyanın en popüler kütüphaneleri arasında yer alır. Açık kaynak kodlu, modern, hızlı ve mobil öncelikli siteler yapabilmemizi sağlar. Bunların yanında daha da önemlisi gelişmiş grid (ızgara) sisteminin olmasıdır. Bu sayede tasarımlar, hem masaüstü hem de mobil cihazlarda mükemmel bir uyum içerisinde çalışabiliyor. Üstelik daha az class kullanarak… Bu süper değil mi? Şimdi gelin basit bir bootstrap örneği ile bu açıkladıklarımızı taçlandıralım.
Gördüğümüz gibi yazdığımız kısacık kod ile olabilecek en iyi çıktıyı alabiliyoruz. Ve bunu birçok cihaza duyarlı olabilecek şekilde yapıyoruz. Tasarladığımız sayfa mobilde nasıl görünüyor hemen bakalım.
Oldukça iyi değil mi? Son olarak birkaç madde ile Bootstrap neden tercih edilir dersek:
- Faydalı komponentler(bileşenler) içerir.
- Javascript desteği sağlar.
- Zamandan tasarruf ettirir.
- Bootstrap tutarlıdır. (Yani Internet Explorer’a bakınca da aynı Chrome’a bakınca da aynı sonucu alırsınız.)
- Güçlü dokümantasyon desteği sunar.
- İhtiyaca göre özelleştirilebilir.
- Entegrasyon çok kolay ve hızlı.
- Responsive bir yapı sağlar.
- Tema desteği sunar.
- Geniş bir topluluğa sahiptir.
Faydalı birçok komponentler(bileşenler) içerdiğinden bahsetmiştik. Linkten ulaşacağınız bileşenleri kendi projelerinizde kolaylıkla kullanabilirsiniz. Bootstrap’in sizlere sunduğu dokümanları resmi sitesi getbootstrap.com adresinden ziyaret ederek sık sık inceleyip yeniliklerden haberdar olarak projelerinizde daha etkin şekilde kullanım sağlayabilirsiniz.
Bootstrap’i Nasıl Öğrenebiliriz?
Bootstrap bir kütüphanedir demiştik. Bu kütüphaneyi kullanmak için bazı yapıları, neyin nasıl yapıldığını bilmek gerekir. Öncelikle CSS ve HTML temellerini iyi anlamamız gerekiyor. Ama bu demek değil ki her şeyi A’dan Z’ye süper bir şekilde öğrenelim. Yapıların mantığını anladıktan sonra zamanla, projeler yaparak öğrendiklerimiz daha iyi pekişecek ve Bootstrap’ın resmi sitesi üzerinden ihtiyacımız olan komponentleri ve özellikleri kopyala yapıştır olarak projelerimize kolaylıkla dahil edebileceğiz.
Yukarıdaki Bootstrap örneğimde de resmi siteden ihtiyacım olan komponentleri alarak yapmıştım. Şimdi de Bootstrap kullanarak beraber bir sayfa yapalım.
İlk olarak getbootstrap.com resmi sitemize giriyoruz. Kategorilerden Dokümanlar(Docs)’a, daha sonra Başlarken(Getting started) ve Giriş(Introduction)’e geldikten sonra sayfada ihtiyacımız olan kod parçacığını kopyalıyoruz. Ben birinci maddede yer alan kodu kullandım. Ve <p> etiketi ile küçük bir paragraf eklemek istedim.
İşte bu kadar basit. Ama basit olduğu kadar kurcalanması ve öğrenilmesi gereken bir çok noktası da var. Bootstrap sizi de heyecanlandırmıyor mu? Peki şimdi sizde Bootstrap öğrenmek istemez misiniz? Kullanımı kolay, içeriği bol ve özelleştirilebilir bir çok yönü ile geliştiricilerini bekliyor.
Umarım keyifli ve faydalı bir içerik olmuştur. Sevgiyle kalın hoşça kalın…
“Yazılımda kadın eli”
