1. 程式人生 > >Vue2.0+Node.js+MongoDB 全棧打造商城系統

Vue2.0+Node.js+MongoDB 全棧打造商城系統

第1章 課程介紹
簡單回顧前端近幾年的框架模式,瞭解不同時期下的框架特點。其次介紹Vue框架的背景和核心思想,以及同其它MV*框架的對比。
1-1 課程-導學
1-2 前端框架回顧
1-3 vue概況以及核心思想
1-4 vue框架優缺點對比

第2章 Vue基礎
從0到1,如何搭建一個簡單的Vue專案;本章節主要講解Node和Npm環境的搭建,其次介紹vue-cli腳手架的使用,以及通過詳細拆解介紹腳手架生成的配置檔案資訊,最後給大家介紹了Vue涵蓋的基礎語法。
2-1 nodejs和npm的安裝和環境搭建
2-2 vue環境搭建以及vue-cli使用
2-3 vue配置(上)
2-4 vue配置(下)
2-5 vue基礎語法

第3章 Vue-router
主要介紹4種路由的使用方式,主要包括動態路由、巢狀路由、程式設計式路由以及命名路由。
3-1 路由基礎介紹
3-2 動態路由匹配
3-3 巢狀路由
3-4 程式設計式路由
3-5 命名路由和命名檢視

第4章 Vue-resource/Axios
主要介紹非同步請求外掛,對Vue Resource以及Axios等兩種主流外掛進行講解,主要的功能包括GET、POST、JSONP、全域性攔截器(interceptors)、全域性路徑(root)等知識點。
4-1 Vue-Resource使用(上)
4-2 Vue-Resource使用(下)
4-3 axios基礎介紹

第5章 ES6常用語法
介紹當下比較熱門而且未來非常重要的一項新技術標準ES6。會根據目前專案所用到的常用語法進行講解,主要以滿足大眾專案為主,同時也會講解AMD、CMD、CommonJS和ES6差異,對專案的模組化會有更深的理解。
5-1 ES6簡介
5-2 ES6常用命令
5-3 拓展引數講解
5-4 Promise講解
5-5 ES6模組化開發講解
5-6 AMD、CMD、CommonJS和ES6差異

第6章 商品列表模組實現
講解商品列表的整體佈局和元件拆分,根據mock資料實現商品列表資料渲染功能,最後給大家介紹圖片懶載入外掛以及價格過濾。
6-1 商品列表元件拆分
6-2 商品列表資料渲染實現
6-3 實現圖片懶載入

第7章 Node.js基礎
主要講解Node的基礎程式設計以及如何使用Express框架構建Node專案
7-1 Linux環境下配置Node環境
7-2 建立http Server容器
7-3 通過node載入靜態頁面
7-4 搭建基於Express框架的執行環境

第8章 MongoDB介紹
介紹MongoDB在windows平臺和Linux平臺分別是如何進行安裝和部署的,講解MongoDB的基礎語法。
8-1 window平臺下MongoDB的安裝和環境搭建
8-2 Linux平臺下安裝配置MongoDB
8-3 給MongoDB建立使用者
8-4 MongoDB基本語法
8-5 表資料設計和插入

第9章 基於Node.js開發商品列表介面
基於Node.js來開發整個商品列表的後臺功能,包括商品分頁、商品價格過濾、商品排序、加入購物車、登入判斷等核心功能。
9-1 Node的啟動和除錯方式
9-2 基於Express實現商品列表查詢介面
9-3 商品列表分頁和排序功能實現(上)
9-4 商品列表分頁和排序功能實現(下)
9-5 價格過濾功能實現
9-6 加入購物車功能實現

第10章 登入模組實現
主要介紹全站的登入、登出以及全域性的模態框元件的開發。
10-1 登入功能實現
10-2 登出功能實現
10-3 登入攔截
10-4 全域性模態框元件實現

第11章 購物車模組實現
講解購物車頁面的整體功能實現。包括了購物車列表功能的前後端實現、購物車刪除和修改的前後端實現以及購物車全選、金額的實時計算前後端實現。
11-1 購物車列表功能實現
11-2 商品刪除功能實現
11-3 商品修改功能實現
11-4 購物車全選和商品實時計算功能實現

第12章 地址模組實現
講解地址頁面整體功能實現。包括了地址列表功能前後端實現、地址刪除前後端實現以及地址切換、設定預設、展開收縮等前後端功能實現。
12-1 地址列表渲染實現 (上)
12-2 地址列表渲染功能實現(下)
12-3 地址列表切換和展開功能實現
12-4 地址設定預設功能實現
12-5 地址刪除功能實現

第13章 訂單確認模組實現
講解訂單確認頁面的整體功能實現。主要包括訂單列表前後端實現以及建立訂單等前後端功能實現。
13-1 訂單確認列表渲染功能實現
13-2 建立訂單功能實現
第14章 訂單成功模組實現
講解如何根據訂單Id來實現訂單成功資訊的展示。
14-1 訂單成功頁面功能實現

第15章 基於Vuex改造登入和購物車數量功能
講解Vuex如何在專案當中進行運用,同時結合登入和購物車功能,進行狀態整合。
15-1 Vuex基本介紹
15-2 Vuex的語法講解
15-3 通過Vuex實現登入和購物車數量(上)
15-4 通過Vuex實現登入和購物車數量(下)

第16章 Webpack使用
介紹Webpack如何進行單頁面和多頁面專案的構建,以及Webpack最常用的外掛和知識點講解。
16-1 webpack基礎介紹
16-2 外掛靜態部分實現
16-3 外掛功能實現
16-4 webpack打包功能實現(上)
16-5 webpack打包功能實現(下)
16-6 npm外掛釋出
16-7 webpack多頁面構建(上)
16-8 webpack多頁面構建(下)
16-9 webpack多頁面構建-第三方庫
16-10 webpack多頁面構建-抽取公共模組

第17章 線上部署
講解如何將一個Vue和Node的前後端分離專案進行線上部署(真實的伺服器,基於Linux),同時包括MongoDB的配置和啟動以及Node專案的後臺程序啟動、日誌檢視、狀態監控等一系列操作。
17-1 線上部署(上)
17-2 線上部署(中)
17-3 線上部署(下)

第18章 課程總結
主要跟大家一起回顧本次實戰課所講解的框架語法、解決什麼樣的問題,如何進行專案除錯以及大家學完後所能夠掌握和學到的知識點。
18-1 課程總結

第19章 針對第六章和第八章大家提出的問題,補充視訊
針對大家提出的問題,補充視訊
19-1 第六章 修復vue-cli工具不生成dev-server.js檔案問題
19-2 第八章 mongodb環境變數配置和mongo版本衝突問題

下載地址:Vue2.0+Node.js+MongoDB  全棧打造商城系統