Do You Really Need Bootstrap or Tailwind?

แชร์
ฝัง
  • เผยแพร่เมื่อ 28 พ.ค. 2024
  • Bootstrap vs Tailwind vs Vanilla CSS. Which CSS framework should you use? Which one is better? Cons and pros. Let's talk about the truth.
    If it is valuable to you, you can support Lama Dev.
    Join: / @lamadev
    Buy me a coffee: www.buymeacoffee.com/lamadev
    Join Lama Dev groups
    Facebook: / lamadev
    Instagram: / lamawebdev
    Discord: / discord
    0:00 Should I use Bootstrap?
    02:44 Why Vanilla CSS is important?
    03:47 Should I use Tailwind CSS?
    06:20 Which CSS framework is better? (The conclusion)
  • วิทยาศาสตร์และเทคโนโลยี

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

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

    Exactly my story Pure CSS = Freedom 💯

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

      And you can still make your own utility classes with variables or common units etc (at least if you're using CUBE CSS for your plain CSS) and save em as a snippet or a file.

    • @r-ddle
      @r-ddle 2 หลายเดือนก่อน

      Any limits in tailwind? Isn't it also similar to css but much easier I suppose

    • @praveenvinopv9929
      @praveenvinopv9929 2 หลายเดือนก่อน

      @@r-ddle it has some learning curve which takes efforts. But if you put those efforts into pure css you can do whatever you want and also you can make your own utility classes

  • @Sam-cz7ck
    @Sam-cz7ck 2 ปีที่แล้ว +66

    Totally agree with you.
    It's really important to master the fundamentals and to feel comfortable with the css, and when you are in a hurry use a framework

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

    You changed my life. I have fallen under the trap of using bootstrap for everything including my portfolio lol. You opened my eyes to the importance of learning CSS well and its fundamentals before using frameworks for efficiency.

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

    Perfect explanation. It cannot be more accurate ❤️ thanks a ton!

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

    Thanks, man, we really appreciate your work. ✌😁

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

    when I doing projects for learning, I would choose Tailwind, it's simple and fast. But when I need to hand over some website to my customer, a framework can save you a lot of time.

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

      Tailwind solved the most frustrating step in making design and layout prototypes which is customizing built-in components from most css frameworks, I am looking at you Bootstrap.

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

      Yeah, totally agree with you. Tailwind also has default color palettes, which can be great for designing an efficient yet beautiful website quickly.

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

      @@jackdoe1312 I don’t get your point. Isn’t tailwind framework agnostic?

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

    You are really a live saver, I have been working with css for awhile now a friend of mine recommended me to use bootstrap because its faster.
    but watching this now I think I would lean tailwind to scale up my skills..thanks @lama

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

    I was happy creating a few Bootstrap projects, but I started to feel like I was just repeating the same process with each one. I realized it was because I was avoiding diving deeper into CSS in a professional manner. Watching a video about this at 4AM made me confront this feeling of inadequacy. So, I've decided to go back and learn CSS from scratch. Thank you for inspiring me with your video.

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

    I agree! I had a project in which I had to build a clone of the twitter feed (and I was requested to use Bootstrap), but, I quickly found out that it was much easier, and even cleaner to do it in native CSS!
    At the end, I only used the default fonts of Bootstrap (which are very similar to the original font), and the rest of it, I found much more confusing than pure CSS!
    :)

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

    The way you explain stuff, you re pure gold man

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

    I totally agree with you sir, when i was trying to learn web development my friend used to say don't learn css, it is not necessary learn bootsrap,antdesign,tailwindcss.After that, i experienced same things that you lived.If you know the fundamentals, rest of the portions becomes very easy.

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

    As a designer and a front-end dev at first I thought, what could be better than bootstrap. I took a look at Tailwind and cringed at how your code ended up with tons and tons of classes. I then tried Tailwind just to understand why it should be written in that fashion. I quickly realised that you could make your own themes, custom classes, custom modules, etc. It really is an amazing framework and I can apply my own design methodologies, creating my own class/components and reuse them in the future which speeds up my work output tremendously.
    Tailwind has a steep learning curve and you are correct in stating that you should know CSS very well before even attempting it. I've seen many developers who are not design minded hate on Tailwind simply because they don't understand the fundamentals of design, style libraries, etc. In my opinion, Tailwind CSS is revolutionary in the modern world of front-end development.

    • @AJ-jg7xf
      @AJ-jg7xf ปีที่แล้ว

      Tailwind is OP

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

      True
      I hated it first but now I wish my company allowed me to use it instead of bootstrap

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

      Yes, 100% 😉🔥

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

    Thanks so much for the in depth explanation...it really helps developers

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

    Great content my brother. Keep on your format, love it!
    Can you do a crash tutorial on CSS Layouts? When to you use which one? Which makes most sense to learn?

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

    Loved this video! Really good, thanks :)

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

    I learned how to use css with you. Thank you lama

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

    I totally agree. Always start from the bottom and "optimize" only when you fully understand what is happening under the hood'.
    My first job in IT was programming device drivers in assembler / machine code in 4K memory. Basically you had 80 instructions you could use. You could put the manual (2 pages) in your breast pocket. We even had an instruction (NOP) that did nothing ;-) They all did very simple things blazingly fast. No longer the most efficient way to make a 21th century "app" but it gives you a thorough understanding of many underlying principles that still apply.
    That being said I still use good old LESS as a pre processor for bundling and its shorthand syntax. But at the end of the day it is still plain CSS when you don't use the fancy stuff.

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

    Your explanation is very helpful.
    Thank you !

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

    Excellent job putting this together.

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

    You just motivated me to keep working on my CSS + get better. I love the CSS stress tho 😅, I feel pro ❤️

  • @tracy8522
    @tracy8522 5 หลายเดือนก่อน

    Totally agreed =) Thanks for sharing this!

  • @rahulkumar-yk2ru
    @rahulkumar-yk2ru 19 วันที่ผ่านมา

    Your video truely connects to us.😍Got something new

  • @teclote
    @teclote 8 หลายเดือนก่อน

    Outstanding advice, thank you.

  • @ARM_LuckyNo23
    @ARM_LuckyNo23 6 หลายเดือนก่อน

    Much needed direction for me, thanks. i am just beginner in this vast web universe, not sure how far i can go..but started..

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

    Very helpful advice. Thanks

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

    Thanks for sharing Lama, I have a similar journey as yours.

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

    Since I work mostly with React I've found styled-component is so good.

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

      @Mohammad Al-Shuwaiee it's mote likely as SCSS with more power

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

    Thank you for this video. Will save me so much time.

    • @lukas.webdev
      @lukas.webdev 11 หลายเดือนก่อน +1

      I just posted a video about creating responsive design with tailwind css in 2023 - this could be interesting for you as well! 😉

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

    nothing beats pure css. I have never used bootstrap in my projects

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

      Well... actually Tailwind does beat pure css in many points... 🤔

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

      Tailwind beats pure css in every way

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

    Very good video it’s exactly that you can use frameworks but you will be able to use them very efficiently if you know CSS. CSS or SASS first.

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

    I learned CSS first and discovered bootstrap after building sites from pure html/css. Bootstrap was such a time saver! It was awesome, and I still use it (BS5) heavily.
    Tailwind is very flexible, but I never got into it. It seemed, to me, to defeat the purpose of css altogether (to separate formatting from content) because you had to add class upon class upon class. Compound that to the fact that it was impossible (or rather, I never figured out how to customize tailwind classes) to create repeatable classes for components in html.
    At least with bootstrap, you could create your basic layout, then customize your components with your own css.
    Nowadays, I have adopted Webflow into my workflow. Webflow is a no-code solution that still requires a basic understanding of how html/css works, but is faster for generating basic CMS structured websites.
    Good video! Appreciate the point of view.

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

    All I can say, you are an awesome teacher and a deep thinker.

  • @Pylogicx
    @Pylogicx 10 หลายเดือนก่อน

    Thank you so much. You solve my problem. ❤

  • @fatrushaikh5990
    @fatrushaikh5990 3 หลายเดือนก่อน

    You know you are doing a very great job
    Adding very valuable information to my kife

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

    Once I got a project of completely redesigning an admin dashboard and that dashboard was previously built in Bootstrap, I had to do so much of excess work just because of this. I would personally never recommend using Bootstrap because it gives you no control over things and for future changes (like in my case) even the small tasks become super tedious. People say that you can use Bootstrap when you have to meet your deadlines but, I would recommend creating your own assets (like navbar, sidebar, landing pages, headers, footers, etc.) is so much better, because you have so much more control over those. For me, Bootstrap is a complete no.

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

    Hi, video was amazing and that was first video that I watched completed.
    Ur way of talking is ♥️♥️♥️

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

    I like the way you explained everything, its sooOthing!🥰

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

    amazing guidance 🙏🏻 ❤️

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

    Thanks for your advice 🌹

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

    Great video of the Century
    Love you sir

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

    I use tailwind with css modules on my Next.js projects, that combination feels really good

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

    Your every video contains ton of information. Thanks dear.

  • @wing-views
    @wing-views 2 ปีที่แล้ว +9

    2010! It hurts when I realize we both started in the same year and I ended up as a Structural designer instead of web designer/ developer. Still designing pages and developing apps as a hobbyist. Can't wait to quit the current job and follow my interests. Anyway, I prefer vanilla over frameworks for my personal projects since I love to do everything from the scratch and bootstrap/bulma if the client needs.

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

      Good luck in chasing your dreams!

    • @wing-views
      @wing-views 2 ปีที่แล้ว +2

      @@noura4701 Thank you. Hoping for the best.

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

    Yeah I also agree with you pure css is really powerfull.... And it's the best way to improve design skill ...

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

    You can have your own variables, colors, spacing with bootstrap too. You just need to edit the variables.scss file and then build the bootstrap files again. So you can edit your button to be as your design and then you don't need to write css or put some classes to your div. You're ready with simple . It's like tailwind its just a trend from youtubers the last years :P (I'm not saying its bad)

  • @GameVerse215
    @GameVerse215 4 หลายเดือนก่อน

    your voice really gives me peace ... i am going to learn csss .. i was really stuck cause i was learning bootstrap ... it sucks ...

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

    I must follow your recommendations.

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

    I believe CSS-in-JS solutions are great. I had a antipathy for StyledComponent but after using it, I can easily see how make it process easier.

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

    I prefer tailwind specifically for it's utility based approach. I was already constantly making custom mini utility frameworks for projects with vanilla CSS to begin with, so when this came out it drastically reduced my work. That being said, having learned CSS using plain notepad on windows, I can perhaps appreciate it a bit more 😂

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

      Thanks for sharing your story. 😉

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

    Yes. Fundamentals is the key. I feel confident working with only CSS no matter how big or small the project might be.
    Lama please consider doing a MERN School Management System.
    Many thanks.

  • @adekolaadelana2384
    @adekolaadelana2384 7 หลายเดือนก่อน

    Awesome explanation

  • @Unorthodox999
    @Unorthodox999 9 หลายเดือนก่อน

    Actually this video is way better than other explanations

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

    Great video but Bootstrap has been (pretty much) fully customisable since version 4 (we’re now on version 5) as it’s written in on SCSS. You just change the default variables and you can even remove modules you don’t use. I think CSS and tailwind are great but I think your opinion of Bootstrap is outdated

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

    Gotten use to writing css on my own and enjoy the freedom alot, problem is companies want you to have experience in one or both

  • @thatocyberspace
    @thatocyberspace 8 หลายเดือนก่อน

    Well explained thank you

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

    imho your missing one crucial point in using tailwind: you’re always in context. i’m a frontend developer, i mainly write jsx lately so having style properties tied to my jsx code as any other element prop is a huuuuge time saver and helps me keep my work organized in components tidly

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

    hey lamadev, thank for teach me new thing in every video, i have a question about database, when we are develop our app/web, i am using my mongodb , my question is, when we work for client, and the app is done, what must / should am i doing with mongodb or the database ? thanks

  • @nnwebdigital
    @nnwebdigital 9 หลายเดือนก่อน

    Hi Lama, this is an awesome video. For the first time I'm hearing for the WordPress on this channel.
    Did you consider making some WordPress development tutorials?
    Cheers.

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

    Congratulations for Mackbook ❤

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

    Thank you for this video. if you learn Vanila css and javascript... Then any framework is easy to Learn and understand ❤️❤️

  • @curesnow6493
    @curesnow6493 4 หลายเดือนก่อน

    Informative video !
    I have a question tho…. Is it ok if I can combine bootstrap , pure css, and other css frameworks ?

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

    If you want to practice html, css and javascript, Frontend mentor provides basic, intermediate and advanced projects that you are suppose to clone. I can highly recommend

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

    Thanks for the video Lama 🙏😍 could you make a video of making ecommerce website using react and django?

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

    Love you From Bangladesh. i learning web Development. i follow u

  • @aburaihan-py4vi
    @aburaihan-py4vi 6 หลายเดือนก่อน

    Excellent!!!

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

    Do we have any survey statistics, which CSS frame work in first palce right now in web. Any one noce please... Thank you

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

    Thanks lama dev!

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

    yes lama absolutely. basics should be first and it s must

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

    To be very sincere, I am an aspiring Backend developer and I have to say your courses have increased my knowledge of CSS
    Thank you so much

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

    Yue always great lama 🐇

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

    I will just say that if you use a library as React, you should try Styled Components.

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

    With tailwind you have to understand how css works and what class to use. It is almost the same like learn vanila css. It hard to compare tailwind to bootstrap actually.

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

    Bro u just saved my future I was already losing hope because of this kind of apps

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

    Do more video like this, it great

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

    I can't go back after using tailwind + react

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

    Bootstrap has its use cases but man tailwind is just too nice. Once you get the hang of how to layout things for example containers, flex, grid, ect it’s too smooth and on top of it customization is super easy whether you integrate or use css within the style sheet

  • @phonenaing8670
    @phonenaing8670 8 หลายเดือนก่อน

    Thanks !!!!

  • @404ashishgour
    @404ashishgour 2 ปีที่แล้ว

    Please make a video on git, and how as a team we use git. There are many videos with theory and they make us very confuse.

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

    Thanks Lama

  • @504-chavdarahul6
    @504-chavdarahul6 ปีที่แล้ว +1

    Amazing 🔥

    • @lukas.webdev
      @lukas.webdev 11 หลายเดือนก่อน +1

      I just posted a video about creating responsive design with tailwind css in 2023 - this could be interesting for you as well! 😉

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

    collecting a good programmer YT channel at a time in my learning journey :)

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

    Great video! Super informative. I tend to disagree with the argument that Tailwind makes your HTML unreadable or "bloating your classes". Tailwind has a few ways around this. You can create a CSS file and then combine TW classes into a single class to represent some component. Alternatively, your HTML arguably should be the least readable thing to a developer. Your HTML should result in the user-experience, which does not include the developer experience at all. Your logic, however, should be readable to other developers. But it's hard to prescribe that your HTML should be nice and easy to read.

  • @soueinivle948
    @soueinivle948 6 หลายเดือนก่อน

    I just start using tailwind and I'm pissed becuase other elements in the tailwind is not functioning, like p-5 will work and then p-6 will not work, Is tailwind like that or what I do is wrong. I know my english is bad

  • @MartinPerez-mi1ty
    @MartinPerez-mi1ty 2 ปีที่แล้ว

    Wich theme are you using? Nice video tho

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

    There are some problems with pure CSS and it's such a pain, especially if you use properties that aren't compatible with other browsers, any tips for compatibility?

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

    Good to Have Skills - >Material Ui Tailwind CSS 💯

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

    Great video

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

    I know you only do react videos but can you do a review of svelte and svelte kit and perhaps transform one of your sites - the movie site project, for instance, to svelte?

  • @arsalan2276
    @arsalan2276 2 หลายเดือนก่อน

    very helpful💯👌🏻👍🏻❤

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

    Absolutely agree with author. Tailwind will be better for difficult landings. Bootstrap better for making web apps faster and easy. Developer does't need to think about how to make a component, he simply inserts a ready-made component.

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

    As a self-proclaimed css wizard, Tailwind is my new wand

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

    How did you practice CSS? I'm looking for resources where I can PRACTICE CSS. As beginner, copy whole projects looks too difficult and unnecessary because I just want the CSS part for now.

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

    I prefer to use Styled Components or MUI + Styled Components =)

  • @AG-tj9cq
    @AG-tj9cq ปีที่แล้ว

    شكرا للتوضيح 👍

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

    You can use sass and configurate the Bootstrap in the way you want

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

    Interesting article. As you say, I use bootstrap occasionally because I’m a backend person. The front end has never really appealed to me. I’m more interested in the problem solving than look. I can’t believe there are so many ways to put widgets on a screen. Really?

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

    Styled Components is cool one

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

    As you said without js knowledge its hard to learn react.

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

    Adding tailwind to a project is difficult . It's not easy sometimes liver server doesn't work properly when building tailwind components in terminal .

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

      I mean it comes with its own CLI now to watch and output the build. It took me literally 2 mins to add to a new project today

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

      My brain hurts at first because of configurations when importing it inside your project but now i get used to it the 3rd time.

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

    Thanks a lot....