• 27-11-2019, 18:03:34
    #10
    Bootstrap için kurs bence tamamen mantıksız. CSS ne biliyorsan Bootstrap'i de öğrenirsin. Bootstrap 4 flex yapısı üzerine bi grid sistemi. SASS ile oluşturulmuş ve SASS'ı derleyerek kendi column adetini, genişliklerini vs. belirleyebiliyorsun ama ben hiç gerek duymadım.

    https://css-tricks.com/snippets/css/a-guide-to-flexbox/
    https://fatihhayrioglu.com/yenilenmis-flex-modulu/

    https://www.youtube.com/watch?v=_s15i3MoAyE


    Önce bu yazıları izle, dene gör flex neymiş, sonra son attığım videoya bak iyice pekiştir. Sonra Bootstrap'in kendi sitesinden grid sistemine bak.

    https://getbootstrap.com/docs/4.4/layout/grid/

    Geri kalan her şey son derece basit. Components ve Utiltieslar var, ben çoğunu kullanmıyorum bile.

    -----

    Grid sistemi üzerine konuşmam gerekirse; tamamıyla sayfayı bölmek üzerine olduğunu söyleyebilirim. Atıyorum .col-lg-4 class'ını kullandığında, oluşturduğun div ile bir üst div'in içinden %33'ünü bölmüş olursun. Bu alana ister reklam alanı yok, ister yazı sana kalmış. Eğer .col-lg-4 verdiğin div'e .col-md-6 dersen 768 - 991px arasında bu element bir üst elementin yarısını kaplar.

    Eğer burada sana yazdıklarım herhangi bir şekilde kafanı karıştırdıysa hiç önemi yok Verdiğim linkteki dersleri kendin deneyerek çözeceksin.
  • 27-11-2019, 18:10:14
    #11
    Tonks adlı üyeden alıntı: mesajı görüntüle
    Bootstrap için kurs bence tamamen mantıksız. CSS ne biliyorsan Bootstrap'i de öğrenirsin. Bootstrap 4 flex yapısı üzerine bi grid sistemi. SASS ile oluşturulmuş ve SASS'ı derleyerek kendi column adetini, genişliklerini vs. belirleyebiliyorsun ama ben hiç gerek duymadım.

    https://css-tricks.com/snippets/css/a-guide-to-flexbox/
    https://fatihhayrioglu.com/yenilenmis-flex-modulu/

    https://www.youtube.com/watch?v=_s15i3MoAyE


    Önce bu yazıları izle, dene gör flex neymiş, sonra son attığım videoya bak iyice pekiştir. Sonra Bootstrap'in kendi sitesinden grid sistemine bak.

    https://getbootstrap.com/docs/4.4/layout/grid/

    Geri kalan her şey son derece basit. Components ve Utiltieslar var, ben çoğunu kullanmıyorum bile.

    -----

    Grid sistemi üzerine konuşmam gerekirse; tamamıyla sayfayı bölmek üzerine olduğunu söyleyebilirim. Atıyorum .col-lg-4 class'ını kullandığında, oluşturduğun div ile bir üst div'in içinden %33'ünü bölmüş olursun. Bu alana ister reklam alanı yok, ister yazı sana kalmış. Eğer .col-lg-4 verdiğin div'e .col-md-6 dersen 768 - 991px arasında bu element bir üst elementin yarısını kaplar.

    Eğer burada sana yazdıklarım herhangi bir şekilde kafanı karıştırdıysa hiç önemi yok Verdiğim linkteki dersleri kendin deneyerek çözeceksin.
    Hocam teşekkür ederim inceleyeceğim hemen, ben kafama takılan birkaç şeyi açayım müsadenizle;
    Şimdi ben fullstack web dev. olmaya çalışıyorum fakat şöyle bir durum var, backend'i katmıyorum orası sonraki iş.
    Flexbox'a baktım, baya baktım hatta, prototürk'ün flex kullanarak yaptığı 3 tane döküm var, onları izleyerek bende döktüm falan, yani biraz yapabiliyorum ama tam responsive olmuyor, beceremediğim kısımlar var, bunları çalışarak, tekrar tekrar pratik yaparak pekiştirmeye çalışıyorum
    Ama bootstrap'de sanki bu iş biraz daha kolay gibi, misal tabi bu kesin değil ama anladığım kadarıyla belli nav nesneleri var, bunları koyunca ekran küçülünce otomatik nav falan değişiyor, javascript falan yazmaya gerek kalmıyor gibi gördüm ben, onun dışında öteki arkadaşa yazdığım gibi popülerlik açısından da biraz önem veriyorum bootstrap'e.
    Col row olaylarını biliyorum az buz, daha önce dökümantasyonundan çalışmıştım biraz ama daha reallife problems tarzı, böyle iş gelmiş de onu dökmeye çalışıyormuşum gibi öğrenmeye çalışıyorum ki karşıma problemler çıksın onları çözeyim.
    Dediğim gibi en çok navbarlarda takılıyorum, bir de resimlerde örneğin bir resmi koyduk, o resimlerin ekran küçülünce alta kayması, otomatik scale olması yada tamamen öyle durup horizontal scrollbar açması gibi problemlerle çok karşılaşıyorum malesef :/
  • 27-11-2019, 18:20:39
    #12
    caylakgirisimci adlı üyeden alıntı: mesajı görüntüle
    Hocam teşekkür ederim inceleyeceğim hemen, ben kafama takılan birkaç şeyi açayım müsadenizle;
    Şimdi ben fullstack web dev. olmaya çalışıyorum fakat şöyle bir durum var, backend'i katmıyorum orası sonraki iş.
    Flexbox'a baktım, baya baktım hatta, prototürk'ün flex kullanarak yaptığı 3 tane döküm var, onları izleyerek bende döktüm falan, yani biraz yapabiliyorum ama tam responsive olmuyor, beceremediğim kısımlar var, bunları çalışarak, tekrar tekrar pratik yaparak pekiştirmeye çalışıyorum
    Ama bootstrap'de sanki bu iş biraz daha kolay gibi, misal tabi bu kesin değil ama anladığım kadarıyla belli nav nesneleri var, bunları koyunca ekran küçülünce otomatik nav falan değişiyor, javascript falan yazmaya gerek kalmıyor gibi gördüm ben, onun dışında öteki arkadaşa yazdığım gibi popülerlik açısından da biraz önem veriyorum bootstrap'e.
    Col row olaylarını biliyorum az buz, daha önce dökümantasyonundan çalışmıştım biraz ama daha reallife problems tarzı, böyle iş gelmiş de onu dökmeye çalışıyormuşum gibi öğrenmeye çalışıyorum ki karşıma problemler çıksın onları çözeyim.
    Dediğim gibi en çok navbarlarda takılıyorum, bir de resimlerde örneğin bir resmi koyduk, o resimlerin ekran küçülünce alta kayması, otomatik scale olması yada tamamen öyle durup horizontal scrollbar açması gibi problemlerle çok karşılaşıyorum malesef :/
    Navbarı falan unut onlar Component sen Grid sistemine bak. Responsive'i ayarlayan Grid, Navbar'ı kullanmasanda olur ben nav'ı Tab(Sekme) kullanmadıkça, kullanmıyorum. Resimleri responsive yapmak için img-fluid class'ını ekle. Bir üst divin genişliğine göre resmi boyutlandırır.
  • 27-11-2019, 18:23:42
    #13
    Tonks adlı üyeden alıntı: mesajı görüntüle
    Navbarı falan unut onlar Component sen Grid sistemine bak. Responsive'i ayarlayan Grid, Navbar'ı kullanmasanda olur ben nav'ı Tab(Sekme) kullanmadıkça, kullanmıyorum. Resimleri responsive yapmak için img-fluid class'ını ekle. Bir üst divin genişliğine göre resmi boyutlandırır.
    çok sağolun hocam,bu arada son olarak sizin tailwinds hakkında düşünceniz nedir acaba, farklarına bakıp avantajlı olanı seçmeye çalışıyorum ama bilemedim pek. ikisi de grid sonuçta sanırım, gridi öğrendikten sonra tercihe göre mi takılayım yoksa
  • 27-11-2019, 21:02:40
    #14
    caylakgirisimci adlı üyeden alıntı: mesajı görüntüle
    çok sağolun hocam,bu arada son olarak sizin tailwinds hakkında düşünceniz nedir acaba, farklarına bakıp avantajlı olanı seçmeye çalışıyorum ama bilemedim pek. ikisi de grid sonuçta sanırım, gridi öğrendikten sonra tercihe göre mi takılayım yoksa
    Tailwind'i daha gelişmiş buluyorum ama ciddi manada bi projede kullanmadım, hep test amaçlı kaldı benim için. Bootstrap'i öğrenmenin zararı olmaz, öğrentikten sonrada Tailwind'e bakabilirsin.


    https://www.youtube.com/watch?v=UBOj6rqRUME
  • 01-12-2019, 00:49:20
    #15
    Tonks adlı üyeden alıntı: mesajı görüntüle
    Navbarı falan unut onlar Component sen Grid sistemine bak. Responsive'i ayarlayan Grid, Navbar'ı kullanmasanda olur ben nav'ı Tab(Sekme) kullanmadıkça, kullanmıyorum. Resimleri responsive yapmak için img-fluid class'ını ekle. Bir üst divin genişliğine göre resmi boyutlandırır.
    Hocam rahatsız ediyorum, dropdown menüleri nasıl yapıyorsunuz? hazır bootstrap componenti mi kullanıyorsunuz? baştan mı yazıyorsunuz?
    Aynı soru düz menü için de geçerli?
  • 01-12-2019, 10:00:40
    #16
    caylakgirisimci adlı üyeden alıntı: mesajı görüntüle
    Hocam rahatsız ediyorum, dropdown menüleri nasıl yapıyorsunuz? hazır bootstrap componenti mi kullanıyorsunuz? baştan mı yazıyorsunuz?
    Aynı soru düz menü için de geçerli?
    Kendim yazıyorum :hover ile bootstrap kullanmıyorum.