『壹』 號稱目前最火的前端框架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前端工程師。