Should I dump Bootstrap and work on CSS first

I have been thinking using Bootstrap is all good and fine but I am not really learning how CSS works. Even at this early stage of my coding should I be using CSS instead of the bootstrap method.

4 Likes

If you want you can ditch Bootstrap and do your own CSS for the frontend projects. I learned a lot of it that way.

IMO you should work on CSS first. Bootstrap is good but you can do a lot more if you have deep knowledge on CSS.

5 Likes

I was thinking that as bootstrap is just a load of predefined CSS stuff really.

Right time to learn the CSS stuff a bit more then :confused::stuck_out_tongue_closed_eyes::fearful:

Bootstrap has some nice plugins though, so it’s not just a load of predefined CSS.

I also think you should do less bootstrap, it can only help to know more css plus learning flexbox and media queries gives you the options as well for responsive pages when you are happy with your knowledge … bootstrap then has its place. also i think for learning sass a good knowledge of css will be of benefit.

3 Likes

Ah so have the link in place for some things just in case but work on my own CSS file. Thanks guys

Good point.

To tell the truth my first projects used Bootstrap. Then I started adding my own CSS to my projects until I felt skilled/comfortable enough doing the next ones without Bootstrap.

1 Like

+1 for @P1xt 's response. The portfolio page gives you tons to figure out, so stick to Bootstrap. CSS is huge and has a lot to it, and I think it’s better to complete the portfolio without trying to perfect it with pure CSS. I tried doing this, and making a single navbar without Bootstrap took me a couple of days and even then it wasn’t ideal…

So instead of wasting a good couple of weeks on CSS right now, do what I did. Finish up the portfolio with Bootstrap but use a bit of your own CSS where you can. Custom buttons, images, maybe the email form. Use the Bootstrap grid no matter what, though. That’s the toughest part to emulate yourself.

Then you’ll end up at the weather project. Mine is really, really simple but I made it without Bootstrap. Here it becomes fine, because you only have to design one component, and once you figure out the API calls, you don’t have much to do. So practice your CSS in these front end projects. Even then make JS your priority.

Last tip, browse codepen everyday. Look at the pens you like and favorite/heart them. When you want to incorporate one of the things they did, try doing it yourself and then skim through their code. I’ve learned ~60 percent of whatever CSS I know through this.

5 Likes

@P1xt
I see what you are saying now and thank you.

So get skilled in bootstrap then CSS

@P1xt Thanks for you help!

HI @JustinGreenwood1979

i think it depends on your situation because i know both sides.

My general opinion is "learn something the hard and long way and if you are much familiar with it, all things after it will be easier for you. And this worked for me the most time.

But i also made an experience for @P1xt points. To be more specific…in JS.
I learned JS years ago but i was never really good at it because i really REALLY hated the syntax and little actions needed 100 lines (felt like this) of code. I liked what you can do with js but that was all. Then i learned JQuery and i loved it from the first minute on!
It was so easy and made fun. i learned and read much about it and made many projects with it in no time. It seems never easier before to use JS.

And since then i have no problem with JS (with and without JQuery). It seems easier for me to understand and i don’t have this “oh i hate it sooo much” approach to it. And i think this is not only because i am more experienced now. The cause is i learned much about JS through JQuery and that helps for a better understanding.

So my recommandation is, try the way you think you are more confortable with. That makes much more fun and much more easier for you to learn something.

Regards
Phajava

Hi,

I had the same question when I start the course, and I’m still the noob of the noobs, but IMO, if you want to learn things deaply, it’s now, when you’re “at school”, it will be more and more difficult later.
I explain: bootstrap is a good tool which allow you to build some pretty web pages quickly, and its powerfull too. But it hide some basis that are good to know I think.

But now you have time, you don’t have pressure from your customer in a hurry or your angry boss, you can have time to test things, to document yourself, so to learn.
It’s not about portfolio, or any FCC project to finish as soon as possible or faster than the others, it’s about knowledge and “how-to”.

I made my portfolio without bootstrap, I spent a lot of time on it, but i learned a lot too, in many many aspect, like relative units, media queries, responsive design, and so on, and I’m sure this work will pay later.
It might be ugly, but it works, it’s (more and less) responsive, it’s light, and it’s not so difficult.
As we say : “hard train, easy fight”.
And if you want to build an intranet site, without outside connection, I don’t know how to download boostrap (I know it’s not the best point…)

The answer is yours, most important is do what you like.
If you like to use bootstrap because it’s simple and powerful now, and you think you can learn later : do it !
If you want to learn more deaply from scratch now, spending more time now for less in the futur : do it !
I chose the second one.

