前端常用的框架都有哪些？

Posted 2023-04-07

参考技术A web前端的主流框架，下面，我给大家具体介绍一下：

1.Angular:Angular是一个优秀的前端JS框架。Angular有很多特性，核心是MVW(Model-View-Whatever)、模块化、自动双向数据绑定、语义标注、依赖注入等。Angular是一个比较完整的前端框架，包含了服务、模板、双向数据绑定、模块化、路由、过滤器、依赖注入等所有功能。自定义指令后可以在项目中多次使用。

2.React:React可以非常容易地创建用户界面。为应用程序的每个状态设计简洁的视图，React还可以在数据发生变化时高效地更新渲染界面。React为你的程序编写独立的模块化UI组件，这样当一个或一些组件出现问题时，可以很容易地隔离出来。

3.Vue:最近几年最火的前端框架是Vue.js，这是一个构建数据驱动Web界面的渐进式框架。Vue.js的目标是通过尽可能简单的API实现响应和组合视图组件的数据绑定。Vue是模块友好的，可以通过NPM、鲍尔或Duo安装。它不会强制你所有的代码都遵循Angular的各种规定，使用场景更加灵活。

以上三个是我给大家介绍的web前端主流框架。希望我的回答对你有帮助。

网页前端常用的库或框架都有哪些

bootstrap是twitter出的一款不错的UI框架，或者与其说是框架不如说是类库（lib），当然这里边牵扯到一个“究竟什么是框架什么是类库？”的问题，我们暂时不谈。毕竟是有大公司背景的代码堆，我觉得没什么“落伍”可言。
angular是前两年之内突然火得一塌糊涂的一个fe框架，这个我觉得可以算的上是真正意义上的框架了，MVVM双向绑定，包括它拥有足够完善的社区、生态，甚至chrome上都有很多好用的相关插件（这一点可以说是占了google出品的光），比较完整的大型项目都是可以考虑引入的。但如果你的网站只是做一些轻量级的东西，杀鸡焉用宰牛刀吧我觉得。
backbone主要针对的MVC中的M层，至少我是这么理解的。对UI层它几乎没什么太多的限制，一方面给出了coder自由度进行发挥，另一方面也等于在这方面框架本身对开发没提供什么太大的帮助。我觉得这更像是一个高手向的框架，另外对于underscore前端模板那一套东西，说实话作为一名php java啥都能写的FE我始终觉得这套东西有那么一种纯JS工程师的一厢情愿的意味。这是个人看法了，不一定准确，况且有人会搬出ajax动态渲染时 前端模板的作用来反驳我，别急着反驳，至少往下看完我说的话。
相比之下，react可以说是一个在MVC中V层做的十分出色和新颖的框架了，独特的jsx编译机制就已经让你的代码变得高大上了，我是觉得这个类库在UI层做的更彻底更专业，或者说让FE的代码更专业了。更何况，react比angular更年轻，而且同样拥有大公司背景，react native一出更是让JS工程师的地位取得了革命性的提升，（不要跟我提phonegap，用过两个东西后你会明白，react打包的app性能甩phonegap几条街没问题）。另外既然楼主提到了之前的网站是bootstrap，不妨可以看一看react-bootstrap这个东西，或许这就是你想要的。 参考技术A 对于初学Web前端的人来说，首先需要了解一些前端开发中的工具，有利于提升开发效率，在这里我们梳理一下目前比较常用的库，组件和构建工具。
前端UI库
1. Bootstrap
网址：https://www.bootcss.com/
Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 Web 项目。Bootstrap支持响应式布局设计，让一个网站可以兼容不同分辨率的设备，给用户提供更好的视觉体验。友好的学习曲线，卓越的兼容性，响应式设计等都是bootstrap的优点。
2. ElementUI
网址：https://element.eleme.cn/#/
Element，一套为开发者、设计师和产品经理准备的基于Vue 2.0的桌面端组件库。可以很好的搭配vue来进行项目的开发，提供了很多风格统一美观的组件。
3. Antd Design
网址：https://ant.design/index-cn
antd 是基于 Ant Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。封装了很多开箱即用的react组件，提炼自企业级中后台产品的交互语言和视觉风格，并使用Typescript开发，提供完整的类型定义文件。
构建工具
1. Webpack
网址： https://www.webpackjs.com/
webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。
在webpack看来一切都是模块!这就是它不可不说的优点，包括你的JavaScript代码，也包括CSS和fonts以及图片等等等，只有通过合适的loaders，它们都可以被当做模块被处理。
2. Gulp
网址：https://www.gulpjs.com.cn/
gulp是一个自动化工具，前端开发者可以使用它来处理常见任务，如搭建web服务器，热加载，使用预处理器sass，less，优化资源压缩css,javascript，图片等。另外gulp基于node强大的流(stream)能力，gulp在构建过程中并不把文件立即写入磁盘，从而提高了构建速度。
可视化组件
1. Echarts
网址：https://echarts.apache.org/zh/index.html
ECharts，一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器(IE8/9/10/11，Chrome，Firefox，Safari等)，底层依赖矢量图形库 ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。
2. HighCharts
网址：https://www.highcharts.com.cn/
方便快捷的纯 JavaScript 交互性图表，Highcharts 已经被成千上万的开发者及 72 个全球100强企业使用，是目前是市面上最简单灵活的图表库。