HTML & CSS

Bootstrap Nasıl Kurulur?

Bootstrap’i kurmak için gereken adımları tartışalım.

Adım 1:  Önyüklemeyi indirmek için aşağıdaki bağlantıyı kullanın. İndir’e tıklayın; önyükleme paketi bir Zip klasörüne indirilecektir. Bu klasör CSS ve JS klasörlerini içerir.

İndirilen bootstrap paketi, projeye kolayca entegre edilebilen derlenmiş kod ile kullanıma hazırdır. Derlenmiş ve küçültülmüş CSS paketlerinden ve Javascript Eklentilerinden oluşur .

Adım 2:  Kaynak dosya : Bootstrap, javascript, sass ve dokümantasyon dosyaları yardımıyla kendi varlık ardışık düzeni ile derlenebilir.

İndirilen dosyaları almak için İndirme Kaynağına tıklayın. Js, CSS ve diğer dosyaları içerir.

Adım 3:  Paket Yöneticileri:  Bootstrap, Node.js tarafından desteklenen dosyalara veya uygulamalara yüklenebilir.

$ npm install bootstrap

Adım 4:  Node.js uygulamaları için, iplik paketi yardımı ile de bootstrap kurulabilir.


$ yarn add bootstrap

Adım 5:  Kullanıcı, Ruby gems uygulamaları için önyükleme kurmak isterse

  • Paketleyiciyi kullanma :gem ‘bootstrap’, ‘~> 4.0.0’
  • Paketleyici olmadan :$ gem install bootstrap –v 4.0.0

Adım 6:  Oluşturucu, önyükleme sass ve javascript’lerini kurmak ve yönetmek için kullanılabilir

$ Composer require twbs/bootstrap: 4.0.0

Adım 7:  NuGet’i kullanarak, CSS ve sass ve javascript for.Net uygulamaları için önyüklemeleri yükleyebilir ve yönetebilirsiniz .

  • Yükleme Paketi önyüklemesi
  • Yükleme Paketi bootstrap.sass

Adım 8:  Jquery, önyükleme dosyaları veya kurulum klasörü ile de kullanılıyor. Daha iyi bir kullanıcı arayüzü deneyimi için Jquery’nin indirilmesi ve Jquery dosyasını Bootstrap kök klasörüne yerleştirmesi gerekir ve en önemlisi Jquery, daha çekici ve duyarlı bir görünüm sağlayan bootstrap özelliklerini geliştirir.

Adım 9:  Yukarıdaki adımları uyguladıktan sonra, geliştirici, HTML sayfası için tüm dosyaları bağlamak için HTML kodunu yazabilir ve yanıtı kontrol etmek için HTML dosyasını açabilir.

Desteklenen Tarayıcılar

Önyükleme, temel olarak tüm tarayıcı ve platformun en son ve kararlı sürümünü destekler. Mobil cihazlar tarayıcısı, Android ve IOS platformunda desteklenmiştir. Mac ve Windows gibi farklı platformlar için masaüstü tarayıcıları da önyükleme tarafından desteklenmektedir.

Bootstrap Dosya yapısı

  • Bootstrap önceden derlenmiştir, önyükleme işleminin derlenmiş sürümü indirilir ve Zip dosyasını çıkartın ve aşağıdaki dosya yapısını göreceksiniz:

Yukarıdaki şekil, fontlar klasör dosyalarını da içerir; geliştirici, kullanıcı arabirimini gereksinimlere göre yapmak için ekstra fontlara ihtiyaç duyarsa, önyükleme kaynak paketinde bulunan dosyaları içerebilir. Önyükleme kaynak kodu daha ayrıntılı bir dosya yapısına sahip olacaktır.

Bootstrap 4

Orada olan önemli değişiklikler Bootstrap 4’te yapılan gezinti özelleştirme seçenekleri eklendi Majorly FEC gibi CSS esnek boyut desteği, tepki aralığı ve boyutlandırma programları, küresel yazı tipi boyutu, 16px için 14px den fayda sayısını artar eklenir sınıflar eklenir, stil düğmesi, açılır menüler, medya nesneleri ve görüntü sınıfları eklenir. Ayrıca tarayıcıların en son sürümünü destekler.

Bootstrap’in ana özelliği, web sayfalarının geliştirilmesini basitleştirmektir. Önyükleme kullanmanın birincil nedeni, yansıtılacak renk, boyut, yazı tipi ve düzen seçimidir. HTML öğelerine temel stil tanımları sağlar. Jquery eklentileri ve Javascript bileşenleri, iletişim kutuları ve araç ipuçları vb. gibi kullanıcı arabirimi için kullanılabilecek bazı ek öğeler sağlar. Önyükleme bileşenleri ayrıca HTML, CSS bildirimleri ve Javascript kodu öğelerinden oluşur. Ayrıca mevcut arayüz elemanlarını genişletme özelliğine sahiptir.

Bootstrap’in diğer ana bileşeni, yerleşim bileşenleridir. Temel düzen bileşenine, sayfanın her öğesinin içine yerleştirildiği bir kap denir. Kapsayıcı web sayfasına yerleştirilir, ardından CSS düzeni gibi diğer düzen bileşenleri satırlar ve sütunlar aracılığıyla tanımlanabilir. Web sayfasını tasarlamak için hangi kap sabit genişlikte veya değişken genişlikte kapsayıcının seçileceği geliştiriciye bağlıdır . İlki önceden tanımlanmış dört genişliği kullanır, ancak daha sonra dolguları kullanır, web sayfasının görüntülendiği ekranın boyutuna bağlıdır.

Bootstrap kullanımı

Bootstrap’in kullanımı çok kolaydır ve geliştiriciler, bootstrap yardımıyla duyarlı web siteleri geliştirirdi. Bootstrap, Google Chrome, Mozilla Firefox, Internet Explorer, Safari, Opera vb. gibi birçok tarayıcıyı desteklediği için de kullanılır. Bootstrap’i başlatmak ve duyarlı bir ızgara sistemi oluşturmak kolaydır. Javascript eklentilerini bir araya getirdi ve kullanılacak şirketlerin bir listesi var. Hızlı bir şekilde başlamak ve çalışmak için iyi belgelere sahiptir. Bootstrap, duyarlı tasarım ve mobil ilk yaklaşımı göstermiştir. Açık kaynak kodludur ve ücretsizdir. Çok fazla çaba ve zaman tasarrufu sağlar. Özelleştirilebilir. Önyüklemenin önemli kullanımı, web sitesini dizüstü bilgisayar, masaüstü, cep telefonu ve tablet gibi tüm cihazlar için ekran boyutuna göre ayarlamaya yardımcı olan duyarlı bir web tasarımıdır.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak.

Başa dön tuşu

Reklam Engelleyici Algılandı

Lütfen siteye erişebilmek için reklam engelleyici kapatın.