‘壹’ 号称目前最火的前端框架Vue，它有什么显着特点呢
1、Vue是什么- Vue.js 是目前最火的一个前端框架，除了可以开发网站，还可以开发手机App。
- Vue.js 是前端的主流框架之一，和Angular.js、React.js 一起，并成为前端三大主流框架。
- Vue.js 是一套构建用户界面的框架，只关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合。
- Vue.js 是一套用于构建用户界面的渐进式框架。
- 遵循 MVVM 模式
- 编码简洁，体积小，运行效率高，适合移动/PC 端开发
- 它本身只关注 UI, 可以轻松引入 vue 插件或其它第三库开发项目
总结一句话：不要在想着怎么操作DOM，而是想着如何操作数据!!
‘贰’ 前端中的Vue是什么
Vue.js 是一个JavaScriptMVVM库，是一套构建用户界面的渐进式框架。它是以数据驱动和组件化的思想构建的，采用自底向上增量开发的设计。相比于Angular.js，Vue.js提供了更加简洁、更易于理解的API，使得我们能够快速地上手并使用Vue.js；同时比起 React + Rex 相对复杂的架构，Vue.js 更加轻量级也更加容易上手，是初创项目的首选前端框架。Vue 的核心库只关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合。
Vue.js是一个构建数据驱动的 web 界面的渐进式框架，是一个JavaScript MVVM库。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。
为什么？
1、文档好
2、简单
3、更新快
4、开发效率高
5、能大能小 能上能下
6、开始学习成本低
7、支持组件化，也就是可以将页面封装成若干个组件，采用积木式进行编程
以上回答希望对你有所帮助
‘叁’ 用的最多的前端框架
如今的前端已经不再像以前一样就是简单的写写页面和调调样式而已，现在的前端越来越复杂，知识点越来越丰富。
要做WEB前端，就需要知道前端到底是什么，需要学习那些知识；前端至少要懂的三个部分：HTML，CSS，JavaScript（简称JS），那首先先明确这三个概念：
HTML负责结构，网页想要表达的内容由html书写。
CSS负责样式，网页的美与丑由它来控制
JS负责交互，用户和网页产生的互动由它来控制。
web前端发展至今，演变出了无数的库和框架；说到库第一时间想到的是不是jquery？在小编刚接触库的时候也是从jQuery开始的；今天我们就来说说前端发展到现在都有哪些好用的库框架；
1.Bootstrap中文网
近几年最火的前端框架当属Vue.js了，Vue.js是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。很多使用过vue的程序员这样评价它，“vue.js兼具angular.js和react.js的优点，并剔除了它们的缺点”。
‘肆’ VUE在前端里面主要是做什么的呢
Vue是一个js框架。什么叫框架？个人理解是对原生JS ，html,css的功能进行封装之后形成的一个语言。
比如，你需要盖一座房子，你用原生js，html，css写代码相当于你用手一块砖一块砖地垒。而使用Vue，Vue已经给你了一面墙，一根房梁，一扇门，你需要做的是把门墙梁拼成房子。它帮助你提高开发效率。你只需要按照它的规矩来写三段部分：<template>、<script>、<style>就能完成平时html、css、js的功能。页面视图展示，前后数据交互都完成了。
之后使用webpack等工具，会将vue语法转换为html,js,css。
其实使用Vue开发和原生html,css,js开发步骤逻辑是一样的。
除此之外，vue还有动态绑定，数据驱动等等特点，这些都是题外话。我相信我的回答已经解决了你的问题，如果感觉有帮助，请采纳我的答案。
‘伍’ 如何用 Vue 实现前端
前端权限控制并不是新生事物，早在后端 MVC 时代，web 系统中就已经普遍存在对按钮和菜单的显示 / 隐藏控制，只不过当时它们是由后端程序员在 jsp 或者 php 模板中实现的。
随着前后端分离架构的流行，前后端以接口为界实现开发解耦，权限控制也一分为二，前端权限控制的所有权才真正回到了前端。
可能有的同学会想，前后端分别做一套控制，是不是将事情复杂化了，而且从根本上讲前端没有秘密，后端才是权限的关键，那是不是只在后端做控制就可以了。
‘陆’ Vue在前端开发中需要注意什么
基于Vue官方风格指南整理
一、强制
1. 组件名为多个单词
组件名应该始终是多个单词的，根组件 App 除外。
正例：
export default {
name: 'TodoItem',
// ...
}
反例：
export default {
name: 'Todo',
// ...
}
2. 组件数据
组件的 data 必须是一个函数。
当在组件中使用 data 属性的时候 (除了 new Vue 外的任何地方)，它的值必须是返回一个对象的函数。
正例：
// In a .vue file
export default {
data () {
return {
foo: 'bar'
}
}
}
// 在一个 Vue 的根实例上直接使用对象是可以的，
// 因为只存在一个这样的实例。
new Vue({
data: {
foo: 'bar'
}
})
反例：
export default {
data: {
foo: 'bar'
}
}
3. Prop定义
Prop 定义应该尽量详细。
在你提交的代码中，prop 的定义应该尽量详细，至少需要指定其类型。
正例：
props: {
status: String
}
// 更好的做法！
props: {
status: {
type: String,
required: true,
validator: function (value) {
return [
'syncing',
'synced',
'version-conflict',
'error'
].indexOf(value) !== -1
}
}
}
反例：
// 这样做只有开发原型系统时可以接受
props: ['status']
4. 为v-for设置键值
总是用 key 配合 v-for。
在组件上_总是_必须用 key 配合 v-for，以便维护内部组件及其子树的状态。甚至在元素上维护可预测的行为，比如动画中的对象固化 (object constancy)，也是一种好的做法。
正例：
<ul>
<li
v-for="todo in todos"
:key="todo.id"
>
{{ todo.text }}
</li>
</ul>
反例：
<ul>
<li v-for="todo in todos">
{{ todo.text }}
</li>
</ul>
5.避免 v-if 和 v-for 用在一起
永远不要把 v-if 和 v-for 同时用在同一个元素上。
一般我们在两种常见的情况下会倾向于这样做：
为了过滤一个列表中的项目 (比如 v-for="user in users" v-if="user.isActive")。在这种情形下，请将 users 替换为一个计算属性 (比如 activeUsers)，让其返回过滤后的列表。
为了避免渲染本应该被隐藏的列表 (比如 v-for="user in users" v-if="shouldShowUsers")。这种情形下，请将 v-if 移动至容器元素上 (比如 ul, ol)。
正例：
<ul v-if="shouldShowUsers">
<li
v-for="user in users"
:key="user.id"
>
{{ user.name }}
</li>
</ul>
反例：
<ul>
<li
v-for="user in users"
v-if="shouldShowUsers"
:key="user.id"
>
{{ user.name }}
</li>
</ul>
6. 为组件样式设置作用域
对于应用来说，顶级 App 组件和布局组件中的样式可以是全局的，但是其它所有组件都应该是有作用域的。
这条规则只和单文件组件有关。你不一定要使用 scoped 特性。设置作用域也可以通过 CSS Moles，那是一个基于 class 的类似 BEM 的策略，当然你也可以使用其它的库或约定。
不管怎样，对于组件库，我们应该更倾向于选用基于 class 的策略而不是 scoped 特性。
这让覆写内部样式更容易：使用了常人可理解的 class 名称且没有太高的选择器优先级，而且不太会导致冲突。
正例：
<template>
<button class="c-Button c-Button--close">X</button>
</template>
<!-- 使用 BEM 约定 -->
<style>
.c-Button {
border: none;
border-radius: 2px;
}
.c-Button--close {
background-color: red;
}
</style>
反例：
<template>
<button class="btn btn-close">X</button>
</template>
<style>
.btn-close {
background-color: red;
}
</style>
<template>
<button class="button button-close">X</button>
</template>
<!-- 使用 `scoped` 特性 -->
<style scoped>
.button {
border: none;
border-radius: 2px;
}
.button-close {
background-color: red;
}
</style>
二、强烈推荐（增强可读性）
1. 组件文件
只要有能够拼接文件的构建系统，就把每个组件单独分成文件。
当你需要编辑一个组件或查阅一个组件的用法时，可以更快速的找到它。
正例：
components/
|- TodoList.vue
|- TodoItem.vue
反例：
V
ue.component('TodoList', {
// ...
})
Vue.component('TodoItem', {
// ...
})
2. 单文件组件文件的大小写
单文件组件的文件名应该要么始终是单词大写开头 (PascalCase)
正例：
components/
|- MyComponent.vue
反例：
components/
|- myComponent.vue
|- mycomponent.vue
3. 基础组件名
应用特定样式和约定的基础组件 (也就是展示类的、无逻辑的或无状态的组件) 应该全部以一个特定的前缀开头，比如 Base、App 或 V。
正例：
components/
|- BaseButton.vue
|- BaseTable.vue
|- BaseIcon.vue
反例：
components/
|- MyButton.vue
|- VueTable.vue
|- Icon.vue
4. 单例组件名
只应该拥有单个活跃实例的组件应该以 The 前缀命名，以示其唯一性。
这不意味着组件只可用于一个单页面，而是每个页面只使用一次。这些组件永远不接受任何 prop，因为它们是为你的应用定制的，而不是它们在你的应用中的上下文。如果你发现有必要添加 prop，那就表明这实际上是一个可复用的组件，只是目前在每个页面里只使用一次。
正例：
components/
|- TheHeading.vue
|- TheSidebar.vue
反例：
components/
|- Heading.vue
|- MySidebar.vue
5. 紧密耦合的组件名
和父组件紧密耦合的子组件应该以父组件名作为前缀命名。
如果一个组件只在某个父组件的场景下有意义，这层关系应该体现在其名字上。因为编辑器通常会按字母顺序组织文件，所以这样做可以把相关联的文件排在一起。
正例：
components/
|- TodoList.vue
|- TodoListItem.vue
|- TodoListItemButton.vue
components/
|- SearchSidebar.vue
|- SearchSidebarNavigation.vue
反例：
components/
|- SearchSidebar.vue
|- NavigationForSearchSidebar.vue
6. 组件名中的单词顺序
组件名应该以高级别的 (通常是一般化描述的) 单词开头，以描述性的修饰词结尾。
正例：
components/
|- SearchButtonClear.vue
|- SearchButtonRun.vue
|- SearchInputQuery.vue
|- SearchInputExcludeGlob.vue
|- SettingsCheckboxTerms.vue
|- .vue
反例：
components/
|- ClearSearchButton.vue
|- ExcludeFromSearchInput.vue
|- LaunchOnStartupCheckbox.vue
|- RunSearchButton.vue
|- SearchInput.vue
|- TermsCheckbox.vue
7. 模板中的组件名大小写
总是 PascalCase 的
正例：
<!-- 在单文件组件和字符串模板中 -->
<MyComponent/>
反例：
<!-- 在单文件组件和字符串模板中 -->
<mycomponent/>
<!-- 在单文件组件和字符串模板中 -->
<myComponent/>
8. 完整单词的组件名
组件名应该倾向于完整单词而不是缩写。
正例：
components/
|- StudentDashboardSettings.vue
|- UserProfileOptions.vue
反例：
components/
|- SdSettings.vue
|- UProfOpts.vue
9. 多个特性的元素
多个特性的元素应该分多行撰写，每个特性一行。
正例：
<img
src="htorg/images/logo.png"
alt="Vue Logo"
>
<MyComponent
foo="a"
bar="b"
baz="c"
/>
反例：
<img src="h/logo.png" alt="Vue Logo">
<MyComponent foo="a" bar="b" baz="c"/>
10. 模板中简单的表达式
组件模板应该只包含简单的表达式，复杂的表达式则应该重构为计算属性或方法。
复杂表达式会让你的模板变得不那么声明式。我们应该尽量描述应该出现的是什么，而非如何计算那个值。而且计算属性和方法使得代码可以重用。
‘柒’ Vue框架为什么得到了前端程序员很高的评价
很多使用过vue的程序员这样评价它，“vue.js兼具angular.js和react.js的优点，并剔除了它们的缺点”。授予了这么高的评价的vue.js，也是开源世界华人的骄傲，因为它的作者是位中国人–尤雨溪（EvanYou）
如果你是一个已经在学习开发的初学者亦或是一名在代码界纵横多年的程序员，那你一定对前端不陌生。它不像其他编程语言那样晦涩难懂，可以做到“所见即所得”，或许这也是很多初学者选择前端的原因之一。昨天在刷微博的时候，看到了这样一个观点，说前端开发的vue.js很有趣，然后今天就准备和大家聊聊这个“有趣”的前端框架—Vue。
Vue的优势
1）Vue确实小而美，开发体验非常好。Vue 的核心库只关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与单文件组件和 Vue 生态系统支持的库结合使用时，Vue 也完全能够为复杂的单页应用程序提供驱动。
2）Vue 不支持 IE8 及以下版本，因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性，这可能算是一个小的不完美，但它支持所有兼容ECMAScript 5的浏览器。
3）在 Vue 里，一个组件本质上是一个拥有预定义选项的一个Vue 实例。在 Vue 中注册组件很简单，也是它的一大优势。
Vue的应用
1）Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统。Vue的使用非常的简单，创建一个本地的 .html 文件，然后通过如下方式引入Vue：
这样， 我们就已经成功创建了第一个 Vue 应用！
2）现在有很多大公司都在使用Vue
饿了么，有越来越多的项目在使用 vue。这些项目里面，有桌面端（比如饿了么安全应急响应中心）也有移动端（比如饿了么招聘），有面向用户的，也有后台系统。
掘金，全网都是用 Vue.js + Webpack 实现的，算是一个纯前端应用。
苏宁易购，触屏版的购物车结算页面已经用 Vue 重构，在众多框架中还是选择了 Vue，主要还是因为 API 比较友好，体验上也流畅了。
据不完全统计，包括美团、天猫、Laravel、htmlBurger等国内外知名大公司都在使用vue进行新项目的开发和旧项目的前端重构工作。
你会用吗？
1）对于前端初学者不建议学习，一门语言的入门一定是从基础语法开始的，掌握了基本知识，才能更加灵活的使用框架，为之后的工作打下良好的基础。
2）在熟练掌握了基础之后，建议个人可以用vue。练练手，为后续大项目做技术储备。已经在从事前端开发的小伙伴们也可以多接触，多学习些。
3）招聘网站搜索来的薪资，部分截图给大家看下
现在学习还不晚哟~
‘捌’ Web前端常用的主流框架汇总
今天小编要跟大家分享的文章是关于Web前端常用的主流框架汇总。本文将带大家大家熟悉前端中的7种框架。在了解框架之前，大家至少要知道前端中的这三个部分：HTML，CSS，JavaScript。
HTML：负责结构，网页想要表达的内容由HTML书写
HTML(超文本标记语言——HyperTextMarkupLanguage)是构成Web
世界的基石。HTML是一种基础技术，常与CSS、JavaScript一起被众多网站用于设计令人赏心悦目的网页、网页应用程序以及移动应用程序的用户界面。
CSS:负责样式，网页的美与丑由它来控制
层叠样式表(英文全称：CascadingStyle
Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
JavaScript:负责交互，用户和网页产生的互动由它来控制
一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML(标准通用标记语言下的一个应用)网页上使用，用来给HTML网页增加动态功能。
Web前端发展至今，演变出了无数的库和框架;说到库第一时间想到的是不是jquery?今天我们就来说说前端发展到现在都有哪些好用的库框架，下面来和小编一起看一看吧!
框架一：Vue.js
近几年最火的前端框架当属Vue.js了，Vue.js是一个构建数据驱动的Web界面的渐进式框架。Vue.js的目标是通过尽可能简单的API
实现响应的数据绑定和组合的视图组件。很多使用过vue的程序员这样评价它，“vue.js兼具angular.js和react.js的优点，并剔除了它们的缺点”。授予了这么高的评价的vue.js，也是开源世界华人的骄傲，因为它的作者是位中国人--尤雨溪。
框架二：Bootstrap
Bootstrap是让你的页面更简洁、直观、强悍、移动设备优先的前端开发框架,让Web开发更迅速、更简单。它还提供了更优雅的HTML和CSS规范，它是由动态CSS语言Less写成。有着丰富的网格布局系统以及丰富的可重用组件，还有强大的支持的JavaScript、jQuery插件以及组件定制等。
框架三：Layui
Layui是一款口碑极佳的Web弹层组件，是一款采用自身模块规范编写的前端UI框架，遵循原生HTML/CSS/JS
的书写与组织形式，门槛极低，拿来即用。Layui首个版本发布于2016年秋，它区别于那些基于MVVM底层的UI框架，从核心代码到API
的每一处细节都经过精心雕琢，非常适合界面的快速开发。
框架四：Element-UI
Element-Ul是饿了么前端团队推出的一款基于Vue.js2.0的桌面端UI框架，手机端有对应框架是MintUI
。适合于Vue的UI框架。
框架五：MintUI
MintUI是由饿了么前端团队推出的一个基于Vue.js的移动端组件库，MintUI包含丰富的CSS和JS
组件，能够满足日常的移动端开发需要。通过它，可以快速构建出风格统一的页面，提升开发效率。
框架六：Angular
AngularJS诞生于2009年,由MiskoHevery
等人创建,后为Google所收购。是一款优秀的前端JS框架,已经被用于Google的多款产品当中。AngularJS有着诸多特性，最为核心的是MVW(Model-View-Whatever)、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。
框架七：React
React可以非常轻松地创建用户交互界面。为你应用的每一个状态设计简洁的视图,在数据改变时React
也可以高效地更新渲染界面。因为该公司对市场上所有JavaScriptMVC框架，都不满意，就决定自己写一套，用来架设Instagram
的网站。做出来以后，发现这套东西很好用，就在2013年5月开源了。
上面就是比较常用的7种Web前端主流框架，相信每个前端工程师都有接触过这几种库框架中的几种。
框架是一种约束，也是一种最佳实践。让你在团队开发中，不能怎么写，必须怎么写，推荐怎么写。而库是一种代码复用的方式，把某些代码段、函数、功能封装起来，你可以开箱即用。学会几种库框架，复杂的前端也会变得简单。
所以库框架的学习在前端中显得尤为重要，甚至决定你是否能拿到一个高薪水的工作。
以上就是小编今天为大家分享的关于Web前端常用的主流框架汇总的文章，希望本篇文章能够对正在从事web前端知识的小伙伴们有所帮助，想要了解更多web前端知识记得关注北大青鸟web培训官网，最后祝愿小伙伴们工作顺利，成为一名优秀的web前端工程师。