Learning Bootstrap 3 or 4 should take you very little time, I would suggest you don't learn either of them, but instead take the time to learn CSS (I am of course assuming you are not already a CSS wiz).
You can look at the source of Bootstrap to see how they accomplished certain things if you'd like, but if you're doing anything more than prototyping (and even then), I feel there is very little benefit to using Bootstrap these days.
Once I was told to ignore Bootstrap and just create my css myself (using Sass or CSS Modules) I find I'm making the same recommendations to others. It doesn't take long and you'll have a much better idea of what is happening on your page.
Your html and css should end up being much smaller as well.
Yes, you should learn CSS. Whether or not you should roll your own bespoke CSS/JS for interface components depends on the project. You will learn a lot more about CSS if you do it yourself.
However, I encourage most folks to just use Bootstrap (or Foundation). They're not hard to learn, handle a lot of browser issues for you, are easily customizable, and are very well documented.
If someone ever tells you that Bootstrap is "bloated" or that they "don't like its design choices", they've probably never seen http://getbootstrap.com/customize/.
As a developer, I strongly prefer picking up projects that just use an established framework. No, it's not hard to go through someone's crappy CSS/JS components, but it's just another thing to think about. Let someone else write the JS for dropdown interactions and just build your app.
If you're starting from a vector design (designed in Sketch for example) and need to convert it into a design, would you recommend using Bootstrap's components and overriding them, or is it easier to roll everything yourself?
As a backend dev, I wish somebody had told me this exact advice earlier on in my career. CSS does have a fair amount of silly legacy shit, but it's really not all that bad once you dive in.
Another good project's source code to learn from is Skeleton. (more simple than bootstrap)
I'm a backend dev who did a little frontend here and there over a decade ago (and has sorta kept up since then out of curiosity). So I know CSS decently well, but still need to look things up here and there, and I certainly don't know all the bleeding-edge stuff.
So yes, you should learn CSS, at least so you understand how web technologies work, in general. But not learning/using Bootstrap (as the parent recommends), if you think that will make your life easier, seems silly. I recently had to do a couple frontend projects for the first time in said over-a-decade-ago, and I found Bootstrap easy to pick up (it took like a half hour), and made things a lot easier than rolling my own CSS, for very little cost.
To actually answer the OP's question, it depends on what you need to do. If you're starting new projects, just learn BS4. I did that back in February, and it worked out well for me. If you have to deal with some existing projects that use BS3, you'll of course need to learn that. But they're so easy to use, that if you already understand how HTML and CSS work (if you don't, of course that should be your step 1), you don't need to really "learn" it so much as read through the section on the layout model, and start building a page/site/app, looking at the reference docs as you go along when you want to add a dropdown or navbar or something.
I came across this when I was looking to gain a more complete mental model of how CSS layout works, as opposed to to the odd assortment of tricks, approaches, and googling I had been relying thus far.
Good stuff. I did notice that the normalize.css of Skeleton hadn't been updated since 2014. Is there a more update version of "normalize" out there, or is it still pretty much apropos today?
* Learning CSS is not the first priority of a bootstrapped business. The cost associated with a 100kb of css is much lesser compared to creating a layout and all other styles.
* Learning CSS to create a whole layout from scratch can be a daunting task for the uninitiated.
* The best approach would be to start the project with Bootstrap, create a winning product, and iterate to find the best layout you need. Then in a subsequent release, you can redo the same using css. CSS Flex is very easy once you get the hang of it and you do not need any other css layout framework.
I think it would depend on how much time you are willing to put in and how far you want to go.
If you are primarily a back end developer and you just want to quickly throw down a few prototype pages. If you will never really need more than that, just spending a couple of hours learning bootstrap will be a much better use of time than spending a few weeks learning all the intricacies of css.
I spent years fighting with css. It was such a relief when Bootstrap and friends came out and just removed a whole layer of complexity from my occasional forays into the front end.
Yes, I think that if you don't know CSS then learning that (rather than bootstrap 3 vs 4) is the right answer.
None of these technologies are all that hard. Like, they are easy enough that I don't understand it as a question...
if you know CSS/ SASS and that stack, they take about an hour to figure out the main points and get rolling. But even if you don;t know hardly any CSS then they still take like a day or so, and the principles are pretty much the same.
And equivalent question is "should I learn Sublime or Notepad++". If you understand what they do, pick one and if it stops being a thing you can use for whatever reason then learn the other, because the difficult part of understanding what id going on with them is conceptually the same between them.
My advice is to always understand the layer below what you're working with.
Learning assembly is worthwhile if you're programming in C.
Learning CSS is worthwhile if you're designing websites using Bootstrap.
Perhaps even more importantly though, CSS, JavaScript, and HTML have a longevity that's tremendously longer than any given framework. My understanding of these technologies from 15 years ago remains relevant today, and although there's been a lot of new features added, I can build upon that knowledge to incrementally learn new things. And I'm confident that in another 15 years from now, knowledge of these web technologies that underpin all the frameworks will still be relevant. The same can't be said of Bootstrap 4.
In a parallel universe there must be a non-sarcastic version of you, and I agree with them. I genuinely believe that devs should have at least some familiarity with any flavour of assembly.
I've been using Bootstrap 4, since it's already stable and will come out in a few months anyway, so I won't have to upgrade anytime soon.
If you use libraries that depend on Bootstrap, you might want to check compatibility. I was using Bootswatch and the developer didn't upgrade the code to Bootstrap 4 until a few weeks ago. Other than that, I see no reason not to use the latest version.
I'm surprised by all the comments saying that you don't have to learn Bootstrap but you can just look up the components every time you need to use them, suggesting you use Skeleton, or that if you use Bootstrap you don't want to learn/know CSS. Nonsense.
There's also an other reason to go with the "almost released" one when starting a new project: bootstrap has been historically painful to migrate.
Upgrading major bootstrap version means changing class names in whole codebase (like the classes for grid system), changing html code for some components which have been updated, and having to remove other components altogether and go with your own sauce because components were removed.
This has been the case for all previous major bumps, and there is no sign of it being any different this time, so better save a migration and go straight with bs-4.
The other day I was looking at Bootstrap 3 documentation by mistake instead of Bootstrap 4 and it was completely different, with some components missing altogether.
Yeah, people are saying, "No, learn CSS!" but isn't CSS exceedingly simple?
Why can't I just use Bootstrap because I don't feel like designing an app, and Bootstrap is the fastest way to get a consistent layout on web and mobile? What's it got to do with learning at all?
> "No, learn CSS!" but isn't CSS exceedingly simple?
No, it's not. I don't want to start a CSS flame war, but at least for layout / positioning I struggle every single time with CSS, especially on sites with dynamic content. CSS is my least favorite part of the web development stack by far.
Everyone opting for "do your own CSS" and not using a framework, is absolutely a horrible idea. You will not be the only one writing CSS for long term for your app I assume, any new member will find it extremely difficult where to modify following some good standards. They might miss a lot of things or overdo things perhaps.
Regarding learning BS3 or BS4, I'd opt for BS4. All you have to know what things BS4 provide and use them appropriately. Not to mention, some fairly good CSS knowledge is also a pre-requisite. One of the themes we recently used is startUI (google for it). It's on BS4 and the components were easy to integrate in apps.
On a serious note, I believe the befitting proverbial advice is, "Give a Man a Fish, and You Feed Him for a Day. Teach a Man To Fish, and You Feed Him for a Lifetime."
You said "learning", so I'd still suggest learning the actual CSS. Of course, when you become a bit comfortable with it, you'd have already learned Bootstrap.
Here is how I'd for;
- Use Bootstrap 4 or even 3 to learn your CSS. Use it, go through the source codes and learn from there.
- Keep doing CSS (feel free to try other frameworks too) and you should be on your way.
The analogy I can find is that quite a lot of people "learned" jQuery. Then, they figured out that it is, well, JavaScript. They got intrigued, went backward and learned JavaScript. Many enterprising developers advance and 'learn' other frameworks too.
I used to be in the camp where my take was, "learn the actual raw CSS and JavaScript - that's the way to learn." But my experience dealing with juniors, and new developers is that not everyone can just learn something. In fact, a lot of people do not know how to learn things the right way. They need to first learn to learn new things.
So, take it easy on yourself, start with something you can start off (and produce something you're proud of) and begin learning real CSS in the process.
Well, my team specialize mostly in fixing projects shoved down by developers using Bootstrap, where the enterprises needed to go to market quickly. Once they reach critical bloat-stage, we go in to clean-up, make the sites 10-30 times faster by removing all of Bootstrap and other frameworks and staying really lean (use a minimal framework or a very low footprint one.) We, sometimes, end up developing the "Bootstraps" for these companies.
Ah! My bad. My assumption is that if someone is asking if s/he should learn Bootstrap 3 or 4, s/he might still be trying to figure out what to learn to get to the next step in HTML/CSS/JS development.
If s/he is already proficient with CSS, s/he might not be asking that question.
I might have extrapolated this thing a bit, haven't I!
It depends on what you want to optimize for. If you're starting a startup and you anticipate having a dedicated design team, I think you're better off making your markup match your domain and hand-rolling the CSS instead of using a framework like Bootstrap. This is the ideal approach IMO because it lets you much more effectively keep the styling out of the markup and in the stylesheets. CSS frameworks by definition require you to put styling in your markup.
But if you're just trying to bang out a small project quickly and have it look nice without needing to muck with CSS too much, then a framework can be very useful. These days I prefer Semantic UI over Bootstrap:
Oh, I might not be aware of that type of CSS framework. Can you point me to some examples? I was thinking of frameworks like Bootstrap and Semantic UI.
It doesn't matter. Because no matter what tech you use in the web app space, it will all be obsolete in a year or two. Your apps will never be done, because the sand will shift underneath them. You'll need to continually update them to keep them working, or abandon them.
I think it's better to ignore the world of framework hype and just code to the browser APIs as described by the standards. You can basically guarantee that your site will still work ten years from now and that your knowledge will still be relevant (though you'll need to keep up to date with new features e.g. flexbox).
I personally find it more work to learn frameworks and deal with the leaky abstractions inherent in them than to work with the browser directly. Especially when I hit a case where I want to do something that the framework authors didn't cater for and I end up having to go down to the browser APIs to implement it anyway.
In the short term, it's a bigger investment to learn the underlying technologies, but in the long term it pays off big time, since you don't end up being stuck with something that sounded great two years ago when you started your project but is no longer maintained.
The answer you want is to use Bootstrap 3. The reason is that you are new and tutorials will be written for that version. Although generally speaking I would start with 4, you also don't want to burn out on stupid unfinished/incomplete work. Don't burn out when you are just starting!
You can look at the source of Bootstrap to see how they accomplished certain things if you'd like, but if you're doing anything more than prototyping (and even then), I feel there is very little benefit to using Bootstrap these days.
Once I was told to ignore Bootstrap and just create my css myself (using Sass or CSS Modules) I find I'm making the same recommendations to others. It doesn't take long and you'll have a much better idea of what is happening on your page.
Your html and css should end up being much smaller as well.
However, I encourage most folks to just use Bootstrap (or Foundation). They're not hard to learn, handle a lot of browser issues for you, are easily customizable, and are very well documented.
If someone ever tells you that Bootstrap is "bloated" or that they "don't like its design choices", they've probably never seen http://getbootstrap.com/customize/.
As a developer, I strongly prefer picking up projects that just use an established framework. No, it's not hard to go through someone's crappy CSS/JS components, but it's just another thing to think about. Let someone else write the JS for dropdown interactions and just build your app.
Another good project's source code to learn from is Skeleton. (more simple than bootstrap)
CSS version: https://github.com/dhg/Skeleton
Sass version: https://github.com/WhatsNewSaes/Skeleton-Sass
Edit: For more of a tutorial approach, check out http://learn.shayhowe.com/html-css/
So yes, you should learn CSS, at least so you understand how web technologies work, in general. But not learning/using Bootstrap (as the parent recommends), if you think that will make your life easier, seems silly. I recently had to do a couple frontend projects for the first time in said over-a-decade-ago, and I found Bootstrap easy to pick up (it took like a half hour), and made things a lot easier than rolling my own CSS, for very little cost.
To actually answer the OP's question, it depends on what you need to do. If you're starting new projects, just learn BS4. I did that back in February, and it worked out well for me. If you have to deal with some existing projects that use BS3, you'll of course need to learn that. But they're so easy to use, that if you already understand how HTML and CSS work (if you don't, of course that should be your step 1), you don't need to really "learn" it so much as read through the section on the layout model, and start building a page/site/app, looking at the reference docs as you go along when you want to add a dropdown or navbar or something.
http://book.mixu.net/css/
I came across this when I was looking to gain a more complete mental model of how CSS layout works, as opposed to to the odd assortment of tricks, approaches, and googling I had been relying thus far.
* Learning CSS is not the first priority of a bootstrapped business. The cost associated with a 100kb of css is much lesser compared to creating a layout and all other styles.
* Learning CSS to create a whole layout from scratch can be a daunting task for the uninitiated.
* The best approach would be to start the project with Bootstrap, create a winning product, and iterate to find the best layout you need. Then in a subsequent release, you can redo the same using css. CSS Flex is very easy once you get the hang of it and you do not need any other css layout framework.
I know CSS pretty well and Bootstrap versions are no longer an important concern to me (I can pick up either just by looking at the docs).
> A: Learn CSS
This is not helpful and does not answer the question.
If you are primarily a back end developer and you just want to quickly throw down a few prototype pages. If you will never really need more than that, just spending a couple of hours learning bootstrap will be a much better use of time than spending a few weeks learning all the intricacies of css.
I spent years fighting with css. It was such a relief when Bootstrap and friends came out and just removed a whole layer of complexity from my occasional forays into the front end.
None of these technologies are all that hard. Like, they are easy enough that I don't understand it as a question...
if you know CSS/ SASS and that stack, they take about an hour to figure out the main points and get rolling. But even if you don;t know hardly any CSS then they still take like a day or so, and the principles are pretty much the same.
And equivalent question is "should I learn Sublime or Notepad++". If you understand what they do, pick one and if it stops being a thing you can use for whatever reason then learn the other, because the difficult part of understanding what id going on with them is conceptually the same between them.
Learning assembly is worthwhile if you're programming in C.
Learning CSS is worthwhile if you're designing websites using Bootstrap.
Perhaps even more importantly though, CSS, JavaScript, and HTML have a longevity that's tremendously longer than any given framework. My understanding of these technologies from 15 years ago remains relevant today, and although there's been a lot of new features added, I can build upon that knowledge to incrementally learn new things. And I'm confident that in another 15 years from now, knowledge of these web technologies that underpin all the frameworks will still be relevant. The same can't be said of Bootstrap 4.
- Learn Javascript before you learn React etc.. - Learn Python before you learn Django etc .. - Learn LANGUAGE before you learn FRAMEWORK
Deleted Comment
Deleted Comment
Dead Comment
I've been using Bootstrap 4, since it's already stable and will come out in a few months anyway, so I won't have to upgrade anytime soon.
If you use libraries that depend on Bootstrap, you might want to check compatibility. I was using Bootswatch and the developer didn't upgrade the code to Bootstrap 4 until a few weeks ago. Other than that, I see no reason not to use the latest version.
I'm surprised by all the comments saying that you don't have to learn Bootstrap but you can just look up the components every time you need to use them, suggesting you use Skeleton, or that if you use Bootstrap you don't want to learn/know CSS. Nonsense.
Upgrading major bootstrap version means changing class names in whole codebase (like the classes for grid system), changing html code for some components which have been updated, and having to remove other components altogether and go with your own sauce because components were removed.
This has been the case for all previous major bumps, and there is no sign of it being any different this time, so better save a migration and go straight with bs-4.
The other day I was looking at Bootstrap 3 documentation by mistake instead of Bootstrap 4 and it was completely different, with some components missing altogether.
I've been using the version 1, 2 and 3 and I've never felt like I needed to learn it. Usually I just open the doc when I need to use something.
Why can't I just use Bootstrap because I don't feel like designing an app, and Bootstrap is the fastest way to get a consistent layout on web and mobile? What's it got to do with learning at all?
No, it's not. I don't want to start a CSS flame war, but at least for layout / positioning I struggle every single time with CSS, especially on sites with dynamic content. CSS is my least favorite part of the web development stack by far.
Regarding learning BS3 or BS4, I'd opt for BS4. All you have to know what things BS4 provide and use them appropriately. Not to mention, some fairly good CSS knowledge is also a pre-requisite. One of the themes we recently used is startUI (google for it). It's on BS4 and the components were easy to integrate in apps.
You said "learning", so I'd still suggest learning the actual CSS. Of course, when you become a bit comfortable with it, you'd have already learned Bootstrap.
Here is how I'd for;
- Use Bootstrap 4 or even 3 to learn your CSS. Use it, go through the source codes and learn from there. - Keep doing CSS (feel free to try other frameworks too) and you should be on your way.
The analogy I can find is that quite a lot of people "learned" jQuery. Then, they figured out that it is, well, JavaScript. They got intrigued, went backward and learned JavaScript. Many enterprising developers advance and 'learn' other frameworks too.
I used to be in the camp where my take was, "learn the actual raw CSS and JavaScript - that's the way to learn." But my experience dealing with juniors, and new developers is that not everyone can just learn something. In fact, a lot of people do not know how to learn things the right way. They need to first learn to learn new things.
So, take it easy on yourself, start with something you can start off (and produce something you're proud of) and begin learning real CSS in the process.
Well, my team specialize mostly in fixing projects shoved down by developers using Bootstrap, where the enterprises needed to go to market quickly. Once they reach critical bloat-stage, we go in to clean-up, make the sites 10-30 times faster by removing all of Bootstrap and other frameworks and staying really lean (use a minimal framework or a very low footprint one.) We, sometimes, end up developing the "Bootstraps" for these companies.
Why preaching about learning CSS while he's just asking about Bootstrap 3 vs. Bootstrap 4?
If s/he is already proficient with CSS, s/he might not be asking that question.
I might have extrapolated this thing a bit, haven't I!
But if you're just trying to bang out a small project quickly and have it look nice without needing to muck with CSS too much, then a framework can be very useful. These days I prefer Semantic UI over Bootstrap:
http://semantic-ui.com/
How do mixin-based CSS frameworks require you to put styling in your markup?
I personally find it more work to learn frameworks and deal with the leaky abstractions inherent in them than to work with the browser directly. Especially when I hit a case where I want to do something that the framework authors didn't cater for and I end up having to go down to the browser APIs to implement it anyway.
In the short term, it's a bigger investment to learn the underlying technologies, but in the long term it pays off big time, since you don't end up being stuck with something that sounded great two years ago when you started your project but is no longer maintained.
You're going to be in the dirt eventually anyway...