DEV Community

yaalese1
yaalese1

Posted on

Vanilla CSS vs Bootstrap

While working on my most recent react project for class, I had the choice of using many different libraries for css to change the appearance of each element. I essentially chose react bootstrap. At first I thought using a library for css would be way easier then using vanilla but I was very much mistaken. Don't get me wrong Vanilla has it's con as well but I guess we can discuss pros and cons and you can be the judge.

While using Vanilla I liked that it was a simple cut and paste into your Html index, which could be a blessing or curse. When pasting you do not have full control of your css unable to determine or create your own class names or id. This dilemma makes it difficult to edit or tweek your css to exact desire .

When using bootstrap I was initially confused lol. I say this because boot strap had it's on JSX code written and you had to decipher which tags, classNames where needed to be added to your code. Take look at the example below.

This an example of React bootstrap code

Image description

and below is an example of my personal project code .

Image description

If you notice most of the bootstrap code was not needed to create the actual form which was a bit annoying. One thing that was beneficial was that i could create my own class or id and customize my css accordingly.

I personally prefer both depending on what I need to design and how complex the project may be.

Top comments (0)