akinloludavidFirstly, what is a framework? A framework is essentially a platform that allows developers to build things faster. Here are some key things to know about frameworks in general
- A framework allows you to build softwares without having to code from scratch.
- It is basically a pre-written program that you can build upon as a developer.
Most programming languages have their own framework (Javascript especially) but for this post, we would be learning about CSS frameworks.
Writing plain CSS while building a small web project can be fun. However when the application becomes bigger and more sophisticated, plain CSS can be extremely stressful. Your best bet would to use a CSS framework. Here are some advantages of using CSS frameworks.
- Faster development
- Cross browser functionality
- Enforces standard web design patterns and styles.
There are many CSS frameworks out there, however in this post I have curated top 5 CSS frameworks to learn in 2021.
Bootstrap - Bootstrap is the most popular HTML, CSS and Javascript framework for developing nice looking websites that are responsive and mobile friendly. Bootstrap comes with it's own components like navbar, carousel, buttons etc. It was developed by twitter in 2011 and it is currently in version 5. You can visit bootstrap official website to learn more. Their documentation is very explanatory. Top companies like twitter, walmart use bootstrap for their web applications.
Tailwind - Tailwind is a utility-first CSS framework. Unlike other CSS framework that come with their pre-defined components, Tailwind enables you to create your own bespoke designs easily. Top companies like hashnode, livestorm, Superchat, Hubblr use Tailwind css.
Foundation - Foundation is also a very advanced CSS framework that comes with a bunch of in-built components and also some animations. It is highly responsive design and mobile friendly. Accenture, Nubank are companies that use foundation.
Bulma CSS Bulma - is a CSS framework based on CSS flexbox. It also has a lot of in-built components that you can use. One distinct feature of Bulma is that it comes in a lightweight weight structure that allows you to only import the components you need. Companies like Django, Rubrik used Bulma CSS
Materialize CSS Materialize is a CSS framework developed by Google with HTML, CSS and Javascript. It contains a lot of engaging components that can accelerate frontend development and enhance user experience. It is also known as Material Design.
NB: There are a bunch of other CSS frameworks out there like Purecss, skeleton, ant design etc. This article is just to show you some of the most relevant ones. Also, you don't have to know everything. Knowing one or two is fine. You can always pick up others to learn if a project demands it.
You should have a considerable understanding of CSS before you start learning any framework
If you find this article helpful, kindly let me know in the comment and don't forget to like.✌🏾
