前言
Vue 是一個(gè)非常有吸引力的構(gòu)建前端的框架,它已迅速成為 React 和 Angular 等其他流行框架的替代品。它很敏捷速度很快,編寫的代碼容易閱讀和理解肄满,很有樂趣。它對(duì)初學(xué)者很友好质涛,同時(shí)還提供了構(gòu)建復(fù)雜應(yīng)用和網(wǎng)站所需的基礎(chǔ)套件稠歉。這對(duì)于個(gè)人開發(fā)者來說非常棒,同時(shí)也可以在大型團(tuán)隊(duì)中很好地進(jìn)行協(xié)作開發(fā)汇陆。
為什么 Vue 在 WordPress 項(xiàng)目中可以非常出色
不論是為 WordPress 開發(fā)小巧實(shí)用的功能還是開發(fā)一個(gè)完整的主題怒炸,Vue.js 都是一個(gè)合適的解決方案,因?yàn)樗茌p量毡代。Vue 使用易于理解的 HTML 模板阅羹。與其他一些框架不同,你不需要額外的工具即可開始使用教寂。不需要使用webpack捏鱼,Node.js 或其他配置就可以在網(wǎng)頁上引入 Vue 并開始創(chuàng)建組件,而且性能沒有任何明顯下降酪耕。只有當(dāng)你想要將開發(fā)方法提升一個(gè)層次時(shí)导梆,才需要這些工具。
Vue 在構(gòu)建用戶界面上也更有優(yōu)勢(shì)迂烁。如果你只是使用純 JavaScript 或 jQuery看尼,Vue 將幫助你提高效率,減少繁瑣的代碼婚被。相比之下狡忙,一些更復(fù)雜的工具有更高的進(jìn)入門檻,比如 React 和 Angular 這些址芯。在 Vue 中使用 CSS 和動(dòng)畫效果也更容易。通過 Vue 的“單文件組件”,你可以輕松地的把屬于同一組件的不同部分合理組織的起來; JavaScript代碼谷炸、HTML模板和 CSS 都寫在同一個(gè)文件中北专,組件的不同部分保持相互獨(dú)立。如果你已經(jīng)掌握了JavaScript, HTML, CSS 中的任何一種旬陡,那么使用 Vue 可能會(huì)感覺更舒暢拓颓,在其他框架中編寫類似組件的體驗(yàn)可能就并沒有這么好了。
Vue 的另一個(gè)好處是描孟,通過眾多的插件來對(duì) Vue 進(jìn)行擴(kuò)展補(bǔ)充也很容易驶睦。狀態(tài)管理有Vuex,路由管理有 vue-router匿醒,vue-resource 處理 Web 請(qǐng)求方面提供很多幫助场航。不必?zé)o休止地研究和比較不同的第三方項(xiàng)目的優(yōu)缺點(diǎn),例如 Reac t生態(tài)系統(tǒng)中的情況(這也是React更龐大的生態(tài)系統(tǒng)的缺點(diǎn))廉羔。
學(xué)習(xí)Vue和相關(guān)插件的教程
在線文檔:
Guide to Vue.js??官網(wǎng)必讀手冊(cè)
Vuex是什么溉痢???官網(wǎng)文檔
視頻教程:
Learn Vue2: Step by Steplaracasts上的視頻教程,初級(jí)部分是免費(fèi)的.
Vue.js 2 – Getting Started?是 Maxedapps 在 Youtube 上的免費(fèi)視頻系列教程憋他。他在Udemy也有付費(fèi)課程孩饼,Maximilian Schwarzmüller講授的課程?非常有價(jià)值,
Vue.js 2.0 in 60 minutesTraversy Media的最新版教程。這個(gè)頻道也有點(diǎn)意思:
Traversy 本人是一個(gè)有社交恐懼癥的胖子竹挡,工作了很久之后決定從頭開始學(xué)習(xí)編程镀娶,并成功的成為一個(gè)自由職業(yè)程序員。他很感激編程這門技術(shù)給他帶來的一切揪罕,所以他也在油管上教授其他人編程汽畴。
他的特點(diǎn)是及其高產(chǎn),零基礎(chǔ)耸序,語速適中忍些,口齒清晰俊柔×铰可以說是對(duì)非英語母語的人來說非常友好。
他的課程都是有始有終搭独,始終把聽眾當(dāng)作零基礎(chǔ)搅窿,所以有大量的從零開始課程(Crash Course), 配合上其適合非母語人士的語速和語音嘁酿,絕對(duì)是國人想在油管上學(xué)習(xí)編程的首選。
頻道的課程涉獵非常廣男应,但主要集中在前端闹司。對(duì)于現(xiàn)在流行的網(wǎng)絡(luò)應(yīng)用編程再合適不過了。
Traversy 的油管頻道的內(nèi)容整理得非常清晰沐飘,強(qiáng)烈建議按照播放列表來收看游桩。如果是完全在編程所有方面都是零基礎(chǔ)的牲迫,還希望對(duì)前端有些了解的,強(qiáng)烈建議從 HTML & CSS這個(gè)播放列表看起借卧。然后盹憎,他每年都會(huì)發(fā)一篇關(guān)于這一年學(xué)習(xí)編程語言的方法和語言的選擇的建議視頻,搜索年份號(hào)碼就能找到了铐刘,可以作為自己學(xué)習(xí)計(jì)劃很好的參考陪每。
還有其他頻道介紹可以看這里:
那些油管上高質(zhì)量的學(xué)習(xí)編程的頻道 之一
那些油管上高質(zhì)量的學(xué)習(xí)編程的頻道 之二
圖書:
這兩本評(píng)價(jià)都挺高,有能力的小伙伴可以買來看看
Vue.js 2 Cookbook: Build modern, interactive web applications with Vue.js (English Edition)
?
WordPress的教程資源
Vue usage in WordPress.?作者 Paulund 镰吵,用Vue開發(fā)WordPress主題的一系列文章檩禾,寫的很棒,網(wǎng)站也很簡潔大方
how to work with Vue & the REST API. 作者 Josh Pollock 疤祭,把 Vue 和 WordPress 的API結(jié)合實(shí)用的教程
Vue inside of the admin while taking advantage of ES6?同上
how to create a Vue plugin??作者 Ramsay Lanier, 關(guān)于怎樣寫Vue插件
一些Vue和WordPress結(jié)合的項(xiàng)目
experiment for Gutenberg用Vue替代WordPress里的React
offline-first SPA using Vue.js, the WordPress REST API and Progressive Web Apps.?Vue結(jié)合WordPress構(gòu)建單面應(yīng)用
Wyvern provides WordPress theme boiler plate用Vue開發(fā)WordPress主題的腳手架項(xiàng)目
Vue Theme用Vue開發(fā)的WordPress主題. 已經(jīng)不更新了
WordVue一個(gè)用 Vue 開發(fā) WordPress 主題的入門項(xiàng)目
One more thing
就像前文說的盼产,如果你只是出于興趣想在個(gè)人項(xiàng)目中玩玩 Vue + WordPress,那么其實(shí)用過不到Webpack等一系列的重型武器画株,直接引入Vue.js 就可以辆飘,即使用了也不用鉆的太深,基本上直接引用Vue提供的官方配置就行了谓传。如果你想在前端開發(fā)水平上一個(gè)層次蜈项,后者在公司項(xiàng)目里使用,那么絕對(duì)要學(xué)好Webpack了续挟。 Webpack 目前無論在求職還是工作中紧卒,使用越來越普及。而想要學(xué)懂诗祸,學(xué)會(huì)Webpack更絕非易事跑芳。推薦你慕課網(wǎng)這門課,《從基礎(chǔ)到實(shí)戰(zhàn) 手把手帶你掌握新版Webpack4》直颅,融合技能+項(xiàng)目+思想 講解前端開發(fā)必學(xué)的Webpack博个,值得花錢好好學(xué)一下。本課程完整講清最新版本下的 Webpack 4 知識(shí)體系功偿,通過 基礎(chǔ) + 實(shí)例 + 原理代碼編寫 + 復(fù)雜案例分析 完成Webpack4的分析與講解盆佣。更重要的是讓你對(duì)整個(gè)前端項(xiàng)目的構(gòu)建有一個(gè)全局化的認(rèn)識(shí),實(shí)現(xiàn)能力思想雙升級(jí)械荷。
轉(zhuǎn)自:丘壑博客?bestscreenshot.com