CSS is an essential part of any website. However, pure css code sometimes forces you to write too much unnecessary stuff, and many libraries are willing to take on the chore.
SASS/SCSS
Yes, it’s not a library, it’s a preprocessor. But it’s so cool, in my opinion, that if you have CSS in your article, you can’t do it without SASS. What makes it cool? Well, here’s why.
It extends the functionality of conventional CSS: it allows you to split styles into separate files and then “marry” them into one. You can use variables, nesting, mixins, etc. All the things a developer starts dreaming about at the beginning of his second year have been implemented in SASS.
Why a preprocessor and what does it mean?
You write in a special CSS syntax, and in the background, the SASS builder turns your sass files into css. It sounds complicated at first glance. But if your computer knowledge was enough to open this article, I’m sure you can handle SASS too!
Bootstrap
Some people don’t like it (me for example) and some people like it. However, it’s worth admitting that everyone uses it. Bootstrap – a set of ready-made UI elements, grids, forms, galleries, etc. Find everything you need by scrolling the official site Bootstrap and copying the code needed element, and then add it to your page.
Bootstrap turns the development process into a regular game of jigsaw puzzle, as any element you can tweak and bring to the desired look. This greatly simplifies the routines of the layout and avoids mistakes that can be made.
It has its disadvantages. If you want to make a design that is very different from Bootstrap (this is rare), then you will have to greatly remake the styles. In that case, it’s easier to re-do the elements.
Another disadvantage that clearly catches your eye is the love of Bootstrap on the part of novice developers. Bootstrap is contraindicated in the beginning because “it will eat you up”. If you know what I mean. It should be a tool purely to save time. You can start using it only when you clearly understand that you’re able to design a layout without it. In the initial stages of using it is not worth it.
Animate.css
Nowadays, already difficult to surprise something. Shiny and shimmering backgrounds from the last decade, leading to epileptic seizures, can not leave the client on the site. Now an important role is played by animation. Pleasant transitions and switching elements of the form, buttons and any part of the page, with which the user interacts, make the process of working on the site is much more pleasant. This library allows you to use ready-made cross-browser solutions instead of drowning in the wilds of css-animation.
Foundation
I was hesitant about whether to include this library in the selection or not. The fact that you’re likely to encounter it in your work and learning process made Foundation a fourth item. In many ways, Foundation can be replaced by Bootstrap, as the two libraries are extremely similar and differ only in minor syntactic differences.
Historically, Bootstrap, for a number of reasons that can only be guessed at, has become more popular and more actively used. But focusing on functionality and quality, it’s hard to say which library is better. They are too similar.
Fontawesome
This is the last in the list, but by no means in importance. Extremely useful tool that allows you to save a lot of development and reduces the amount of memory occupied by the project. By connecting this tool, you will be able to use a huge number of icons, without loading them as images. Icons are connected by adding a class, thereby greatly simplifying development.
Can it be called a CSS library? Rather arbitrarily, but it is a very useful thing. If you are interested in different libraries, you should not ignore Fontawesome.
Libraries are a wonderful thing that reduces development time and gives a stable quality of code. But it’s a very bad idea to use them when you’re learning how to do layout (you can use SASS and Fontawesome).
You should use CSS, as well as any other libraries, only if you are sure you can do without them. This is the only way you’ll gain a solid knowledge. And if one day you’re asked to fix something in the written code, you will not faint, and easily solve this problem.