Web前端开发必备的开源框架有哪些

JavaScript029

Web前端开发必备的开源框架有哪些,第1张

今天小编要跟大家分享的文章是关于Web前端开发必备的开源框架有哪些。大多数人想到Web开发时,通常会想到HTML或JavaScript,往往忽略了CSS,根据Wikipedia的说法,CSS既是网页中最重要也是最常被遗忘的部分之一,尽管它是万维网的三大基础技术之一。

今天就和大家分享9个流行的、强大的前端开源框架,帮助你轻松构建漂亮的网站前端。下面来和小编一起看一看吧!

1、Bootstrap

Bootstrap无疑是最流行的CSS框架,它是最早的Web前端框架,由Twitter开发。Bootstrap还提供了许多示例来帮助你入门。

使用Bootstrap,你可以将不同的组件和布局组合在一起,从而创建有趣的页面设计。它还提供了大量详细的文档。目前在Github上已经有1100多个贡献者,19000多个提交。(Github地址:https://github.com/twbs/bootstrap)

2、PatternFly

PatternFly是Red

Hat的开源CSS框架,和Bootstrap不同的是,Bootstrap是为那些想要创建漂亮网站的人而设计的,而PatternFly主要专注于企业应用程序开发人员,提供诸如条形图、图表、导航之类的组件,实际上Red

Hat就是使用它创建了OpenShift。

除了静态HTML,PatternFly还支持ReactJS框架,这是Facebook开发的流行JavaScript框架。PatternFly具有许多适用于企业级应用程序的高级组件,如条形图,图表,模式和布局。

PatternFly在GitHub上一共有1,050多个提交和44个贡献者。(Github地址:https://github.com/patternfly/patternfly)

3、MaterialComponentsfortheweb

MaterialComponentsfortheweb(MDCWeb),是谷歌专为Web设计的全新前端框架。MDC

Web可帮助开发人员执行Material

Design,组件由谷歌的核心工程师团队和UX设计人员开发。这些组件可以建立可靠的开发工作流程,以构建美观且功能强大的Web项目。

MDC

Web在Github上共有5700多个提交和349个贡献者。(Github地址:https://github.com/material-components/material-components-web)

4、Pure

Bootstrap,Patternfly和MDC

Web是功能非常强大的CSS框架,但它们可能非常繁琐和复杂。如果你想要一个轻量级的CSS框架,可以尝试Pure.css,它本身更接近于CSS编程,但又可以帮助你构建一个不错的网页。Pure是具有最小占用空间的轻量级CSS框架,它由Yahoo开发,根据BSD许可是开源的。

Pure在Github上共有565多个提交和59个贡献者。(Github地址:https://github.com/pure-css/pure)

5、Foundation

Foundation声称是世界上最先进的响应式前端框架。它提供了用于构建专业网站的高级功能和教程。许多公司,组织都使用该框架,并且该框架具有大量可用的文档。

Foundation在Github上有将近17000个提交和1000个贡献者。(Github地址:https://github.com/foundation/foundation-sites)

6、Bulma

Bulma是一个基于Flexbox的开源框架,可根据MIT许可证开源。Bulma是一个非常轻量级的框架,因为它只需要一个CSS文件。Bulma拥有简洁明了的文档,可轻松选择你想要的主题。它还具有许多Web组件,你可以在设计中使用它们。

Bulma在Github上有1400多个提交和300个贡献者。(Github地址:https://github.com/jgthms/bulma)

7、Skeleton

如果说还有什么框架比Pure更加轻量级,那一定是Skeleton。Skeleton库只有大约400行,并且该框架仅提供一些基本的CSS框架组件。尽管如此,Skeleton还是提供了详细的文档来帮助你快速上手。

Skeleton在Github上共有167个提交和22个贡献者,但它不是最活跃的项目,它最新一次的更新是在2014年。(Github地址:https://github.com/dhg/Skeleton)

8、Materialize

Materialize是一个基于Material

Design风格的一个现代化的响应式前端框架,解决了最繁重的工作,结合你的自定义组件,为你提供默认的样式。Materialize的文档页面非常全面,并且很容易遵循。其组件页面包括按钮,卡片,导航等。

Materialize在Github上共有3800多个提交和250个贡献者。(Github地址:https://github.com/Dogfalo/materialize)

9、Bootflat

Bootflat是从Twitter的Bootstrap派生的开源CSS框架。与Bootstrap相比,Bootflat更简单,并且更加轻量级。Bootflat的文档似乎几乎受到了IKEA的启发,大部分都是图像,没有太多的文字。

Bootflat是在MIT许可证下开源的,在Github上有159个提交和8个贡献者。(Github地址:https://github.com/bootflat/bootflat.github.io)

以上就是小编今天为大家分享的关于Web前端开发必备的开源框架有哪些的文章,希望本篇文章能够对正在从事web前端工作的小伙伴们有所帮助,想要了解更多web前端知识记得关注北大青鸟web培训官网。最后祝愿小伙伴们工作顺利!

开源最前线(ID:OpenSourceTop)猿妹编译

链接:#/article/20/4/open-source-css-frameworks

Yui-ext

基于Yahoo UI的扩展包yui-ext是具有cs风格的web用户界面组件,能实现复杂的Layou布局,界面效果可以和backbase比美,而且使用纯JavaScript代码开发。真正的可编辑的表格edit Grid,支持XML和Json数据类型。许多组件实现了对数据源的支持,如动态布局,动态加载Tree控件,动态拖拽效果等等。从1..0beta版开始同jQuery合作,推出基于jQuery的ext1.0,提供了更多有趣的功能。

优点:结构化,清晰明了,底层用到了jQuery的一些函数,使整合使用有了选择,最重要的一点是界面太 让人震撼了。

缺点:太过于复杂,整个界面的构造过于复杂。

Jquery

任何使用场景都适用;jQuery是一款同prototype一样优秀的js开发类库,特别是针对css和xpath的支持,使我们写JS变得更加方便。

优点:注重简洁和高效,js效果有yui-ext的选择,因为yui-ext重用了很多jquery的函数;

缺点:据说太嫩,历史不悠久。

Extjs 内部系统,后台系统,管理系统等,有很好的UI设计;

Dojo

功能是最为强大的JS框架,Dojo是一个用JavaScript编写的开源的DHTML工具箱。Dojo包括Ajax、browser、event、widget等跨浏览器API,包括了js本身的语言扩展,以及各个方面的工具类库,和比较完善的UI组件库。Dojo强大的地方在于界面和特效的封装,可以 让开发者快速构建一些兼容标准的界面。适合企业应用和产品开发;

优点:库相当完善,发展时间也比较长,得到sun和IBM的持。

缺点:文件体积比较大,200多kb,JS语法增强方面不如prototype。

Prototype

最成熟的框架;定义了JS的面向对象扩展,Dom操作API,事件等等,以prototype为核心,形成一个外围的各种各样的JS扩展库;

优点:基本底层,易学易用,甚至是其他一些JS特效开发包的底层,体积算是最小的;

缺点:如果说缺点,可能就是功能是它的弱项;