I have been learning html/css and a little bit of bootstrap via FCC, udemy web dev with colt steel, and codecademy. My question is: as i start practicing and creating new projects, should i focus on trying to use only css to get a better mastery of it or should I use bootstrap to become more proficient with it as I go along?
1 Like
I think they’re both useful and are not mutually exclusive. I would go ahead and learn Bootstrap and in the mean time pick up a book an CSS and slowly work through it. People tend to forget about CSS because it’s not “sexy”, but mastery of it will save you a lot of headaches.
1 Like
It would depend on the urgency. If you have a project you need to complete in a short period of time and money is on the line, bootstrap is your best option. However, if you have time then I would do my very best to understand CSS. The better you understand CSS, the better you’ll understand bootstrap.
2 Likes
I would recommend you to master CSS first, because not all companies will use that kind of framework like Bootstrap. What if there are complicated things or they suddenly want a complete fancy customized design build from scratch. How would you react on that idea? Hard to master it that is what I am telling you. Most people see themselves as a good CSS Developers, but really underestimated the power of CSS. One company forced me to implement Bootstrap, but at the end they asked me to build a complete customized thing so Bootstrap was quite useless in that project. In my opinion you must always ask how easy things will be if you use some frameworks. Like everyone is using Angular, React, but forgot that debugging might be a hell if you do not master vanilla JavaScript and furthermore learning frameworks means you need to constantly start from scratch, while learning vanilla CSS means you keep growing infinitely. Of course your codes need to be written DRY, but using framework is a gift for you as a Developers, because jumping from vanilla to a framework will steer up your productivity. But conversed using a framework before understanding the deeper part will slow down your productivity.
1 Like
Do both. Actually, do three things. First, build your project with CSS. Then build it with SCSS. Then build it with Bootstrap.
Building the same thing three times with three different tools will give good insights into why the tools exist in the first place. Writing plain CSS is a monumental pain in the ass after you start using Sass.
You will appreciate CSS frameworks, like Bootstrap, much more after you’ve gone through the process of building your own responsive grid.
In general, I don’t think you need to “master” CSS unless you want to be HTML/CSS specialist. You probably do need to have a firm enough grasp of CSS that you can build all the standard website components (nav, footer, button, blockquote, teaser, forms, etc.). But I don’t think you need to be a Key Frame wonk before you start learning Bootstrap.
I would say get comfortable with CSS. Understand the block model, the cascade, and specificity. Learn how to position content, how to clear floats, how to use media queries, how to debug CSS using Chrome dev tools. Learn how to use Flexbox. Learn how to use transitions.
Once you have a solid understanding of vanilla CSS, learn SCSS. You could learn LESS, too - but SCSS is more valuable.
After SCSS, it probably makes sense to learn a CSS framework. Bootstrap is a good choice. But there are plenty of other options that are used instead of Bootstrap (e.g. Bourbon Neat or Lost Grid) because they don’t come with all the overhead that Bootstrap carries.
After learning a CSS framework, well, then it really depends on your interest. If you’re interested in animation you could get into Key Frames. If you don’t think any of the existing frameworks fit your use case, roll your own and open source it. Want to use the tools the “cool kids” are using learn how to configure Post CSS set up CSS Next
Just don’t get caught in the trap of trying to memorize every property and every detail. That’s counterproductive and it’s likely impossible. Build up your taxonomy of bookmarks to CSS references and use them liberally.
Ah, I totally forgot about CSS methodologies! OOCSS, SMACSS, BEM are popular. I use BEM and I love it. Pick one that makes intuitive sense to you and use it, often. I guarantee you won’t regret it.
Cheers!
3 Likes
The repsonders here are steering you in the right direction. It would be best to know both.
Let’s not forget that Bootstrap and SCSS are really just CSS, they have already done some of the hard work and tackled some common applications for you.
The web browser is only going to interpret HTML and CSS so those are important (and Javascript). The frameworks (libraries) are going to provide common tools for you to use. You can build your own grid in CSS similar to bootstrap and provide fonts and actions. It is just done for you a particular way in bootstrap.
The answer to your question was brought up earlier, speed and re-use (which is again speed). Stay DRY (Don’t Repeat Yourself) and keep moving. In order to not code similar things or repeat yourself so your time is maximized on project / site generation. If you need it fast, let the framework or library help you (someone has already done some of the heavy lifting). If not, build it yourself.
Coding a GUI, Application, or Web project is interesting in the fact that a project that looks and acts the same can be done in many different ways, by many different people. Only those that did the code know what is in the “black box” or under the hood. The user just cares if it works and meets expectations on speed, aesthetics, accuracy.
There is likely no substitute for a fair amount of CSS knowledge, you will want to change and over-ride what is in the framework (libraries) at some point with . . . . CSS.
Cheers,
Brad
Such good advices, thanks!