作为一名在前端死缠烂打6年并且懒到不行的攻城士,这几年阅过很多从知名到很知名的前端框架,本来想拿15-20个框架来分享一下,但在跟几个前辈讨教写文章的技巧时果断被无情的打击了,所以这里我还是低调的只拿出10个框架来个大锅乱炖,凑够字数也就全剧终了。下面的框架也没有什么先后顺序之分,我想到啥就写啥啦(作为前端,我一向都这么的任性^_^ )。
Bootstrap
首先说Bootstrap,估计你也猜到会先说或者一定会有这个(呵呵了),这是说明它的强大之处,拥有框架一壁江山的势气。自己刚入道的时候本着代码任何一个字母都得自己敲出来挡我者废的决心,来让自己成长。结果受到周围各种基友的引诱开始了Bootstrap旅程。本人虽然是个设计+前端的万里有一的人才,但是老天只让我会用PS和各种设计工具却不给我跟设计妹子一样的审美,所以这也是我最初选择Bootstrap的原因之一,它让我做出来的东西好歹能在妹子面前装个逼,不过时间长了难免觉得Bootstrap美的让人烦躁,但好在它的每个版本都会有很大的改变,不会让人觉得自己做的网站会跟很多网站撞脸。Bootstrap的用法及其简单(这也可能就是Bootstrap作者阅攻城士无数,了解他们痛的结果),以至于是个小前端都可以快速上手,几乎没什么学习成本。
官网:http://getbootstrap.com/
Github:https://github.com/twbs/bootstrap/
作者:Mark Otto和Jacob ThorntonStar:93,112
总结:Bootstrap最大的优势就是它非常流行,流行就代表你有问题就有很多人帮你解决问题,就代表装逼它就是利器,还有就是界面比较和谐,容易上手,关注它的童鞋应该发现最新V4版也开始支持FlexBox布局,这是非常好的升级体验。劣势是class命名不够语义化,并且各种缩写,以至于我离了文档就是个菜,最近开始整混合APP,选框架的时候首选就是它,但之前搞PC一直没注意,后来搞混合右键属性看它的时候,瞬间一阵凉风袭来,Bootstrap好小,小到我只好选择别的框架。
AUI
第三个是最近刚起来的AUI,虽然作者声称是专为APICloud开发者设计的一套UI框架,但实际它还是解决了很多移动前端开发的普遍问题,是主要面向混合开发的CSS框架。看起来作者比较猖狂,各种高级CSS3遍地使用,这让我也不得不去查查这些个CSS3的兼容性。不负众望果然选的都是兼容不错的属性,哈哈了一顿激动从前辈手上大胆认识了几个好东西,并且框架还提供了聊天界面、计数列表等组件,解决了很多复杂的让我骂娘的布局,现在可以直接拿走就用。
Github:https://github.com/liulangnan/aui
官网:http://www.auicss.com/
作者:流浪男Star:92
总结:这个框架对我来说有个优点就是纯CSS框架,自己以前也就用过Pure,自己有点JS能力,如果不是复杂的效果,找个纯CSS框架自己随便改改就可以,而现在CSS3也已经能够做到动画,效率、质量、高效全兼顾,所以还是选择了这种CSS框架。有一点觉得不满的是这框架的文档真的好那什么,说好的高大上呢。
Amaze UI
第二个介绍的是妹子UI,最初使用它是因为本尊遇到了一个爱纠结细节设计士,有一次她跟我的字体较上真了,结果一句顶万句的BOOS夸了她,我只好根据她的想法去解决,结果最后找到了Amaze UI框架(我不介意你叫我懒淫),按照官方的话说就是“基于社区开源项目构建的一个跨屏前端框架,以移动优先,从小屏到大屏,最终实现所有屏幕适配,适应移动互联潮流”。但其实我就是看中它能解决国内浏览器存在的跨屏适配和兼容性问题。
官网:http://amazeui.org/
Github:https://github.com/amazeui/amazeui
所属公司:云适配Star:6710
总结:Amaze UI总的来说加入更多符合中国市场特性的元素,框架对跨屏、适配都做了比较好的处理并且准备了一系列的常用网页组件,为减少搞兼容、适配各种敲键盘的加班狗们的工作时间做了不小的贡献。框架还对中文排版优化,兼容中国本土主流浏览器、轻量化,不仅适用于桌面端,更适合移动端。
Frozen UI
有段时间看到QQ瞬间高大上了,后来四处打听,原来QQ客服端也用了混合开发,其中QQ会员前端用的是Frozen UI,并且这套框架开源,欣喜若狂耐不住心里的寂寞直接上手试了一遍,初体验感觉基础样式效果简单色调清爽,有个比较活跃的社区所以组件什么的也比较丰富。
Github:https://github.com/frozenui/frozenui
官网:http://frozenui.github.io/
作者:QQVIP FD Team Star:1,067
总结:如果拿Frozen UI配合一些如APICloud用来做混合APP感觉就太酷了,或者原生的火鸡们拿去嵌套在应用中做前端开发,这个框架对android 2.3 +、ios 4.0 +做了兼容,或者拿来做Web App也是极好的选择,劣势的话从UI层面就可以看到了,谁让它是出生在QQ会员前端的呢。
WeUI
WeUI和FrozenUI都属于比较专一的框架,WeUI比FrozenUI更专一,话说连个官网都不搞,所有答疑都在gitHub Issues解决了,这个框架极其简单,体积当然就不用说了,模块也就7个左右,不过体量小做的却不错,口碑看star就够了,框架从16/1/23发版至今github star超过7K,不过也不排除用户没地方发泄所以都跑到git上来,哈哈。
Github:https://github.com/weui/weui
DEMO:http://weui.github.io/weui/
Star:7,129
总结:看完微信设计团队设计的这套DEMO,如果要做微信公众,这个二话不说必然是首选了。框架不好的地方简而言之就是框架本身应该就没考虑过让用户用到非微信的场景之下。
SUI
“SUI是一套基于bootstrap开发的前端组件库,同时它也是一套设计规范。通过SUI,可以非常方便的设计和实现精美的页面”。果然还是直接引用官方给的枯燥无味广告要节省自己的脑细胞(囧…),当然了就像广告说的,如果你之前用过Bootstrap,那么可以轻松转向SUI,这可能就是淘宝给前端屌丝们的福利了。
Github:https://github.com/sdc-alibaba/sui
官网:http://sui.taobao.org/sui/docs/index.html
Star:120
Semantic UI
倒数第三个是Semantic UI,接触这个框架还是因为Bootstrap,Semantic UI刚上线github就受到大量开发者的关注,以至于很多人拿它俩对比各种挑刺各种夸,是好是坏不能单凭别人三句四句就抬起手指开始赞,用了以后感觉UI上跟Bootstrap没太多的区别,不过代码命名规范上却相差甚大,本人认为Semantic UI是不是就想做的不一样,它的命名全是采用复合的方式,类名特别的离散,用的时候你得很小心自己扩展或者新增的class命名与它的类名冲突。
官网:http://www.semantic-ui.cn/
Github:https://github.com/semantic-org/semantic-ui/
Foundation
Foundation算是框架界的元老啦,都说框架去的早,而这个框架一直到现在依然这么的热门,如果你比较介意Bootstrap开发撞脸的尴尬事情,那么你可以考虑使用Foundation。即使你使用预定义的UI元素,也不会与其他网站太像,就像官方说的给开发者更灵活的框架体验。
官网:http://foundation.zurb.com/
Github:https://github.com/zurb/foundation-sites
Star:22,736
UiKit
UIkit是YOOtheme团队开发的,在许多WordPress主题中都有应用(也就是如果你是个WordPress爱好者,那么这个框架应该比较适合深究),并且框架能够通过GUI编辑器和手动编辑,所以它提供了一个灵活、强大的自定义机制。框架借助LESS、jQuery、normalize.css及FontAwesome开源项目的独有特点,整合成了这么一款轻量级、模块化的前端框架。
官网:http://www.getuikit.com/
Github:https://github.com/uikit/uikit
作者:YOOtheme Star:6,372
Pure
终于最后一个了,我和你一样好开森(~ ̄▽ ̄)~),这个框架是我在做管理系统时接触的,选择使用也是因为框架小巧,并且是纯CSS,没有太多的牵扯,好用来与其他框架快速结合使用。
官网:http://purecss.io/
Github:https://github.com/yahoo/pure/
Star:13,592
介绍完毕,估计你应该看出来了,我使用框架真的也就是遇到了需求,才选择了某个框架,所以框架之间并没有什么好与特好之分,只能说你的需求是什么,这个框架合适不合适你去用,各种框架用起来也都大致差不多,会用一个其他的上手也就都变得简单容易上手,我觉得能写框架的人都是室外高仁。
作者:攻城狮Right
转载自:http://www.jianshu.com/p/f066863d5507
相关推荐
「大锅乱炖10大H5前端框架」.docx
计算机二级公共基础知识模 拟试题及答案详解.pdf
内容概要:本文档详细介绍了语音发射机的设计与实现,涵盖了从硬件电路到具体元件的选择和连接方式。文档提供了详细的电路图,包括电源管理、信号处理、音频输入输出接口以及射频模块等关键部分。此外,还展示了各个引脚的功能定义及其与其他组件的连接关系,确保了系统的稳定性和高效性能。通过这份文档,读者可以全面了解语音发射机的工作原理和技术细节。 适合人群:对电子工程感兴趣的初学者、从事嵌入式系统开发的技术人员以及需要深入了解语音发射机制的专业人士。 使用场景及目标:适用于希望构建自己的语音发射设备的研究人员或爱好者,帮助他们掌握相关技术和实际操作技能。同时,也为教学机构提供了一个很好的案例研究材料。 其他说明:文档不仅限于理论讲解,还包括具体的实施步骤,使读者能够动手实践并验证所学知识。
内容概要:本文详细介绍了用易语言编写的单线程全功能注册机源码,涵盖了接码平台对接、滑块验证处理、IP代理管理以及料子导入等多个核心功能。文章首先展示了主框架的初始化配置和事件驱动逻辑,随后深入探讨了接码平台(如打码兔)的API调用及其返回数据的处理方法。对于滑块验证部分,作者分享了如何利用易语言的绘图功能模拟真实用户的操作轨迹,并提高了验证通过率。IP代理模块则实现了智能切换策略,确保代理的有效性和稳定性。此外,料子导入功能支持多种格式的数据解析和去重校验,防止脏数据污染。最后,文章提到了状态机设计用于控制注册流程的状态持久化。 适合人群:有一定编程基础,尤其是熟悉易语言的开发者和技术爱好者。 使用场景及目标:适用于希望深入了解易语言注册机开发的技术细节,掌握接码、滑块验证、IP代理等关键技术的应用场景。目标是帮助读者理解并优化现有注册机的功能,提高其稳定性和效率。 其他说明:文中提到的部分技术和实现方式可能存在一定的风险,请谨慎使用。同时,建议读者在合法合规的前提下进行相关开发和测试。
计算机绘图实用教程 第三章.pdf
计算机辅助设计—AutoCAD 2018中文版基础教程 各章CAD图纸及相关说明汇总.pdf
C++相关书籍,计算机相关书籍,linux相关及http等计算机学习、面试书籍。
计算机二级mysql数据库程序设计练习题(一).pdf
计算机发展史.pdf
计算机二级课件.pdf
计算机概论第三讲:计算机组成.pdf
内容概要:本文档由中国移动通信集团终端有限公司、北京邮电大学、中国信息通信研究院和中国通信学会共同发布,旨在探讨端侧算力网络(TCAN)的概念、架构、关键技术及其应用场景。文中详细分析了终端的发展现状、基本特征和发展趋势,阐述了端侧算力网络的定义、体系架构、功能架构及其主要特征。端侧算力网络通过整合海量泛在异构终端的算力资源,实现分布式多级端侧算力资源的高效利用,提升网络整体资源利用率和服务质量。关键技术涵盖层次化端算力感知图模型、资源虚拟化、数据压缩、多粒度多层次算力调度、现场级AI推理和算力定价机制。此外,还探讨了端侧算力网络在智能家居、智能医疗、车联网、智慧教育和智慧农业等领域的潜在应用场景。 适合人群:从事通信网络、物联网、边缘计算等领域研究和开发的专业人士,以及对6G网络和端侧算力网络感兴趣的学者和从业者。 使用场景及目标:适用于希望深入了解端侧算力网络技术原理、架构设计和应用场景的读者。目标是帮助读者掌握端侧算力网络的核心技术,理解其在不同行业的应用潜力,推动端侧算力网络技术的商业化和产业化。 其他说明:本文档不仅提供了端侧算力网络的技术细节,还对其隐私与安全进行了深入探讨
学习java的心得体会.docx
计算机二级考试(南开100题齐全).pdf
内容概要:本文详细介绍了计算机二级C语言考试的内容和备考方法。首先概述了计算机二级考试的意义及其在计算机技能认证中的重要性,重点讲解了C语言的基础语法,包括程序结构、数据类型、运算符和表达式等。接着深入探讨了进阶知识,如函数、数组、指针、结构体和共用体的应用。最后分享了针对选择题、填空题和编程题的具体解题技巧,强调了复习方法和实战演练的重要性。 适合人群:准备参加计算机二级C语言考试的学生和技术爱好者。 使用场景及目标:①帮助考生系统地掌握C语言的核心知识点;②提供有效的解题策略,提高应试能力;③指导考生制定合理的复习计划,增强实战经验。 其他说明:本文不仅涵盖了理论知识,还提供了大量实例代码和详细的解释,有助于读者更好地理解和应用所学内容。此外,文中提到的解题技巧和复习建议对实际编程也有很大帮助。
论文格式及要求.doc
内容概要:本文详细介绍了如何使用三菱FX3U PLC及其485BD通信板与四台台达VFD-M系列变频器进行通信的设置与应用。主要内容涵盖硬件连接注意事项、通信参数配置、RS指令的应用、CRC校验算法的实现以及频率给定和状态读取的具体方法。文中提供了多个实用的编程示例,展示了如何通过梯形图和结构化文本编写通信程序,并讨论了常见的调试技巧和优化建议。此外,还提到了系统的扩展性和稳定性措施,如增加温度传感器通信功能和应对电磁干扰的方法。 适合人群:从事工业自动化领域的工程师和技术人员,尤其是那些熟悉三菱PLC和台达变频器的使用者。 使用场景及目标:适用于需要实现多台变频器联动控制的工业应用场景,旨在提高生产效率和系统可靠性。通过学习本文,读者可以掌握如何构建稳定的RS485通信网络,确保变频器之间的高效协同工作。 其他说明:本文不仅提供了详细的理论指导,还包括了许多来自实际项目的经验教训,帮助读者避免常见错误并提升编程技能。
计算机服务规范.pdf
Discuz_X3.2_TC_UTF8.zip LNMP搭建安装包
2023年房地产行业研究报告:缓解竣工下行加速的两大改革