Top CSS Frameworks to check out in 2021

แชร์
ฝัง
  • เผยแพร่เมื่อ 18 ธ.ค. 2024

ความคิดเห็น • 160

  • @SeventeenXBL
    @SeventeenXBL 3 ปีที่แล้ว +53

    As a beginner I've only been exposed to Bootstrap, but after watching this video I think I'll give Bulma a go! Looks really nice and simple :)

    • @MattVibes
      @MattVibes 3 ปีที่แล้ว

      IKR! It looks amazing

    • @vraj2003
      @vraj2003 2 ปีที่แล้ว

      Hey how was your experience? I'm thinking about going for material UI. Is bulma better?

    • @leonardovioliorrantia8286
      @leonardovioliorrantia8286 2 ปีที่แล้ว

      nooooup, foundation bro ♫

    • @parthagrawal9292
      @parthagrawal9292 ปีที่แล้ว

      How was it?
      Can you share your experience

  • @francescociulla
    @francescociulla 3 ปีที่แล้ว +11

    The quality of these videos impresses me every single time!

  • @OneBrighDay
    @OneBrighDay 3 ปีที่แล้ว +16

    I really like material ui specifically because how well it works with styled components.I don’t like any of these frameworks in regards to how they handle layouts I would just rather use grid or flexbox so because MU allows SC to extend existing components its great. Plus you get the sass functionality built in. Just a win win.

    • @AdrianTwarog
      @AdrianTwarog  3 ปีที่แล้ว +2

      Good points!

    • @4veragejoe94
      @4veragejoe94 3 ปีที่แล้ว

      @@AdrianTwarog have you take a look at trongate css? Its on prelaunch atm
      th-cam.com/video/AOkOD5w6L5M/w-d-xo.html

  • @sairaj5660
    @sairaj5660 3 ปีที่แล้ว +28

    I never went to any other CSS framework after learning TailwindCSS
    Tailwind Rocks 💥

    • @tameramer1465
      @tameramer1465 3 ปีที่แล้ว +1

      Has it components like bootstrap or we should make them?

    • @sairaj5660
      @sairaj5660 3 ปีที่แล้ว +4

      @@tameramer1465 we should make them but only with classes it's really awesome if tou want to build something serious and don't want it to look like like any css framework

    • @iqbal5942
      @iqbal5942 3 ปีที่แล้ว

      With react tailwind or material ui ? Which one is best choice

    • @sairaj5660
      @sairaj5660 3 ปีที่แล้ว +3

      @@iqbal5942 depends upon your requirement and patience, tailwind does not have inbuilt components like models , snackbars, like in material UI, but tailwind makes it easy to build responsive sites with full customization, I worked with both of them, but tailwind is a my favourite

    • @Omar_Al_Seddik
      @Omar_Al_Seddik 3 ปีที่แล้ว +6

      @@iqbal5942 Material-UI is the most popular React tailored framework that exists. Check npm trends. It's more popular than both React-Bootstrap and TailwindCSS combined.
      And that's for good reasons. It's React-based, very lightweight, and super customizable. I'm convinced that the people that don't like it haven't actually mastered it.
      If you're using React, Material-UI kinda has no competition at this point.

  • @didziszvaigzne7679
    @didziszvaigzne7679 3 ปีที่แล้ว +14

    Tailwindcss is my absolute favorite one!

    • @wrongname3636
      @wrongname3636 3 ปีที่แล้ว +2

      tailwind sucksssss

    • @AdrianTwarog
      @AdrianTwarog  3 ปีที่แล้ว +1

      :D awesome!

    • @Quabbe2
      @Quabbe2 3 ปีที่แล้ว +1

      This is the way

  • @daremondlars
    @daremondlars 2 ปีที่แล้ว +11

    In my opnion, just Tailwind, Bootstrap and Bulma bring some innovations in terms of conception. Tailwind = semantic, Bootstrap = functionality and Bulma = simplicity. Material vame to unify design in Android and Google Products, so deserve some merith

    • @dontaskiwasbored2008
      @dontaskiwasbored2008 ปีที่แล้ว +1

      Tailwind is basically the literal opposite of semantic.

  • @dezinhtang
    @dezinhtang 3 ปีที่แล้ว +6

    Tailwind is in my no.1 list because you are keep recalling CSS declaration in your mind at the same time>>

    • @_CazaBobos
      @_CazaBobos 2 ปีที่แล้ว +1

      Hell, you can even use tailwind only for the responsive mobile-first design and use standard css inside. My top 1 too.

  • @srinathmuthusamy9661
    @srinathmuthusamy9661 3 ปีที่แล้ว +24

    Tailwind Css 💫

  • @_MdAbirAlFoysal
    @_MdAbirAlFoysal ปีที่แล้ว +1

    That was really helpful

  • @scottisitt
    @scottisitt 3 ปีที่แล้ว +2

    Very helpful! Thanks for sharing! EDIT: Numbers 3 and 4 in the description are a little confusing. Is it Materialize or Material UI?

  • @Weibenfalk
    @Weibenfalk 3 ปีที่แล้ว +4

    Good one as always man!

  • @buanghosen7988
    @buanghosen7988 3 ปีที่แล้ว +1

    Great review Adrian, but may I know what tool do you use for drawing on the screen?

  • @El_nino_337
    @El_nino_337 2 ปีที่แล้ว +1

    Semantic UI looks the best among all.

  • @vg6306
    @vg6306 3 ปีที่แล้ว +1

    What do you think about bulma vs tailwind which one is good to learn?

  • @nirvanzentinal
    @nirvanzentinal 2 ปีที่แล้ว +2

    Also mantine is one of the best components rich modern UI library ♥

    • @AdrianTwarog
      @AdrianTwarog  2 ปีที่แล้ว +1

      I’ll need to check that out

  • @leticiaespino7251
    @leticiaespino7251 2 ปีที่แล้ว

    Thanks for the quick review

  • @ahmedalkhier5811
    @ahmedalkhier5811 3 ปีที่แล้ว +3

    Which one is better to learn. For someone want to get job junior position!!
    I'm really confuse 😕

    • @Lebacbemti
      @Lebacbemti 3 ปีที่แล้ว +1

      Bootstrap 100%

    • @xamantiwari
      @xamantiwari 3 ปีที่แล้ว

      Tailwind

    • @_benjimouse_
      @_benjimouse_ 3 ปีที่แล้ว

      Learn them all, once you've messed with one for a while the others are easy to pickup. Then pick the one that's appropriate for the project.

  • @theobellash6440
    @theobellash6440 3 ปีที่แล้ว +2

    Sir, which software do you use to make these video?

  • @samirsamir7779
    @samirsamir7779 3 ปีที่แล้ว +2

    Bootstrap ... thank you Adrian ^--^

    • @AdrianTwarog
      @AdrianTwarog  3 ปีที่แล้ว

      😇

    • @xamantiwari
      @xamantiwari 3 ปีที่แล้ว

      Bruh try it out tailwind you wiill love it

  • @nicetomeetugaming7024
    @nicetomeetugaming7024 2 ปีที่แล้ว +1

    Good video sir!

  • @daedrikaskhan
    @daedrikaskhan 3 ปีที่แล้ว +2

    HOW you protect your website from copying using Tailwind ?

  • @jo.c81
    @jo.c81 2 ปีที่แล้ว

    rEALLY good summary of css frameworks. It was funny how abruptly the video ended, no goodbies, no Adios , nothing, just CUT !!! :)) Pure CSS sucks for those pure- prefixes and Foundation rocks for email templates

  • @JayCeeIsOutrageous
    @JayCeeIsOutrageous 2 ปีที่แล้ว

    Great video, learned a lot in such little time :)

  • @mandomandohm
    @mandomandohm 3 ปีที่แล้ว +2

    Try combination between ant.design with tailwindCss

  • @Fixerhub
    @Fixerhub 2 ปีที่แล้ว

    Well explained!

  • @prashlovessamosa
    @prashlovessamosa ปีที่แล้ว

    Thanks for sharing

  • @tigrankhachaturian8983
    @tigrankhachaturian8983 3 ปีที่แล้ว +3

    Careful about the MUI, it is gonna make your vscode intellisense take 5 seconds to just display an error or around 3 seconds to display a suggestion, no matter how powerful your computer is. I love it's styles, but damn, it is slow af, just a very bad experience

    • @MK_con
      @MK_con 2 ปีที่แล้ว

      and it's only for react projects

    • @tigrankhachaturian8983
      @tigrankhachaturian8983 2 ปีที่แล้ว

      @@MK_con I actually abandoned my project (that was supposed to be my portfolio project) completely, just because of MUI. 'Cause it was such a pain to work with

    • @MK_con
      @MK_con 2 ปีที่แล้ว

      Use grid. Create your own components with grid and sass.

    • @tigrankhachaturian8983
      @tigrankhachaturian8983 2 ปีที่แล้ว

      @@MK_con I know this stuff already, I used tailwind for my next project (though now I'm learning advanced math to try out graphics programming, since ui creation is not my cup of tea)

  • @ArifAldoseri
    @ArifAldoseri 2 ปีที่แล้ว

    Oxygen Builder + Bulma does the job for me

  • @EasyWebCode
    @EasyWebCode 3 ปีที่แล้ว

    Very Useful

  • @Kristoph-69-69
    @Kristoph-69-69 ปีที่แล้ว

    I just cdn and use a couple different libraries. Each have their strengths and weaknesses. I use the best of each.

  • @gesangwibawono7570
    @gesangwibawono7570 3 ปีที่แล้ว +1

    Bootstrap ❤

  • @OniHuntress
    @OniHuntress 3 ปีที่แล้ว +2

    your body language is so awesome bro

  • @sethupathy143
    @sethupathy143 3 ปีที่แล้ว +2

    Tailwind is easy to make beautiful design. But the problem with it, It doesn't provide JS support. Tailwind's headless UI package helps with that. But using headless UI feels like building something from scratch.

    • @xamantiwari
      @xamantiwari 3 ปีที่แล้ว

      You can provide twin.macro + tailwind

    • @saravanan.r5079
      @saravanan.r5079 3 ปีที่แล้ว

      @@xamantiwari I am new to react and tried to use twin macro cuz of tailwind but couldn't apply dynamic styles

    • @tanzimibthesam5861
      @tanzimibthesam5861 3 ปีที่แล้ว

      What js support are you talking about??

    • @sethupathy143
      @sethupathy143 3 ปีที่แล้ว

      In many CSS framework like bootstrap / Material UI you can build accordions and menus easily since it comes with Javascript functionalities where as tailwind you can't.

    • @tanzimibthesam5861
      @tanzimibthesam5861 3 ปีที่แล้ว

      @@sethupathy143 Well thats javascript functionality but if You know React and Vue have tons of components toggle modal these things are just matter of minutes. But owl carousel of Bootstrap is awesome cant deny that. You can look onto Alpine.js if you are not making an SPA

  • @chellam578
    @chellam578 3 ปีที่แล้ว +6

    I tried some framework but once u get comfortable with pure css u don't need any framework plain css works just awesome

    • @AdrianTwarog
      @AdrianTwarog  3 ปีที่แล้ว +2

      It's why people should try each, never know what will work for you!

    • @tanzimibthesam5861
      @tanzimibthesam5861 3 ปีที่แล้ว +7

      Pure css is not worthy if you have to do both design and development alone

    • @chellam578
      @chellam578 3 ปีที่แล้ว +2

      @@tanzimibthesam5861 u think so plz get some knowledge pure css is so powerful

    • @maman1414
      @maman1414 3 ปีที่แล้ว

      Well framework also important if you work with team because I have experience my friends don't understand my css and then we decided to use bootstrap 😅

    • @tanzimibthesam5861
      @tanzimibthesam5861 3 ปีที่แล้ว +1

      @@chellam578 i know at the end of the day everything is pure css Tailwind just saves so much time i can style as i like and get fast responsiveness in all breakpoints without media queries.

  • @asheaven1st
    @asheaven1st 3 ปีที่แล้ว

    Yess.. Tailwind CSS is outstanding..

  • @bineetnaidu5146
    @bineetnaidu5146 3 ปีที่แล้ว +4

    Chakra UI??

    • @lutfiikbalmajid3128
      @lutfiikbalmajid3128 3 ปีที่แล้ว +6

      is it come from naruto?

    • @_ap__
      @_ap__ 3 ปีที่แล้ว +1

      it comes under React frameworks

    • @bineetnaidu5146
      @bineetnaidu5146 3 ปีที่แล้ว +1

      @@_ap__ that's true tho ☺️

  • @ericakoten1362
    @ericakoten1362 3 ปีที่แล้ว +2

    Hello Adrian, When would you recommend one to begin learning CSS frameworks before learning JS or after learning JS?

    • @cloudpuncher4615
      @cloudpuncher4615 3 ปีที่แล้ว

      CSS and JS frameworks are for devs who either work on huge projects and want consistency (all code looks the same) or for those who don't understand CSS/ JS. If you know how it works, you are a better dev. If you don't understand CSS, you can't use it in your JS (selectors, transitions, animations ect). Start with HTML CSS...

    • @ericakoten1362
      @ericakoten1362 3 ปีที่แล้ว

      @@cloudpuncher4615 Thanks alot

    • @cloudpuncher4615
      @cloudpuncher4615 3 ปีที่แล้ว +1

      @@ericakoten1362 Once you know the basics, for CSS Every layout and Cube CSS (methodology not framework) are the real deal. For JS ,finite state machines (XState) and RxJS (you can build your own) are where its at.

    • @tigrankhachaturian8983
      @tigrankhachaturian8983 3 ปีที่แล้ว +1

      @@cloudpuncher4615 strongly disagree, vue is really easy to pick up and it's much easier to create programms with it compared to vanilla&rxjs, and vue 3 has reactive variables which are pretty much the same as rxjs.

    • @cloudpuncher4615
      @cloudpuncher4615 3 ปีที่แล้ว

      @@tigrankhachaturian8983 I can't comment on how easy or hard Vue or React are. I've never bothered to learn them, they are shockingly slow and a waste of code. BUT on the flip side I know JS inside out... I can write custom SSG's SW's use readable/ writeable streams, indexedDB and pretty much anything JS can do (I probably wouldn't write asm.js). AND all of it is performant... If you want to make truly performant code try some of these tips... th-cam.com/video/owcvg2YZ7Y8/w-d-xo.html . Frameworks are for companies that can't code to a "standard"... First they create a standard way to code.... but then they're devs bitch and moan and can't follow instructions... so then they make it more restrictive and it gets harder to code anything useful.... and then they create a framework to allow everybody to code to the "standard". Then they realize that the framework isn't performant and go back to SSR or use SSG's. There's been an explosion of SSG's lately BECAUSE frameworks don't perform.... BUT why bother configuring webpack or any other bundler just to output some basic HTML CSS. When did all of this get so over OVER engineered and UNDER performant? Maybe everybody's trying to make it easy but are giving themselves JS fatigue....

  • @fastsolution
    @fastsolution 3 ปีที่แล้ว +1

    Bulma hmm nice

  • @siya4536
    @siya4536 3 ปีที่แล้ว

    This was interesting. What about the transition?

  • @OfficiallAiHistory
    @OfficiallAiHistory 2 ปีที่แล้ว

    I think I'll go with Bootstrap

  • @joako_gm
    @joako_gm 3 ปีที่แล้ว +1

    9th says skeleton again in description. Good video btw, pretty intresting.

  • @developerpranav
    @developerpranav 3 ปีที่แล้ว

    I searched for this video because there's at least 10000000 CSS Frameworks

  • @victormendoza3295
    @victormendoza3295 2 ปีที่แล้ว +1

    I'll be honest, this video hasn't helped me only because the frontend is confusing at this moment. I'm thinking material ui overall (with future dart/flutter use) but I do like bulma's naming scheme.

  • @balajiravi9259
    @balajiravi9259 3 ปีที่แล้ว +1

    Bootstrap Css❤️

    • @xamantiwari
      @xamantiwari 3 ปีที่แล้ว

      Try out tailwind you will love it atleast once

  • @MysticCloak-e9r
    @MysticCloak-e9r 3 ปีที่แล้ว

    30th like and 10th Comment. Can I get a heart plz???
    Keep Growing Man!!!! You have helped me a lot!

  • @ahmadsadiq1243
    @ahmadsadiq1243 2 ปีที่แล้ว

    sir is it good for developer to learn all these framework? is css is not enough in developing websites? Response me please

    • @lukas.webdev
      @lukas.webdev ปีที่แล้ว

      There is definitely no need to learn all these frameworks... but once you understand pure CSS it makes sense to try out a few css frameworks, understand what their benefits are and use them wherever they can bring you an advantage... 😉

  • @dawoodmarral7538
    @dawoodmarral7538 2 ปีที่แล้ว +1

    is there any free sources from where i can learn about tailwind or bootstrap
    anyone please suggest me.

    • @lukas.webdev
      @lukas.webdev ปีที่แล้ว

      I'll post a crash course / tutorial on Tailwind CSS this Saturday on my channel, if you are interested...😉

  • @imnemo2327
    @imnemo2327 3 ปีที่แล้ว

    Semantic or Material ui ?? Confused please tell

  • @meghrajshete304
    @meghrajshete304 2 ปีที่แล้ว

    I have doubt css or tailwind css which I learn

  • @ideagame3633
    @ideagame3633 3 ปีที่แล้ว

    of course Bootstrap, but Tailwindcss is very cool arm of poker))

  • @WISE_
    @WISE_ 3 ปีที่แล้ว

    Tailwind utilization is the best!

  • @mshikebkhan
    @mshikebkhan 2 ปีที่แล้ว

    Which of these look more good on mobiles??

  • @coding4evry1
    @coding4evry1 2 ปีที่แล้ว

    Did you notice you go from #3 Bulma to #5 Material Design? Where is #4?

  • @maluksd6537
    @maluksd6537 3 ปีที่แล้ว +2

    Tailwind is the best 👌

  • @ead5590
    @ead5590 3 ปีที่แล้ว +6

    Gave Bootstrap and Tailwind a shot.. Didn't like em.. Trying to remember em classes and what not got me straight up irritated.
    I just whip out that SASS and I'm ready to go. Great video as always! ✌🏻

  • @l.ga.1061
    @l.ga.1061 2 ปีที่แล้ว +1

    Nice

  • @miguelmondragon1366
    @miguelmondragon1366 3 ปีที่แล้ว +1

    Tailwind number one😉

  • @zalman_6175
    @zalman_6175 3 ปีที่แล้ว

    How can I install tailwind css in laravel?

    • @fahimadnan9492
      @fahimadnan9492 3 ปีที่แล้ว

      why would you want to use tailwind with laravel,.? lol

    • @aashiq_hasnat
      @aashiq_hasnat 3 ปีที่แล้ว

      @@fahimadnan9492 to design his site..

  • @OnixHoque
    @OnixHoque 3 ปีที่แล้ว +5

    Why doesn't people talk about Semantic UI that much???? It has such a wide variety of components and they are so beautiful!!! Not to forget the flexibility of customization that comes out of the box. 😔🤔🤔🤔

  • @buildingphase9712
    @buildingphase9712 3 ปีที่แล้ว +1

    I love vuetify so much. . .

  • @frrabelo
    @frrabelo 2 ปีที่แล้ว

    Do a review of this video compared to vuejs

  • @joeadeleke
    @joeadeleke 3 ปีที่แล้ว

    Chakra UI???

  • @Dastcz
    @Dastcz 3 ปีที่แล้ว

    Go check out Grayshift too :)

  • @abdullahsaid8561
    @abdullahsaid8561 11 หลายเดือนก่อน

    bulma isn't finished, and i highly suggest to not use semantic UI, it's currently abandoned, the docs also messy

  • @ducdungnguyen3925
    @ducdungnguyen3925 2 ปีที่แล้ว

    Actually MUI (Material UI) can't create without React.

  • @MarkEdwardTan
    @MarkEdwardTan 3 ปีที่แล้ว

    Combination of Ant Design + Tailwind for me.

  • @staefoded
    @staefoded 3 ปีที่แล้ว

    Tailwind 🥳

  • @harshadm824
    @harshadm824 3 ปีที่แล้ว

    Tailwind is the best

  • @mintesnotmelese6552
    @mintesnotmelese6552 3 ปีที่แล้ว

    Tailwind OP

  • @robertusadrian
    @robertusadrian 3 ปีที่แล้ว +2

    still love Bootstrap 😅

    • @xamantiwari
      @xamantiwari 3 ปีที่แล้ว

      Bruh try out tailwind you will love it

    • @AdrianTwarog
      @AdrianTwarog  3 ปีที่แล้ว

      :D me too

  • @samnayakawadi
    @samnayakawadi 2 ปีที่แล้ว

    Sementic UI

  • @HimasRafeek
    @HimasRafeek 3 ปีที่แล้ว

    Anyone checked out Butter Cake css framework?

  • @medafouk606
    @medafouk606 3 ปีที่แล้ว +2

    Hello everyone l want to ask you some questions

    • @bineetnaidu5146
      @bineetnaidu5146 3 ปีที่แล้ว +1

      go ahead!

    • @abhayagarwal5097
      @abhayagarwal5097 3 ปีที่แล้ว

      Don't type to say i will ask instead ask them , so even if you don't care others might benefit from it.

  • @one_way_tech
    @one_way_tech 3 ปีที่แล้ว

    Wow 🙏

  • @avishkadevinda7773
    @avishkadevinda7773 3 ปีที่แล้ว +1

    Tailwind❤️❤️

  • @sidhantthakur961
    @sidhantthakur961 3 ปีที่แล้ว

    Tailwindcss is ❤️

  • @eliashrn
    @eliashrn 3 ปีที่แล้ว

    Your forgot ant design

  • @pirbaba755
    @pirbaba755 3 ปีที่แล้ว +1

    F css lern 1st php

  • @michaelandreuzza
    @michaelandreuzza 3 ปีที่แล้ว

    tailwind css is not a framework.

  • @gatosssss1
    @gatosssss1 3 ปีที่แล้ว

    I laugh at you not putting Quasar in the list

    • @jorge1869
      @jorge1869 3 ปีที่แล้ว

      It sound like sh1t

  • @andrewb5412
    @andrewb5412 3 ปีที่แล้ว

    You move weird

  • @squigglyspaghetti8690
    @squigglyspaghetti8690 2 ปีที่แล้ว

    I'm sure the information is great but I just can't get past how contrived and uncanny your gesturing is. It's like some clueless FANG company trained a ML model exclusively on r/TikTokCringe videos and applied it to their prototype Patagonia tech-bro andriod . I know you gotta do you but please consider toning it down a notch.

  • @margaretocean322
    @margaretocean322 ปีที่แล้ว

    Stop with the hands. Please.

  • @oleksandrkhrashchevskyi5265
    @oleksandrkhrashchevskyi5265 ปีที่แล้ว

    to be honest tailwind 3 sucks in comparison to Bootstrap 5

  • @AkashChowdhuryAkash
    @AkashChowdhuryAkash หลายเดือนก่อน +1

    Going with skeleton 🦴🩻