Vue核心技術 Vue+Vue-Router+Vuex+SSR實戰精講
第1章 課程介紹
課程介紹,介紹課程的章節安排和學習本門課程的一些註意點。
1-1 課程導學 試看
1-2 項目介紹
1-3 Webpack4升級註意
第2章 Vue+Webpack的前端工程工作流搭建
詳細講解webpack的配置以及vue-loader,css-module等較為高級的內容如何進行配置。
2-1 項目目錄升級-一個正式項目的目錄結構
2-2 vue-loader配置
2-3 css module配置
2-4 安裝使用eslint和editorconfig以及precommit
2-5 Webpack4升級
第3章 Vue核心知識
從Vue的實例、生命周期、原生指令、數據綁定、特殊API和組件開發等角度詳細分析Vue的方方面面。並且深入講解Vue的組件開發,包括一些高級屬性slot、自定義雙向綁定、render function等。
3-1 一點小準備-單獨講解vue核心內容的配置
3-2 Vue實例
3-3 Vue的生命周期方法
3-4 Vue的數據綁定
3-5 computed和watch使用場景和方法
3-6 Vue的原生指令
3-7 Vue的組件之組件的定義
3-8 Vue的組件之組件的繼承.mp4
3-9 Vue的組件之自定義雙向綁定
3-10 Vue的組件之高級屬性
3-11 Vue的組件之render function
第4章 Vue-Router和Vuex
首先把Vue-Router和Vuex集成到項目開發當中。然後分別講解Vue-Router和Vuex的詳細使用方法和API,包括Router的配置,導航守衛,Vuex的配置,分模塊等。並實現了Vuex Store的熱更替功能。
4-1 Vue-router之集成
4-2 Vue-router之配置
4-3 Vue-router之路由參數傳遞
4-4 Vue-router之導航守衛
4-5 Vuex之集成
4-6 Vuex之state和getters
4-7 Vuex之mutation和action
4-8 Vuex之模塊
4-9 Vuex之其他一些API和配置
第5章 服務器渲染
在項目當中加入Node Server,同時集成服務端渲染。解決服務端渲染需要考慮的基礎問題,包括開發時如何跟webpack-dev-server配合,title信息的處理,正式環境的服務端渲染使用等。
5-1 開發時服務端渲染的配置和原理 試看
5-2 使用koa實現node server
5-3 服務端渲染的entry配置
5-4 開發時服務端渲染靜態資源路徑處理
5-5 使用vue-meta處理元信息
5-6 生產環境服務端渲染
第6章 高級組件開發
通過兩個高級組件:Notification和Tabs,講解一些只有在高級組件開發當中才會用到的開發技巧。比如通過extend繼承組件,通過一個js方法調用組件的顯示,以及嵌套組件父組件顯示子組件中的內容等。
6-1 notification之基本組件實現
6-2 notification之通過方法調用
6-3 notification之優化
6-4 tabs組件之基本組件實現
6-5 tabs組件之選中狀態和切換
6-6 tabs組件之在父組件中渲染子組件的slot
第7章 項目開發
首先開發服務端的API接口,然後進行前後端的接口聯調,登錄頁面的實現,以及最後調整服務端渲染的代碼,讓服務端渲染的時候用到的數據可以在客戶端重用。
7-1 服務端api請求基礎實現
7-2 數據API實現
7-3 後端登錄接口實現以及session的使用.mp4
7-4 登錄頁面實現
7-5 聯調第一個API
7-6 請求錯誤處理和登錄接口聯調
7-7 所有接口進行聯調
7-8 在數據請求的時候使用全局loading
7-9 在服務端渲染時獲取數據 試看
7-10 前後端數據復用以及服務端用戶認證
7-11 服務端渲染進行redirect操作
7-12 createRenderer的方式進行服務端渲染
7-13 正式環境打包以及異步模塊打包優化
第8章 部署和總結
通過PM2在服務器上部署項目應用,並自動化把靜態資源部署到七牛CDN上面。同時使用nginx配置讓應用可以通過域名訪問。最後總結課程內容。
8-1 pm2使用以及服務器端部署
8-2 靜態資源上傳cdn
8-3 總結
下載地址:百度網盤下載
Vue核心技術 Vue+Vue-Router+Vuex+SSR實戰精講