前言
前幾個月學完React官方文件教程後準備寫一個部落格專案來實踐學習成果，寫完時總覺得部落格專案太簡單又爛大街，決定把原來的部落格專案改造升級成類知乎文章方面功能的專案。
專案詳細架構和原始碼地址：github.com/manyuewuxin…
實現功能
- [x] 登入註冊
- [x] 建立文章
- [x] 關注標籤
- [x] 文章過濾
- [x] 文章排序
- [x] 文章搜尋
- [x] 使用者設定
- [x] 使用者訊息
- [x] 使用者動態
- [x] 關注使用者
- [x] 收藏文章
- [x] 評論文章
- [x] 個人主頁
- [x] 後臺管理系統等
部分效果預覽
個人主頁、使用者設定和標籤展示UI設計是模仿掘金社群UI的
後臺管理系統
專案說明
專案比較雜，只挑重點的說。
前端專案
-
登入介面有兩種，一種是用react-router路由驅動，比如
/login跳轉至登入頁，另一種是在Mobx全域性建立一個可觀察的login物件，如果是沒有登入狀態在首頁點贊、收藏、回覆評論等向後端請求會返回一個403狀態碼觸發可觀察login物件彈出登入模態框。 -
使用者的訊息系統實現思路其實很簡單，當向一個使用者回覆文章、回覆評論、關注時獲取這個被回覆的使用者user_id向後端mongodb的關聯message集合插入一個訊息文件，被回覆的使用者在首次登入狀態或跳轉路由就會重新整理訊息請求，沒有使用任何高大上的訊息佇列庫，快取資料庫redis等。使用者的動態設計思路大致和使用者訊息一樣，只不過不需要像使用者訊息插入被回覆使用者的關聯message集合，而是進入這個使用者個人主頁時向關聯dynamic集合獲取動態資料。
-
建立文章富文字編輯器使用了國人開發的wangeditor輕量級富文字編輯器，只要不是要求企業級別的標準，這個富文字編輯器基本可以滿足日常編寫文章。
-
首頁的文章排序沒有使用任何演算法，純粹只使用了mongodb的索引排序，根據點選閱讀量和喜歡次數多鍵索引排序，如果是登入狀態那麼就使用關注標籤+點選量+建立日期排序。
-
前端專案的狀態管理是使用Mobx和區域性state混合管理，因為有些元件的狀態是一個區域閉環，每次重新開啟需要初始化某個狀態，所以不全部寫入到Mobx。
-
整個axios請求配置和統一處理請求錯誤寫在request中介軟體模組，省去了一個請求寫一個錯誤處理。
後端專案
-
後端router模組不是常用那種多個一二級路由組成一個路由模組寫法，而是利用fs模組在編譯執行階段掃描controller目錄控制器模組全部匯入express-router載入路由，實現路由自動化載入，詳細實現思路可以看知乎方正這個Nodejs：擺脫黑工坊發展出一款基礎企業級框架文章。
-
mongodb驅動庫是原生nodejs驅動庫，不是mongoose，因為剛寫後端時並不知道有這個超集框架，加上原生驅動庫也有models API，且大部分實現邏輯都是CRUD，索性直接用原生驅動庫。
-
mongodb的使用者資料建模都是標準化資料模型一對多，使用$lookup操作符關聯查詢，這樣設計集合方便查詢和分離文件儲存空間，如上使用者訊息關聯集合所示。
後臺管理系統專案
後臺管理系統使用了螞蟻金服的antd UI元件和chartjs圖表庫，目前後臺管理系統是一個半成品，只實現了稽核文章，圖表，註冊，標籤管理元件，其他路由元件待擴充套件更改。
後話
這個專案是我第一次寫全棧開發，可能因為經驗不足有些實現思路不是好的解決思路，如果有怎麼建議可以在評論回覆或issue。
本專案僅個人開發練習，不作為任何商業用途