摘要:轉(zhuǎn)行前端一年多,之前一直忙于寫業(yè)務(wù)代碼,剛好近期不忙,就想寫一個完全屬于自己的項目。本項目因為時間關(guān)系暫時只做了部分功能,但是有空會繼續(xù)更新的。項目未完成的部分后續(xù)會逐漸完成。
轉(zhuǎn)行前端一年多,之前一直忙于寫業(yè)務(wù)代碼,剛好近期不忙,就想寫一個完全屬于自己的項目。原本打算用react來做的,但是估計邊翻api邊寫可能會花特別長的時間,所以打算這個項目完成后寫個react的項目。
本項目因為時間關(guān)系暫時只做了部分功能,但是有空會繼續(xù)更新的。
將代碼克隆到本地:git clone https://github.com/chenging/vue.git;
安裝依賴:進入項目根目錄,命令行工具輸入npm install;
運行前端服務(wù)器:命令行工具輸入npm start,打開http://localhost:8888即可預覽項目;
安裝數(shù)據(jù)庫:可以直接到mongodb官網(wǎng)下載,安裝完在C盤目錄下新建文件夾data,進入data文件夾再新建一個db文件夾,此為mongodb默認存放數(shù)據(jù)目錄;
開啟mongodb數(shù)據(jù)庫:進入mongodb安裝目錄,找到mongod.exe文件,雙擊打開;
運行node.js后臺服務(wù)器:進入項目根目錄,命令行工具輸入node server,第一次運行會存入初始數(shù)據(jù)。
一、目錄結(jié)構(gòu) 二、主要技術(shù)棧前端:vue+vue-router+axios+es6+webpack+canvas;
后端:node.js+koa;
數(shù)據(jù)庫:mongodb+mongoose
三、目前已完成的功能音樂播放:包括播放進度條、播放動畫、歌曲切換
視頻播放:播放視頻時暫停音樂播放,結(jié)束后會繼續(xù)音樂播放;
登錄注冊:登錄、注冊、修改資料
歌曲搜索:通過歌曲名稱、演唱者名字、歌詞模糊查詢。
圖片輪播:自動切換圖片及手動切換圖片
四、參考資料webpack官方文檔:https://webpack.js.org/guides...
廖老師nodejs教程https://www.liaoxuefeng.com/w...
mongoose官方文檔:http://mongoosejs.com/docs/ap...
五、在線演示及項目地址在線演示地址:https://chenging.github.io/vu...
github地址:https://github.com/chenging/vue
項目截圖和代碼部分就不放了,里面有詳細的注釋(主要是怕自己給忘了。。。)
第一次寫文章,也是第一個個人項目,包括后臺和數(shù)據(jù)庫都是第一次。。。。
更多的是對自己的一個總結(jié)吧,也歡迎大家對代碼或者項目部分提出意見和建議。
項目未完成的部分后續(xù)會逐漸完成。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/19106.html
摘要:轉(zhuǎn)行前端一年多,之前一直忙于寫業(yè)務(wù)代碼,剛好近期不忙,就想寫一個完全屬于自己的項目。本項目因為時間關(guān)系暫時只做了部分功能,但是有空會繼續(xù)更新的。項目未完成的部分后續(xù)會逐漸完成。 轉(zhuǎn)行前端一年多,之前一直忙于寫業(yè)務(wù)代碼,剛好近期不忙,就想寫一個完全屬于自己的項目。原本打算用react來做的,但是估計邊翻api邊寫可能會花特別長的時間,所以打算這個項目完成后寫個react的項目。本項目因為...
摘要:項目地址暫時只實現(xiàn)了基本功能加了一點微小的效果主要適配瀏覽器對和做了一點微小的適配現(xiàn)在已經(jīng)包括了打包平臺的功能了源碼地址項目預覽項目描述前端部分整體加載進度懶加載模塊的加載中提示實現(xiàn)了滑塊增量分頁新曲等使用了做單頁應用使用了處理路由使用了管 項目地址 暫時只實現(xiàn)了基本功能 加了一點微?小的效果 主要適配pc瀏覽器 對android 和ios 做了一點微?小的適配 現(xiàn)在已經(jīng)包括了ele...
摘要:項目地址暫時只實現(xiàn)了基本功能加了一點微小的效果主要適配瀏覽器對和做了一點微小的適配現(xiàn)在已經(jīng)包括了打包平臺的功能了源碼地址項目預覽項目描述前端部分整體加載進度懶加載模塊的加載中提示實現(xiàn)了滑塊增量分頁新曲等使用了做單頁應用使用了處理路由使用了管 項目地址 暫時只實現(xiàn)了基本功能 加了一點微?小的效果 主要適配pc瀏覽器 對android 和ios 做了一點微?小的適配 現(xiàn)在已經(jīng)包括了ele...
摘要:項目地址暫時只實現(xiàn)了基本功能加了一點微小的效果主要適配瀏覽器對和做了一點微小的適配現(xiàn)在已經(jīng)包括了打包平臺的功能了源碼地址項目預覽項目描述前端部分整體加載進度懶加載模塊的加載中提示實現(xiàn)了滑塊增量分頁新曲等使用了做單頁應用使用了處理路由使用了管 項目地址 暫時只實現(xiàn)了基本功能 加了一點微?小的效果 主要適配pc瀏覽器 對android 和ios 做了一點微?小的適配 現(xiàn)在已經(jīng)包括了ele...
閱讀 2305·2021-09-28 09:45
閱讀 3596·2021-09-24 09:48
閱讀 2256·2021-09-22 15:49
閱讀 3093·2021-09-08 16:10
閱讀 1586·2019-08-30 15:54
閱讀 2317·2019-08-30 15:53
閱讀 3012·2019-08-29 18:42
閱讀 2864·2019-08-29 16:19