This article will discuss with you 9 Popular 、 Powerful and open source framework , Let your css Development to easily build sophisticated network front end .
Bootstrap No doubt the most popular css frame , It was the first web One of the front end frames . from Twitter Development ,Bootstrap It's practical 、 Functionality and scalability .
Bootstrap There are plenty of examples to help you get started .
adopt bootstrap, You can connect different components and layouts , To create an interesting page design , It also provides a lot of detailed documentation .
Bootstrap Of Github In the repository , Already has more than 19000 And 1100 Contributors . be based on MIT License , You can also join them and make your own contribution .（ Like all the frameworks in this article ）.
PatternFly yes RedHat The open source CSS frame （ according to MIT The license ）. And Bootstrap comparison ,PatternFly In a different way ：Bootstrap Designed for those interested in creating good looking websites , and PatternFly Focus on enterprise application developers , And it offers things like bar charts , Components like charts and navigation , Used to create powerful , Indicator driven dashboard . actually ,RedHat Use this CSS Framework for product design , for example OpenShift.
PatternFly There are many advanced components for enterprise applications , Like a bar chart , Chart , Patterns and layouts and so on .
PatternFly Of GitHub The page lists more than 1,050 Submit and 44 Contributors .PatternFly Got a lot of attention , You are also welcome to help with the project .
3、Material Components for the web
With very successful Android platform ,Google With MaterialDesign We set our own standard design criteria .MaterialDesign Standards tend to be at all Google It's all reflected in the products , And in MIT Under permission , It can also be open source and available to the general public .
MaterialDesign There are many components , go by the name of “ Interactive building blocks for creating user interfaces ”. These buttons , card , Background, etc , It can be in a web site or mobile app , Create any kind of user interface .
Maintainers provide detailed documentation for different platforms .
Here's a step-by-step tutorial , It includes exercises to achieve different goals .
MaterialComponents GitHub The page contains repositories for different platforms , Including for websites Web Developed MaterialComponents（MDCWeb）.MDCWeb Have 5700 Multiple submissions and 349 Contributors .
Bootstrap,Patternfly, and MDCWeb They are very powerful css frame , But the disadvantage of them is that they are complicated . If you want a lightweight one css frame —— Closer to coding CSS In itself , But it can help you build a sophisticated web page , Try to use Pure.css.Pure It's lightweight with minimal footprint CSS frame . It consists of Yahoo Development , Passed BSD Licensed and open source .
Even though it's small , but Pure Provides a number of required components , Enough to build a sophisticated web page .
Now ,Pure stay Github Previous 565 Submission and 59 Contributors .
Foundation Claim to be the most advanced responsive front end framework in the world , It provides advanced features and tutorials for building a professional website .
Foundation Have a lot of documents available , And it has been used by many enterprises 、 organization , Even politicians use .
stay Github On ,Foundation Has a page close to 17000 And 1000 Name contributor . Just like the other frameworks in this article ,Foundation Same ownership MIT The license to execute .
Bulma It's based on Flexbox Open source framework of , And have MIT The license to execute .Bluma It's a very lightweight frame , And just need one CSS file .
Bulma Have clear documentation , And it makes it easy for you to choose your favorite theme to explore . meanwhile ,Bulma And a lot of web Components for you to choose from , And use it in design .
stay Github On ,Bulma The page has more than 1400 Submission and 300 Name contributor .
If Pure What makes you feel too cumbersome , So a lighter frame Skeleton It's a good choice .Skeleton Our database is only 400 That's ok , The framework only provides some basic components for you to open CSS The journey to the framework .
Even though Skeleton It's very simple , But it provides detailed documentation , Can help you get started right away .
Skeleton stay Github Owned on 167 Submission and 22 Contributors . however , It's not the most active project , The last update was in 2014 year , So you need more maintenance before you use it . It won the MIT Permission of , It also means that you are free to operate on it .
Materialize It's based on GoogleMaterial Design A responsive front-end framework for , Which includes Materialize Other topics and components developed by our contributors .
Materialize The documentation is comprehensive and easy to learn , Its component page includes buttons 、 card 、 Navigation etc. .
Materialize stay MIT Open source is realized under authentication , It's in Github Page submission has exceeded 3800 strip , And have 250 Contributors .
Bootflat It's a model from Twitter Of bootstrap A derivative of css Open source framework . And Bootstrap comparison ,Bootflat It's easier , It also has lighter frame components .
Bootflat The document almost seems to have been IKEA Inspired by the —— It shows the image of each component instead of the text .
Bootflat Passed MIT The license to execute , Its presence Github The text written on the page , Also have 159 Submission and 8 Contributors ,
At the end
choice css There are many ways to open source frameworks , It depends on what you need —— Whether the function is rich 、 Whether the operation is simple . Like all technical decisions , For everyone , There is no single right answer , Only the relatively correct choice in the delivery time and project .
Try to use them for a while , Then see which one you really need in future projects . You are also welcome to share your feedback with me in the comments section , See you next time ！
So much for this issue , I'm Xiaobian. The wind blows from the south , Focus on sharing, fun and fun 、 novel 、 Practical open source projects and developer tools 、 Learning resources ！
I hope to learn and communicate with you , Welcome to my official account. 【Github Navigation station 】.