Bootstrap Nedir?

Bootstrap dünyanın en yaygın olarak kullanılan web üzerinde duyarlı sayfalar yapmaya yarayan birleşendir. Css ve js kullanarak bootstrap istediğiniz yeni nesil tasarımlar oluşturmasına yardımcı olur.Bootstrap kullanarak mobil ve bilgisayarların ekran çözünülüğüne göre uyarlayabiliriz.Tek İhtiyacı jquerydir.Pekala biz bu “jquery nasıl ulaşacağız” diye bir soru gelecek aklımıza ister cdn kullanın isterseniz indirip lokalinizden çekebilirsiniz. Cdn yazımızda geçti fakat cdn bilmeyenler olabilir.Kısaca başka bir yerden sitemize yüklemek diye düşünebiliriz.Bize lazım olan jquery  linki;

jquery sürümlerinden çoğuyla uyumludur bunu kullanmanız şart değil.Mesala tasarımınızın farklı versiyonlar onla da çalışacaktır. Sadece bilmeniz gereken jquery bootstrap.min.js yada bootstrap.js dosyasından önce ve yakın bir şekilde kullanmanız yeterlidir.Jquery indirip kullanırız bize sadece dosya yolu lazım olacak bunu unutmayalım.Jquery nasıl ekleyeceklerinin bilmeyenler olabilir onuda şu şekilde yapacağız.html taglarında head tag bulup içinde herhangi bir satıra eklemeleyiz.Örnek uygulama;

Yukarıdaki kod boluğunda olduğu gibi yapacağız.Kendi sitemizden jquery çekeceksek;
Ben mesala site yaptığımı ve sitemiz ana dizinde tema klasöründen ve js klasöründen çekmek istiyorum.Siz kendinize göre aşağıdaki linki düzeltebilirsiniz.

Gelelim asıl konumuza yani

bootstrap

sitemize eklemeye önceklikle Bootstrap 4.1 versiyonu indirip rardan çıkartıyoruz.Ben siteme yük olmasın dışardan bir yerden yükleyeyim dersek yukarıdaki anlattığım cdn mevzusuyla yapalım.Bize gerekli üç şey var birisi bootstrap.css diğeri ise bootstrap.js ekstra olarak hover ve eventleri için popper.js hepsinin cdn linklerimiz;

Peki biz bunu sitemizde nereden çekeceğiz.Tabi ki yine html tagları arasındaki head tagları arasına eklenecektir.Örneğimiz;

Kod taglarındaki gördüğümüz gibi eklemeyi yapalım.Kodlardan gördüğünüz jquery kodlar arasında ve en üstte.Ben websitemden kendi hostundan çekeceğim diyorsanız işte örneğimiz;

yani

bootstrap

dosyaları indirdik rardan çıkardık.İçindekileri direk ben tema klasörünün içine ekledim.Bu benim örneğim siz kendinize göre linkleri düzenleyin.Bootstrap içinde hangi dosyalar var ona bakalım;

Bootstrap
|
–css
|
— bootstrap.min.css
|
–js
|
— bootstrap.min.js

Bize lazım bunlar diğerleri zaten klasörün içindeki çekecektir.Neden .min var diyorsunuz minumum ingilizce kısaca küçültülmüş tek bir satır yapılarak yüklenmesini hızladırmaktır.Artık geliştirmeye arayüzler yada ön görünüş tasarımına hazırız.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Free Web Hosting