• Buradasın

    Bootstrap

    Özetteki ilgi çekici içerikler

    • Bootstrap ile Form Kontrolleri Oluşturma Eğitimi

      Bu video, bir eğitim içeriği olup, izleyicilere Bootstrap kullanarak form kontrolleri oluşturma sürecini adım adım göstermektedir. Video, Bootstrap'in select class form kontrolü kullanarak son kullanma tarihi ve yılı için seçenekler oluşturma konusunu ele almaktadır. Eğitmen, form grubu oluşturma, label ekleme, div sınıfları kullanma ve optionlar eklemek için gerekli kodları göstermektedir. Ayrıca, kodlama sırasında karşılaşılan bir hata ve çözümü de paylaşılmaktadır. Video, form kontrollerinin nasıl oluşturulacağını ve Bootstrap ile form tasarımı yapmak isteyenler için faydalı bir kaynak niteliğindedir.

      • youtube.com

    • Bootstrap ile Mobil Uyumlu Olmayan Web Sitesi Tasarımı Eğitimi

      Bu video, bir eğitmen tarafından sunulan web geliştirme eğitim içeriğidir. Eğitmen, Bootstrap kullanarak mobil uyumlu olmayan bir web sitesinin tasarımını adım adım göstermektedir. Videoda, web sitesinin alt kısmının tasarımı anlatılmaktadır. İlk olarak konteyner ve row-col yapısı oluşturulup, Font Awesome'dan ikonlar kullanılarak bir paragraf ve buton eklenmektedir. Ardından "Hizmetlerimiz" bölümünün nasıl oluşturulacağı gösterilmekte, her bir hizmet için resim ve metin ekleme, yazı formatlama ve boşluk ayarları yapılmaktadır. Eğitim, flexbox yapısı kullanarak öğeleri yan yana düzenleme, class'lar vererek tasarım biçimlendirme ve padding, margin gibi CSS özellikleri uygulama gibi teknik detayları içermektedir. Video sonunda, bir sonraki derste "Hakkımızda" bölümünün yapılacağı belirtilmektedir.

      • youtube.com

    • Photoshop'ta Bootstrap Uyumlu Site Arayüzü Tasarımı

      Bu video, bir eğitim dersi formatında olup, izleyicilere Photoshop'ta Bootstrap uyumlu bir site arayüzü tasarımı öğretmektedir. Videoda öncelikle Bootstrap'in ne olduğu ve özellikleri anlatılmaktadır. Bootstrap, cep telefonları, mobil cihazlar, tabletler ve masaüstü bilgisayarlarda farklı görünüm elde etmek için kullanılan bir hazır kütüphanedir. Daha sonra Photoshop'ta Bootstrap uyumlu bir tasarım yapmak için gerekli adımlar gösterilmektedir. Öncelikle yeni bir çalışma alanı oluşturulur, ardından 12 sütunlu grid sistemi için kılavuz mizampajı ayarlanır ve içerik alanı için 1170 piksel genişlik ve 2000 piksel yükseklik değerleri belirlenir.

      • youtube.com

    • Bootstrap'te Figür Kullanımı Eğitimi

      Bu video, bir eğitim içeriği olup, konuşmacı Bootstrap'te figür kullanımını anlatmaktadır. Video, Bootstrap'te figür konusunun nasıl kullanılacağını adım adım göstermektedir. Konuşmacı, figür ve fig caption HTML5 elementlerinin Bootstrap ile nasıl oluşturulacağını, responsive tasarım için img fluid ve thumbnail sınıflarının kullanılmasını, fig caption'ın sağ tarafta görünmesini sağlayan text-end class'ını ve resmin köşelerini yuvarlayan rounded class'ını örneklerle açıklamaktadır. Video, content konusunun son bölümü olup, bir sonraki videoda formlar ve komponentler konusuna geçileceği belirtilmektedir.

      • youtube.com

    • Bootstrap RFS (Responsive Font Size) Eğitimi

      Bu video, bir eğitim içeriği olup, konuşmacı Bootstrap'in RFS (Responsive Font Size) özelliğini anlatmaktadır. Video, RFS'in ne olduğunu ve nasıl kullanıldığını açıklamaktadır. RFS, Bootstrap'in 5. versiyonuyla entegre edilmiş bir eklenti olarak, farklı tarayıcı boyutlarında yazı boyutlarını otomatik olarak ayarlayarak daha düzgün bir içerik sunmayı sağlar. Konuşmacı, RFS'in nasıl çalıştığını göstermek için bir örnek sunarak, yazı boyutlarının ekran boyutuna göre nasıl değiştiğini göstermektedir. Ayrıca, RFS'in özelleştirilebilir olduğunu ve SAS dosyasında customize bölümünde bu özelleştirmelerin yapılabileceğini belirtmektedir.

      • youtube.com

    • Bootstrap Diyalog Kutusu (Model) Eğitimi

      Bu video, bir eğitim içeriği olup, anlatıcı Bootstrap'in diyalog kutusu (model) yapısını adım adım göstermektedir. Video, Bootstrap'in diyalog kutusunun ne olduğunu açıklayarak başlıyor ve ardından bir örnek üzerinden kod yazımı gösteriliyor. Anlatıcı, Bootstrap projesi oluşturma, diyalog kutusu oluşturma, buton ile diyalog kutusunu ilişkilendirme, diyalog kutusunun görünümünü değiştirme (yavaş açılma, kapatma butonları, sayfanın ortasına hizalama, boyutlandırma) gibi konuları kod örnekleriyle açıklıyor. Video, web sitelerinde kullanıcıya mesaj vermek için kullanılan diyalog kutusunun temel kullanımını öğrenmek isteyenler için faydalı bir kaynaktır.

      • youtube.com

    • Bootstrap Kurulum ve Kullanım Eğitimi

      Bu video, bir eğitmen tarafından sunulan Bootstrap kurulumu ve kullanımı hakkında bir eğitim içeriğidir. Eğitmen, Bootstrap'ın nasıl indirileceğini ve projeye nasıl entegre edileceğini adım adım göstermektedir. Video, Bootstrap'ın indirme ve kurulum sürecini detaylı olarak anlatmaktadır. Eğitmen önce Bootstrap'ı indirme, dosyaları dışarı çıkarma ve projeye ekleme adımlarını göstermekte, ardından HTML dosyası oluşturma ve Bootstrap kodlarını entegre etme sürecini açıklamaktadır. Ayrıca, Bootstrap'ın temel sınıflarını (container, row, column) ve renk kodlarını (info, success) kullanarak basit bir web sayfası oluşturma örneği sunulmaktadır. Video, Bootstrap'ın default ayarları ve boşluk değerleri hakkında da bilgi vermektedir.

      • youtube.com

    • Bootstrap Form Tasarımı ve JavaScript Kullanımı Eğitimi

      Bu video, bir eğitmen tarafından sunulan yazılım eğitim serisinin on birinci bölümüdür. Eğitmen, form tasarımı ve JavaScript kullanımını adım adım göstermektedir. Video, formun CSS özelliklerinin geliştirilmesi ile başlayıp, JavaScript ile formun boş alanlarının kontrolü ve gönder butonunun disable edilmesi ile devam etmektedir. Daha sonra React ve Vue.js teknolojileri kullanılarak form gönderme işleminin nasıl yapılacağı, Axios kütüphanesi ile veri gönderimi ve form başarılı olduğunda kullanıcıya bildirim verme işlemleri anlatılmaktadır. Eğitim, formun gönderildiğinde router push ile listeye yönlendirme yaparak kullanıcıya bildirim gönderme işlemini uygulamalı olarak göstermektedir. Video, bir serinin parçası olup, bir sonraki videoda listeye basıldığında işin biteceği belirtilmektedir.

      • youtube.com

    • ASP.NET ve Bootstrap ile Dinamik Web Sitesi Oluşturma Eğitimi

      Bu video, bir eğitmen tarafından sunulan web geliştirme eğitimidir. Eğitmen, izleyicilere ASP.NET ve Bootstrap kullanarak dinamik bir web sitesi nasıl oluşturulacağını adım adım göstermektedir. Video, Visual Studio 2015 kullanarak boş bir web projesi oluşturma ile başlayıp, Bootstrap ve jQuery kütüphanelerinin projeye eklenmesi, master page oluşturma, menü ve footer tasarımı, jumbotron eklemesi ve kart görünümü oluşturma gibi konuları kapsamaktadır. Ayrıca Bootstrap'un 12 birimlik grid sistemini kullanarak sayfayı düzenleme, responsive tasarım ve stil verme teknikleri de detaylı olarak anlatılmaktadır. Eğitim, temel web geliştirme tekniklerini öğrenmek isteyenler için hazırlanmış olup, ilerleyen aşamalarda veritabanı oluşturma, verileri çekme ve admin paneli yapımı gibi konuların da işleneceği belirtilmektedir.

      • youtube.com

    • ASP.NET MVC Veritabanı İşlemleri ve Bootstrap Kullanımı Eğitimi

      Bu video, bir eğitim içeriği olup, izleyicilere ASP.NET MVC framework'ünde veritabanı işlemleri ve Bootstrap kullanımı konusunda adım adım rehberlik etmektedir. Video, veritabanı üzerinde insert, update, delete gibi temel işlemlerin nasıl yapılacağını göstererek başlıyor. Ardından, veritabanından çekilen verilerin ASP.NET MVC sayfasına nasıl gönderileceği, view models kullanarak veri aktarımı ve Bootstrap ile sayfanın nasıl tasarlanacağı anlatılıyor. Eğitmen, Bootstrap'in temel bileşenlerini (div, row, column, list-group, list-group-item) kullanarak sayfayı ikiye ayırarak kişiler ve adresler listelerini nasıl düzenleyeceğini gösteriyor.

      • youtube.com

    • Sublime Text ile Bootstrap Eklentisi Kurulum Rehberi

      Bu video, Anar adlı bir eğitimcinin Sublime Text ile Bootstrap eklentisinin nasıl kurulacağını gösterdiği bir eğitim içeriğidir. Videoda, Bootstrap kullanırken tüm sınıfları ezberlemeden kolayca kullanabilmenizi sağlayan bir eklentinin kurulumu adım adım anlatılmaktadır. Önce eklentinin GitHub'dan indirilmesi, sıkıştırılmış dosyanın açılması, Sublime Text'e paket kontrolü kurulumu ve eklentinin yüklenmesi gösterilmektedir. Son olarak, eklentinin nasıl kullanılacağı örneklerle açıklanmaktadır.

      • youtube.com

    • Web Geliştirme Eğitim Seti: Sublime Text ve HTML Kodlama

      Bu video, bir eğitmen tarafından sunulan web geliştirme eğitim setinin bir bölümüdür. Eğitmen, web geliştirme sürecinde kullanılabilecek araçları ve temel kodlama tekniklerini anlatmaktadır. Video, iki ana bölümden oluşmaktadır: İlk bölümde Sublime Text programının kurulumu, Emmett eklentisinin ekleme ve bir web sayfası için gerekli dosya yapısı (index.html, CSS dosyaları, font dosyaları, Bootstrap, JavaScript ve jQuery) detaylı olarak gösterilmektedir. İkinci bölümde ise HTML kodlamada merdiven yapısı oluşturma, div, li gibi etiketlerin kullanımı, id ve class özelliklerinin ekleme, menü oluşturma ve yorum satırı oluşturma teknikleri adım adım anlatılmaktadır. Eğitim içeriğinde ayrıca Google Fonts'tan font çekme süreci, mobil tabanlı Bootstrap desteği ve kod yazarken zaman kazandıracak kısayollar gibi pratik ipuçları da paylaşılmaktadır.

      • youtube.com

    • Bootstrap Kullanarak Navigasyon Menüsü Oluşturma Eğitimi

      Bu video, bir eğitim içeriği olup, konuşmacı Bootstrap kullanarak web sayfalarında navigasyon menüsü oluşturma konusunu anlatmaktadır. Video, Bootstrap'in temel kullanımını göstererek başlıyor ve özellikle navigasyon menüsünün nasıl oluşturulacağını adım adım açıklıyor. Konuşmacı, menü yapısının HTML ve CSS kodlarını detaylı şekilde inceleyerek, butonun nasıl çalıştığını, menü elemanlarının nasıl oluşturulduğunu ve CSS sınıflarının nasıl kullanıldığını gösteriyor. Ayrıca, menü sabitleme (navbar-fixed) ve menü ters çevirme (navbar-inverse) gibi özelliklerin nasıl kullanılacağını da anlatıyor. Video, programcıların kodları kopyalayıp yapıştırmak yerine, Bootstrap'in nasıl çalıştığını anlamalarının önemini vurguluyor.

      • youtube.com

    • ASP.NET MVC ile Haber Portalı Geliştirme Eğitimi

      Bu video, bir eğitmen ve Engin adlı bir öğrenci tarafından sunulan ASP.NET MVC programlama eğitimidir. Eğitmen, izleyicilere adım adım bir haber portalı uygulaması geliştirme sürecini göstermektedir. Video, veritabanından kategori verilerini combobox'a doldurma ile başlayıp, Bootstrap kullanarak web sayfası tasarımını, performans optimizasyonu, kategoriye göre haber listeleme, view model kullanımı, haber detay sayfası oluşturma ve yorum gösterme gibi konuları kapsamaktadır. Eğitim, bir web uygulamasında kategori seçimi yaparak haberleri listeleme ve detay sayfasına yönlendirme işlevselliğine sahip bir sayfanın oluşturulması sürecini adım adım göstermektedir. Eğitimde ayrıca veritabanı işlemleri, LINQ sorguları, controller metodları, view modelleri ve Bootstrap kütüphanesi kullanımı gibi teknik konular detaylı olarak ele alınmaktadır. Video, web geliştirme eğitimleri için temel bir kaynak niteliğindedir ve özellikle ASP.NET MVC framework'ünde pratik uygulamaları öğrenmek isteyenler için faydalı olacaktır.

      • youtube.com

    • Angular CLI'ye Bootstrap Kurulum Eğitimi

      Bu video, bir eğitim içeriği olup, izleyicilere Angular CLI'ye Bootstrap entegrasyonunu adım adım göstermektedir. Video, Angular CLI'ye Bootstrap kurulumunun nasıl yapılacağını detaylı şekilde anlatmaktadır. Önce npm ile Bootstrap'in kurulumu, ardından Angular CLI.json dosyasına script ve style dosyalarının eklenmesi, Angular CLI sitesinden gerekli modüllerin yüklenmesi ve son olarak Bootstrap bileşenlerinin (örneğin buton) projeye nasıl entegre edileceği gösterilmektedir. Video, bir sonraki derste Bootstrap araçlarının daha detaylı kullanılacağını belirterek sonlanmaktadır.

      • youtube.com

    • Bootstrap ile Responsive Web Tasarımı Eğitimi

      Bu video, bir eğitmen tarafından sunulan web geliştirme eğitim içeriğidir. Eğitmen, Bootstrap framework'ünü kullanarak web sayfasının responsive tasarımını adım adım göstermektedir. Videoda, önceki derste yapılan ana bölümün responsive tasarımının devamı olarak services, portfolyo ve section bölümlerinin tasarımı ele alınmaktadır. Eğitmen, farklı ekran genişliklerinde (MD, SM) sütunların düzenlenmesi, CSS kodları ile font boyutu ve renk değişiklikleri, görsellerin çözünürlük sorunlarının çözümü gibi konuları detaylı olarak anlatmaktadır. Ayrıca padding ve margin kavramları arasındaki farklar örneklerle açıklanmakta ve bir sonraki derste ebatas bölümü ile ilgili tasarım sorunlarının çözüleceği belirtilmektedir. Video, web sayfası tasarımında responsive özellikler eklemek isteyenler için faydalı bilgiler içermektedir.

      • youtube.com

    • Bootstrap Sup Dersleri: Responsive Tasarım

      Bu video, bir eğitmen tarafından sunulan Bootstrap Sup derslerinin bir parçası olup, web tasarımında responsive tasarım konusunu ele alan bir eğitim içeriğidir. Videoda, Bootstrap'ın hazır responsive özellikleri gösterilmekte ve Windows Resize Chrome uzantısı kullanılarak farklı ekran boyutlarında sayfanın nasıl göründüğünü test edilmektedir. Eğitmen, özellikle 992 piksel genişliğindeki ekranlarda footer bölümünde yaşanan sorunları çözmek için CSS kodları eklemekte ve footer kısmındaki ikonların boyutlarını, font boyutlarını ve padding değerlerini değiştirerek responsive tasarım yapmaktadır. Video, Bootstrap dökümantasyonundan media query'ler hakkında bilgi vererek, ekstra küçük, küçük, orta ve büyük ekran boyutlarına karşılık gelen media query değerlerini açıklamaktadır. Bir sonraki derste küçük ve orta boyutlu cihazlar için media queryler üzerine devam edileceği belirtilmektedir.

      • youtube.com

    • Bootstrap Popover Kullanımı Eğitimi

      Bu video, bir eğitmen tarafından sunulan web geliştirme eğitim içeriğidir. Video, Bootstrap'in popover özelliğinin nasıl kullanılacağını adım adım göstermektedir. İlk bölümde popover'ın temel kullanımı, title ve content bilgilerinin tanımlanması, trigger özellikleri ve HTML içeriğinin eklenmesi anlatılırken, ikinci bölümde sayfada bulunan tüm data toggle'lara popover özelliği kazandırma, data placement ayarları ve JavaScript ile popover elementlerini listeleme işlemleri gösterilmektedir. Eğitim boyunca kod yazımı, konsolda sonuçların incelenmesi ve pratik örnekler üzerinden Bootstrap popover'ın farklı kullanım şekilleri detaylı olarak açıklanmaktadır. Ayrıca, popover'ın göstermeden önce, gösterdikten sonra, gizlenmeden önce ve gizlendikten sonra çalışacak olayların nasıl tanımlanacağı da gösterilmektedir.

      • youtube.com

    • Bootstrap ile Web Sayfası Tasarımı Eğitimi

      Bu video, bir eğitmen tarafından sunulan kapsamlı bir web geliştirme eğitim içeriğidir. Eğitmen, Bootstrap kütüphanesi kullanarak web sayfası tasarımı konusunda adım adım rehberlik etmektedir. Video, Bootstrap ile slider oluşturma ile başlayıp, div boyutlandırma, modal pencere oluşturma, kart (card) yapısı ve form tasarımı konularını kapsamaktadır. Eğitmen, her bir konuyu HTML kodları üzerinden pratik örneklerle anlatmakta ve Bootstrap'in temel bileşenlerini detaylı şekilde açıklamaktadır. Eğitim boyunca, Bootstrap'ın karosel (carousel) özelliği, modal penceresi kullanımı, kart yapısı ve form elemanları (label, form grupları, açılır liste, onay kutusu) gibi temel bileşenlerin nasıl kullanılacağı gösterilmektedir. Ayrıca, formun ekran boyutuna göre responsive olması için col-md gibi sınıfların kullanımı da anlatılmaktadır.

      • youtube.com

    • Bootstrap'ta Image Overlay Kullanımı Eğitimi

      Bu video, bir eğitim içeriği olup, izleyicilere Bootstrap framework'ünde image overlay özelliğinin nasıl kullanılacağını adım adım göstermektedir. Videoda, image overlay özelliğinin temel kullanımı anlatılmaktadır. Eğitmen, div etiketleri oluşturma, class tanımlamaları yapma, başlık ve alt başlık ekleme, metin yazma ve görsel ekleme gibi adımları göstermektedir. Ayrıca, görsel yerine farklı bir arka plan kullanmanın da nasıl yapılacağı açıklanmaktadır. Video, bir sonraki derste kartların renklendirmelerinin öğretileceği bilgisiyle sonlanmaktadır.

      • youtube.com
  • Yazeka sinir ağı makaleleri veya videoları özetliyor