Bootstrap Sevenler için 20+ Harika Kaynak
Bootstrap sadece web geliştirme topluluğunda patladı. Her zaman şüpheci ve nefret olacak ama genel olarak, proje çok başarılı oldu ve GitHub'daki Forked ve Watched listelerinin üstünde sürekli olarak görülebilir.
Bootstrap'ın şöhretinin bir sonucu olarak, geliştirme topluluğu tarafından ilgili birçok büyük kaynak ortaya konmuştur. Bugün favorilerimizi Bootstrap'a başlamak için ihtiyacınız olan her şeyin bir listesi halinde topladık. Tanıtım derslerinden tel çerçeve kitlerine ve özel jeneratörlere kadar her Bootstrap sevgilisi için bir şey var.
Bootstrap Şablonlarını Keşfedin
Bootstrap'ı başlat
Start Bootstrap, tüm tema türleri, kılavuzlar ve Bootstrap ile oluşturulmuş önceden tasarlanmış ücretsiz ve premium HTML şablonları için hepsi bir arada bir platformdur.
Site, açılış sayfaları, kişisel özgeçmiş web siteleri, portföyler ve çok daha fazlasını yapmak için önceden oluşturulmuş ücretsiz şablonlar içerir. Web tasarım projelerinize hızlı bir şekilde başlamak için indirebileceğiniz birçok hızlı Bootstrap şablon düzeni de vardır.
Buna ek olarak, Start Bootstrap, eklentiler, görsel oluşturucular, çerçeve entegrasyonları ve daha fazlası gibi Bootstrap ile ilgili tüm kaynaklara bağlantılar içeren büyük bir Bootstrap kaynakları listesine sahiptir.
CodyHouse
CodyHouse, HTML, CSS ve JavaScript eklentilerinden oluşan ücretsiz web bileşenleriyle dolu bir kütüphanedir. Kütüphane, güzel tasarlanmış mega menüler, portföy şablonları, ödeme entegrasyonları, animasyon efektleri, video şablonları ve diğer eklentileri içerir.
Çeşitli eklentileri ve özellikleri ücretsiz olarak kendi Bootstrap web sitesi tasarımlarınıza kolayca entegre etmek için bu eklentileri ve şablonları indirebilirsiniz.
Bootsnipp
Bu, HTML ve CSS kaynakları ve eklentilerinin büyük bir koleksiyonunu sunan başka bir platformdur. Bootsnipp'in özelliği, bu platformun diğer web geliştiricileri ve tasarımcıları tarafından oluşturulan kod parçacıkları ve eklentileri içermesidir.
Bootsnipp, form şablonları, düğme tasarımları, ilerleme çubukları, galeri şablonları ve daha fazlası dahil olmak üzere web geliştirme sürecinizi daha kolay hale getirmenize yardımcı olacak her türlü kod snippet'i ve şablonu içerir.
Platforma kayıtlı bir kullanıcı olarak katılabilir ve kendi Bootstrap kaynakları koleksiyonunuzu oluşturabilirsiniz. Bootsnipp ayrıca Foundation ve Semantic UI gibi diğer HTML çerçeveleri için kaynaklar içerir.
Codrops
Codrops, HTML ve CSS ile benzersiz şablonlar ve öğeler oluşturma konusunda öğreticileri ve planları paylaşan bir blogdur. Bu blogun en güzel yanı, şablonları ve eklentileri ücretsiz indirmenize izin vermenin yanı sıra, her bir şablonun nasıl oluşturulduğunu ve bunları tercihinize göre nasıl özelleştirebileceğinizi ayrıntılı olarak açıklayacağıdır.
Codrops, modaya uygun portföy bölümleri, slayt gösterileri, video arka planları, animasyonlar ve çok daha fazlasını oluşturmak için Bootstrap ile entegre edebileceğiniz kaynakları, planları, şablonları ve eklentileri içerir.
Kırıklar
Shards çarpıcı ve mobil ilk web siteleri tasarlamak için Bootstrap 4 ile inşa edilmiş modern ve minimalist bir UI kiti.
Bu UI kitini kullanırken, düğmeler ve menüler gibi Bootstrap öğelerinin herhangi birine stil uygulamak için kod yazmanız gerekmez. UI kiti sizin için her şeyi halleder.
Bootswatch
Bu site, birkaç farklı renk şeması ve tasarımında Bootstrap çerçevesi için özel temalar koleksiyonuna sahiptir.
Liste, uzay temalı bir Bootstrap teması, bir malzeme tasarım teması, düz tasarım teması, koyu renk temaları ve daha fazlasını içerir. Kodu düzenlemek zorunda kalmadan Bootstrap tasarımlarınızın görünümünü ve hissini özelleştirmek için bu temaları indirebilir ve kullanabilirsiniz.
Fontello
Fontello, Font Awesome, Typicons, Brandico ve daha fazlası dahil olmak üzere birçok popüler font simgesi paketinden büyük bir ikon koleksiyonuna göz atmanızı sağlayan şık bir simge font üreticisidir.
Simge yazı tipleri günümüzde hemen hemen her web sitesi tasarımında yaygın olarak kullanılmaktadır. Aramanızla ilgili bir simgeye sahip bir yazı tipi paketini hızlı bir şekilde bulmak, simge boyutunu ayarlamak ve Bootstrap tasarımlarınızda kullanılacak simge yazı tipini indirmek için Fontello'daki arama işlevini kullanabilirsiniz.
Yakıt UX
Fuel UX, gelişmiş web tasarımcıları tarafından daha karmaşık ve hafif JavaScript geliştirmeleriyle Bootstrap çerçevesini süper şarj etmek için kullanılır. Genişletilmiş işlevsellik ile Bootstrap'i geliştirir ve çerçeve özelleştirmesi üzerinde daha fazla kontrol sağlar. Fuel UX, Salesforce Marketing Cloud'un da bir parçasıdır.
Typehead.js
Web sitenizin arama kutusuna harika bir Google benzeri otomatik tamamlama özelliği eklemek ister misiniz? Daha sonra bu hafif JavaScript kitaplığını indirebilir ve arama kutunuzu otomatik tamamlanan arama ifadeleri, otomatik öneriler ve daha fazlası ile kolayca yükseltmek için Bootstrap web sitenize entegre edebilirsiniz.
Blueimp Galerisi
Blueimp, web sitenizde kullanabileceğiniz duyarlı ve dokunmatik özellikli galeri şablonlarının bir koleksiyonudur.
Eklenti, en doğru dokunmatik kaydırıcı olarak adlandırılan Swipe JavaScript kitaplığına dayanarak yapılır. Blueimp, görüntü karuseli, video karuseli ve bir ışık kutusu görüntü galerisi de dahil olmak üzere üç farklı galeri modeli arasından seçim yapmanızı sağlayarak Kaydırma işlevini genişletir.
Bootstrap Fuarı
Bu, Bootstrap ile inşa edilmiş muhteşem web sitelerinin bir koleksiyonunu içeren bir sitedir. Koleksiyon küratörlüğünü Bootstrap'ın kurucusu ve Github'da tasarım direktörü Mark Otto üstleniyor. Bir sonraki projeniz için ilham bulmak ve Bootstrap ile ne tür inanılmaz şeyler yapabileceğinizi görmek için harika bir yer.
StyleBootstrap
Bu araç, Bootstrap'in çeşitli yönlerini özelleştirmek için basit bir arayüz kullanmanızı sağlar. Buradaki fark, bunun öncelikle görsel, tasarım yönlerine odaklanmasıdır. Kolayca içeri girebilir ve renkleri, yazı tiplerini, kenarlıkları ve çok daha fazlasını değiştirebilirsiniz.
Uygulamanın kendisi de Twitter'ın üreticisinden daha görsel ve indirme düğmesine basmadan önce stillerinizin nasıl görüneceğini görmenizi sağlıyor.
Bootstrap için güzel düğmeler
Bu sadece bir şey yapan basit bir küçük araçtır: Twitter Bootstrap ile kullanmak için harika görünümlü düğmeler tasarlamanıza yardımcı olur. Sadece dört kaydırıcıdan ve ortaya çıkan CSS'yi kopyalamak için bir kutudan oluşur, daha az değil, daha fazla değil. Bootstrap'i kullanma şeklinizde devrim yapmaz, ancak oynamak eğlencelidir.
WrapBootstrap
“WrapBootstrap, üstün Bootstrap temaları ve şablonları için bir pazardır. Tek bir kaya gibi sağlam temel kullanarak müşterilerinizi ve ziyaretçilerinizi etkileyin. ”
WrapBootstrap'ı Bootstrap için ThemeForest olarak düşünün. Özel stilli Bootstrap temaları satın alabilir veya satabilirsiniz. Bootstrap gibi ücretsiz bir kaynak için premium bir temaya para harcamanın aptalca olduğunu düşünüyorsanız, WordPress tema pazarının başarısına bir göz atın. Varsayılan olarak, Bootstrap sitelerinin hepsi aynı görünmeye başlar ve güzel tasarlanmış temalar gerçekten güzel bir varyasyon eklerken Bootstrap'ın sunduğu büyük avantajlara sahip olmanızı sağlar.
Bootstrap ile üretilmiştir
Bootstrap ile oluşturulmuş, adından da anlaşılacağı gibi Bootstrap kullanılarak oluşturulmuş çeşitli web sitelerini gösteren resmi olmayan bir Tumblr blogudur. Bu, Bootstrap ile çalışan tasarımcılar için harika bir kaynaktır, çünkü gerçek geliştiricilerin çerçeve ile ne yaptığını görmenize izin verir, bu da onu daha ileriye götürmenize ilham verecektir.
Bootstrap'ın sade görünümlü tasarımdan başka bir şeye yol açamayacağını düşünüyorsanız, bu galeri size yanlış olduğunu kanıtlayacaktır. Provo Restaurant gibi siteler, Bootstrap örnek sayfalarının bir kopyası gibi görünmemek beni gerçekten şaşırttı.
Ücretsiz Twitter Bootstrap Widget Kütüphanesi
Axure, karmaşık tel kafesler ve etkileşimli maketler oluşturmanızı sağlayan güçlü, profesyonel düzeyde bir uygulamadır. Lisans başına 589 $ 'dan, sadece ciddi tel kafesler için bir çözümdür.
Twitter Bootstrap ve Axure ile çalışmak isterseniz, Axure'da sorunsuz çalışan Bootstrap öğelerinin mükemmel özelleştirilebilir temsillerini içeren bu harika ücretsiz widget kütüphanesini indirdiğinizden emin olun.
Bootstrap PSD
Birçoğunuzun ne düşündüğünü biliyorum, “Havai fişekler? Axure? OmniGraffle? Bana bir PSD ver! ” Şansınız var, çünkü Repix Design, tüm Bootstrap'in çeşitli bileşenlerini içeren ayrıntılı, özelleştirilebilir bir PSD oluşturmak ve dağıtmak için zaman ayırdı.
Photoshop'taki tel kafesinizi yapmak istiyorsanız ve bir Bootstrapper iseniz, bu ücretsiz indirme bir beyinsizdir. Git şimdi yakala.
Harika Yazı Tipi
Font Awesome muhtemelen benim favori Twitter Bootstrap kaynağım. Temelde sadece bir simge yazı tipi, bu yüzden herkes herhangi bir proje için kullanabilir. Ancak, Bootstrap'in görsel estetiğini tamamlamak için özel olarak tasarlanmıştır.
Font Awesome ticari kullanım için ücretsiz, ekran okuyucu ile uyumludur ve 150 ikon (büyümeye devam eden bir sayı) içerir. Bunu işaretleyin çünkü seveceksiniz.
Sass Twitter Önyükleme
Twitter kullanıcıları Bootstrap'ı inşa ettiğinde, değişkenlerin, karışımların ve çok daha fazlasının büyüsünü CSS'ye getiren popüler bir CSS ön işlemcisi olan LESS ile daha da iyi hale getirmeye karar verdiler.
Mesele şu ki, önişlemci fan tabanında büyük bir bölünme var. Bazı insanlar DAHA AZ seviyor çünkü kullanımı basit ve inanılmaz derecede kolay, ancak birçoğu daha güçlü bir alternatifi tercih ediyor: Sass. LESS rotasını izlediği için Twitter geliştiricileri suçlayamayız, ancak Sass hayranlarının da biraz sevgiye ihtiyacı var! Neyse ki, John W. Long Bootstrap'ı Sass'a taşıdı, böylece önişlemci tartışmasının her iki tarafı da en azından bir şey üzerinde anlaşabilir: Bootstrap kayalar.
Stylus hayranlarının sık sık söz edemedikleri gerçeğine yas tutmaları gerekmez, ayrıca bir Bootstrap Stylus portu da vardır.
Bootstrap için Colorpicker ve Datepicker
İşte Bootstrap'a ekleyebileceğiniz birkaç ek öğe. Her ikisi de ücretsiz, iyi belgelenmiş ve Bootstrap estetiğine tam olarak uyuyor.
Bootstrap'ı Nasıl Tamamlarsınız?
Harika Bootstrap kaynakları listemizi gördüğünüze göre, sizden haber almak istiyoruz. Bu sürece hangi üçüncü taraf kaynaklarını dahil ettiğinizi bize bildirmek için bize bir tweet atın.
