2019主流的前端框架

秒速五厘米 2022-02-23 12:52 356阅读 0赞

如今的前端已经不再像以前一样就是简单的写写页面和调调样式而已，现在的前端越来越复杂，知识点越来越丰富。

要做Web前端，就需要知道前端到底是什么，需要学习那些知识；前端至少要懂的三个部分：HTML，CSS，JavaScript（简称JS），那首先先明确这三个概念：

1.  HTML负责结构，网页想要表达的内容由html书写。
2.  CSS负责样式，网页的美与丑由它来控制。
3.  JS负责交互，用户和网页产生的互动由它来控制。

Web前端发展至今，演变出了无数的库和框架；说到库第一时间想到的是不是jquery？在小编刚接触库的时候也是从jQuery开始的；今天我们就来说说前端发展到现在都有哪些好用的库框架；  
**1.Bootstrap中文网**  
Bootstrap，让你的页面更简洁、直观、强悍、移动设备优先的前端开发框架,让web开发更迅速、更简单。它还提供了更优雅的HTML和CSS规范，它即是由动态CSS语言Less写成。有着丰富的网格布局系统以及丰富的可重用组件，还有强大的支持十几的JavaScript、jQuery插件以及组件定制等。  
Bootstrap中文网地址：[http://www.bootcss.com/][http_www.bootcss.com]

**2. Layui**  
layer是一款口碑极佳的web弹层组件，是一款采用自身模块规范编写的前端 UI 框架，遵循原生 HTML/CSS/JS 的书写与组织形式，门槛极低，拿来即用。layui 首个版本发布于2016年秋，她区别于那些基于 MVVM 底层的 UI 框架，从核心代码到 API 的每一处细节都经过精心雕琢，非常适合界面的快速开发。  
Layui官网地址：[https://www.layui.com/][https_www.layui.com]

**3.ElementUI**  
Element-Ul是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架，手机端有对应框架是Mint UI 。适合于Vue的UI框架；  
ElementUI官网地址：[http://element-cn.eleme.io/\#/zh-CN][http_element-cn.eleme.io_zh-CN]

**4.Mint UI**  
Mint UI 是 由饿了么前端团队推出的 一个基于 Vue.js 的移动端组件库，Mint UI 包含丰富的 CSS 和 JS 组件，能够满足日常的移动端开发需要。通过它，可以快速构建出风格统一的页面，提升开发效率。  
Mint UI官网地址：[http://mint-ui.github.io/][http_mint-ui.github.io]

**5.angular**  
Angular.js诞生于2009年,由Misko Hevery 等人创建,后为Google所收购。是一款优秀的前端JS框架,已经被用于Google的多款产品当中。AngularJS有着诸多特性，最为核心的是MVW（Model-View-Whatever）、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。  
Angular官网地址：[http://www.angularjs.net.cn/][http_www.angularjs.net.cn]

**6.React**  
React 可以非常轻松地创建用户交互界面。为你应用的每一个状态设计简洁的视图,在数据改变时 React 也可以高效地更新渲染界面。React 起源于 Facebook 的内部项目，因为该公司对市场上所有 JavaScript MVC 框架，都不满意，就决定自己写一套，用来架设Instagram 的网站。做出来以后，发现这套东西很好用，就在2013年5月开源了。  
React 官网地址：[http://react-china.org/][http_react-china.org]

**7.vue.js**  
Vue.js是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。很多使用过vue的程序员这样评价它，“vue.js兼具angular.js和react.js的优点，并剔除了它们的缺点”。  
Vue 官网地址：[https://cn.vuejs.org/][https_cn.vuejs.org]

[http_www.bootcss.com]: http://www.bootcss.com/
[https_www.layui.com]: https://www.layui.com/
[http_element-cn.eleme.io_zh-CN]: http://element-cn.eleme.io/#/zh-CN
[http_mint-ui.github.io]: http://mint-ui.github.io/
[http_www.angularjs.net.cn]: http://www.angularjs.net.cn/
[http_react-china.org]: http://react-china.org/
[https_cn.vuejs.org]: https://cn.vuejs.org/