一個vue+express+nodejs爬蟲構建的偽整站移動書城

levius 發(fā)布于2019-08-20 17:51 / 2726人閱讀

摘要：數(shù)據(jù)有了，接下來該構建了，谷歌了一下發(fā)現(xiàn)用好像不錯，于是又學習了部分，構建了所需的。采用分離的寫法，分開寫，方便維護。另外本項目中還寫了一些可直接遷移使用的組件比如組件左右彈出層的背景陰影組件。最后上點項目截圖界面是抄起點的

項目地址：點擊

預覽地址：點擊

api地址：點擊

爬蟲地址：點擊

技術棧：vue + vue-router + vuex + webpack + axios + less + flex + express + nodejs + mysql + localStorage

這個項目很早以前就開始寫了，算是用vue寫的第一個項目，應該比較符合新手學習。所以代碼還是有不少問題，但是應該很符合vue入門使用者的寫法，比如直接修改state：this.$store.state.xx = xx。

最開始是用jQuery寫了閱讀器部分，后來為了學習，就嘗試用vue重構，學習了整個vue技術棧。
后來想想閱讀器寫好了，沒有書可不行，想想應該用爬蟲爬點數(shù)據(jù)，于是各種查找node爬蟲的資料，寫了不少爬蟲。

數(shù)據(jù)有了，接下來該構建api了，谷歌了一下發(fā)現(xiàn)用express好像不錯，于是又學習了express部分，構建了所需的api。

有的同學剛開始學習vue的時候可能有點茫然，不光是vue本身的用法、api、組件等等，查資料后發(fā)現(xiàn)還有vue-router、vuex等等需要學習。

本項目就是那個階段寫的第一個比較完善的vue項目，現(xiàn)在才拿出來是因為中間有不少事耽擱了，如果你想看代碼，可能會發(fā)現(xiàn)不少地方跟自己寫得很像，一共只有四個路由，夠簡單吧，但是用到的東西在其他復雜應用中也是必需的，仔細想想其實vue也就那么點東西，多寫就容易了。

vue-router方面，常用的內(nèi)容基本都用到了，比如
動態(tài)路由、編程式導航、命名路由、重定向、數(shù)據(jù)獲取時的loading、懶加載等等。

vuex采用分離的寫法，state、mutation、action分開寫，方便維護。

另外本項目中還寫了一些可直接遷移使用的組件、比如loading組件、左右彈出層的背景陰影組件。

最后上點項目截圖

PS：界面是抄起點的

云服務器 GPU云服務器偽整站 Vue+Express nodejs express nodejs+express

文章版權歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/83920.html

使用react技術棧完全重寫一個vue書城項目

摘要：本項目是在之前一個項目基礎上，用技術棧重寫的一個書城項目版本地址本項目地址預覽地址項目說明本項目是一個構建的移動書城項目，數(shù)據(jù)是通過爬蟲爬取，存儲在中，項目通過構建，前端部分是技術棧。本項目是在之前一個vue項目基礎上，用react技術棧重寫的一個書城項目 vue版本地址本項目地址預覽地址項目說明本項目是一個react + nodejs + mysql構建的移動書城項目，...

aaron 2019-08-21 11:59 評論0 收藏0
2017年2月份前端資源分享

平日學習接觸過的網(wǎng)站積累，以每月的形式發(fā)布。2017年以前看這個網(wǎng)址：http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼十大經(jīng)典排序算法(帶動圖演示) 為什么知乎前端圈普遍認為H5游戲和H5展示的JSer 個人整理和封裝的YU.js庫|中文詳細注釋|供新手學習使用擴展JavaScript語法記錄 - 掉坑初期工具漢字拼音轉(zhuǎn)換...

lily_wang 2019-06-27 16:28 評論0 收藏0
2017年2月份前端資源分享

平日學習接觸過的網(wǎng)站積累，以每月的形式發(fā)布。2017年以前看這個網(wǎng)址：http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼十大經(jīng)典排序算法(帶動圖演示) 為什么知乎前端圈普遍認為H5游戲和H5展示的JSer 個人整理和封裝的YU.js庫|中文詳細注釋|供新手學習使用擴展JavaScript語法記錄 - 掉坑初期工具漢字拼音轉(zhuǎn)換...

chengjianhua 2019-08-29 12:35 評論0 收藏0
2017年2月份前端資源分享

平日學習接觸過的網(wǎng)站積累，以每月的形式發(fā)布。2017年以前看這個網(wǎng)址：http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼十大經(jīng)典排序算法(帶動圖演示) 為什么知乎前端圈普遍認為H5游戲和H5展示的JSer 個人整理和封裝的YU.js庫|中文詳細注釋|供新手學習使用擴展JavaScript語法記錄 - 掉坑初期工具漢字拼音轉(zhuǎn)換...

Anonymous1 2019-08-20 16:31 評論0 收藏0
2017年2月份前端資源分享

平日學習接觸過的網(wǎng)站積累，以每月的形式發(fā)布。2017年以前看這個網(wǎng)址：http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼十大經(jīng)典排序算法(帶動圖演示) 為什么知乎前端圈普遍認為H5游戲和H5展示的JSer 個人整理和封裝的YU.js庫|中文詳細注釋|供新手學習使用擴展JavaScript語法記錄 - 掉坑初期工具漢字拼音轉(zhuǎn)換...

dreamtecher 2019-08-01 16:51 評論0 收藏0