Wish you to succeed, best regards.
(sorry for my english)

@JustinGreenwood1979 You can add custom CSS styles along with using Bootstrap. Since you can combine custom CSS styles with bootstrap’s predefined classes, I don’t see a reason to ditch Bootstrap. Studying the Bootstrap classes using Google Chrome’s web inspector and reading the documentation is also helpful, and if you study them in the context of your project it might help you understand what the Bootstrap CSS is doing.

I’m with @P1xt on this one. Stick with Bootstrap for the foreseeable future. I’m a third of the way through Data Viz and I wouldn’t be comfortable saying I know Bootstrap. I actually want to go back to my old projects and clean them up by adding more Bootstrap classes that I’ve learned since I’ve completed those projects. Knowing Bootstrap is a very valuable skill to have, so don’t throw the baby out with the bathwater in the pursuit of “learning the basics”.

The one caveat I’ll add is that how early or late you decide to ditch Bootstrap will likely depend on what your goals are. Do you want to head in more of a design direction or more of a development direction? If you lean design, then learning Bootstrap quickly along with lots of vanilla CSS (and Sass/LESS) will be more important. If you’re like me and you lean toward development and you enjoy the JavaScript more than the HTML/CSS, then you might hang on to Bootstrap for a little longer while you focus on Javascript.

Also don’t forget about Foundation and other CSS frameworks that provide similar functionality to Bootstrap and may be more or less well known/used. These can also be valuable knowledge.

1 Like

Just my 2 cents worth… Like others mentioned, I use both… I have bootstrap linked on a project, but also have my own css file linked as well… I can take advantage of features of bootstrap, but also do my own css as I want.

I didnt see any reason to reinvent the wheel on things that bootstrap has proven methods of addressing…

I also play around with a couple of the other frameworks out there… Just happens to be bootstrap I’m using for the current project.

Everyone learns differently, but I think it would be beneficial if you can learn both plain CSS and frameworks at the same time.

Well-tested frameworks like Bootstrap fix a lot of issues that you wouldn’t be able to catch with limited CSS experience. So if you need to publish a web project before you become a CSS expert, Bootstrap can save you from a lot of headaches as well as wasted time if you are dealing with deadlines.

Like mentioned before, you can always add your own CSS files for customization.

You can also experiment with smaller CSS frameworks/libraries (e.g. Skeleton, PureCSS, you will find a lot through a Google search) if you want to try alternatives that don’t do as many things for you as Bootstrap.

I have only been doing this coding thing for a week, and I was super confused about bootstrap at first, but now I’m getting the hang of it. You will need to know how to use both bootstrap and css to make the first 2 projects. . . if you want them to look good. . .I use this website constantly: http://www.w3schools.com/html/default.asp

It has a search feature which is super helpful, you can quickly cut and paste code from it, and screw around with the code to figure out what’s going on.

First thing you need to do is get into the mindset that this is going to be hard and you have to force yourself to do some real mind-scrambling work, but you’ll go to bed thinking about a problem, and the next day you’ll hop back on the solution will be glaring at you!!!

I’m addicted. . .and maybe in a bad way!

2 Likes

Hi,

I don´t agree with most of these comments. I was trying to learn so many things at the same time that I din´t even know if what I was using was css, or bootstrap or what. It was all a mess. So for me, it was better to go little by little. If you go to bootstrap without css… you can get lost. You will have to go back. I think it makes more sense to start with css and then go with bootstrap. Same thing happens with Javascript and JQuery.

If you read about this on stack overflow (which I think we all agree is a good source) you will find a lot of people that thinks like I do. In fact, FCC is now rethinking the order of the lessons and postponing the introduction to bootstrap and libraries.

But even more important than that is that you have a good general picture of what you are learning. I like to look for the Table of Contents of general courses so I see what there is to learn, what I know, and what is ahead. It is always good to have a map :wink:

2 Likes

Bootstrap is Not recommended to be used by developers working on US government sites ( in its CSS guide for Front end developers, called 18F, as it is: ) :

18F specifically does not recommend using Bootstrap for production work because:

It is difficult to adapt its opinionated styles to bespoke design work, and
Its CSS style places semantic layout instructions directly in HTML classes

Here ia the link to this guide:
https://pages.18f.gov/frontend/#css

1 Like

Nice answer @P1xt . Totally agree with your point of view. Using libraries like bootstrap and jquery makes it easy for beginners to complete projects early. Which encourages them to learn more.We can always refactor it later.

I learned this the hard way.

But things go crazy when someone tries everything at once.
In short : “Learn to use software (libraries) created by others and then it becomes easy learn to build your own”.