分享一個基於Node的名片設計網站

我如今本職工做是UI設計，可是在工做中也喜歡瞭解和學習前端技術，這是小網站是我去年開始學習Node以後開發的我的項目。這個項目邊學邊作，斷斷續續也有半年時間吧，期間不斷增長新功能，優化用戶體驗。如今由於想構想新項目，不打算繼續更新，因此分享給感興趣的朋友，你們互相學習。

項目地址 https://github.com/luosijie/card

預覽地址 http://card.luosj.me

安裝

1. 安裝MongoDB併成功啓動

2. git clone "https://github.com/luosijie/card.git"

3. npm install

4. npm start

5. 訪問 localhost:3000

使用到是技術

1. Node + Express

2. MongoDB + Mongoose

實現功能

網站的基本功能是管理員編輯好名片模板並上傳到服務器，用戶經過簡單編輯名片模板下載直接拿去打印店打印

1. 登陸註冊

2. 圖片簡單處理

3. 名片模板的上傳和保存

4. 名片圖片的打包和下載

5. 名片模板收藏

6. MongoDB數據增刪改查

使用到的插件

1. html2Canvas 用於將html解析爲圖片

2. jsZip 用於圖片打包

3. fileSaver 用於導出打包後的zip文件

網站的不足

1. 代碼組織比較亂 ———— 哪天心情好再來整理

2. 沒有兼容瀏覽器，目前只谷歌 火狐能夠正常訪問 ———— 人生苦短，我不兼容

3. 沒有管理後臺 ———— 這是一個比較大的問題

項目結構

項目部分截圖

首頁

模板列表用hbs模板渲染

用戶編輯頁

看起來簡單的頁面結果花的時間最多

管理員上傳模板

注意：這個頁面的權限只有 用戶名爲admin 才能夠訪問，沒辦法就是這麼不科學

我的中心

先這樣了，歡迎你們star