前言
寫這個博客系統的初衷是爲了給那些不願自己維護一個個人博客，但又覺得市面主流博客網站廣告多、不夠簡潔等。所以我寫這個系統的時候也是盡力讓它儘量的簡潔，但又帶一點個人風格。目前自定義主題功能還沒上線，過段時間我將會加上他，讓使用者可以自己DIY自己的主頁。取名爲Canary，中文名也就是金絲雀，目的是想把它做得很漂亮，很吸引人，讓更多的人來使用它。
更新：項目更換了編輯器，採用所見即所得的markdown編輯器，使寫作成爲一種享受。代碼語法高亮插件更換爲prismjs，更輕量，更漂亮。歡迎使用。
github地址：Canary 覺得不錯去的去github給個小星星呀。
下面是我項目的readme，我就直接粘貼了。如果喜歡的朋友可以給我一個star，有什麼bug歡迎提issue。
簡約博客網站
一個堅持簡約美的在線博客網站，可以實現博客的在線編輯，預覽，發佈功能。
提供用戶登錄註冊功能，登錄後可以發佈文章，對文章進行點贊、評論、收藏等功能。文章可以根據分類或者標籤查詢，更是提供了全文檢索功能。採用所見即所得的Markdown編輯器，使寫作成爲一種享受。採用prism進行代碼高亮，更接近主流編譯器的高亮風格。項目是採用前後端分離設計思想，前臺界面採用響應式佈局，在多端瀏覽都會有良好的視覺體驗。前後端分開部署，採用了docker+jenkins自動化部署。
技術棧
- vue2 用於構建用戶界面的漸進式框架
- vue-router Vue.js 官方的路由管理器
- vuex 專爲 Vue.js 應用程序開發的狀態管理模式
- webpack 模塊打包器
- es6/eslint 採用es6語法，並使用eslint檢查語法
- axios 尤雨溪推薦使用axios來完成ajax請求
- sass 對CSS的擴展，讓CSS語言更強大、優雅
項目構建運行
# clone項目到本地
git clone https://github.com/jie12366/simple-beauty.git
# 進入項目根路徑
cd simple-beauty
# 安裝相關依賴
npm install (或yarn)
# 本地運行
npm run dev
關於後端
後端用springboot+mongod構建，採用restful風格api，使用swagger生成在線api文檔，JWT生成token，redis作爲緩存以及內存數據庫，使用websocket通信。
項目地址：simple-beauty-after
目標功能
- 登錄註冊 – 完成
- 修改密碼 – 完成
- 第三方登錄(暫時只支持QQ、github、碼雲) – 完成
- 個人中心 – 完成
- 消息提醒 – 完成
- 在線編輯文章 – 完成
- 文章詳情展示 – 完成
- 管理博客 – 完成
- 自定義主題 – 完成
- 評論回覆系統 – 完成
- 點贊、收藏 – 完成
- 分類、標籤、歸檔展示 – 完成
- 照片牆、關於我 – 完成
- 全文檢索/站內搜索 – 完成
項目演示
項目演示地址爲：Canary
需要注意的問題
支持高亮的語言爲java、kotlin、c、cpp、python、bash、lua、vim、yaml、docker、git、json，其他語言不支持代碼高亮，請不要在代碼塊中註明語言。默認使用bash語言來高亮代碼。
感謝開源
| 名稱 | 說明 | GitHub/官網 |
|---|---|---|
| HyperMD | 所見即所得的markdown編輯器組件 | https://github.com/laobubu/HyperMD |
| CodeMirror | 瀏覽器內代碼編輯器 | https://github.com/codemirror/CodeMirror |
| prism | 輕量又好看的代碼高亮庫 | https://github.com/PrismJS/prism |
| markdown-it | 強大的markdown解析器 | https://github.com/markdown-it/markdown-it |
| markdown-it-prism | 使用prism高亮markdown-it中的代碼塊 | https://github.com/jGleitz/markdown-it-prism |
| markdown-it-emoji | 用於markdown-it中的表情解析 | https://github.com/markdown-it/markdown-it-emoji |
| markdown-it-anchor | 用於markdown中給標題增加id | https://github.com/valeriangalliat/markdown-it-anchor |
| moment | 增強js的時間處理 | https://github.com/moment/moment |
| v-viewer | 強大的圖片預覽組件 | https://github.com/mirari/v-viewer |
| vue-canvas-nest | 用於畫布嵌套的Vue.js背景組件 | https://github.com/ZYSzys/vue-canvas-nest |
| vue-drag-verify | 用於滑動驗證的vue組件 | https://github.com/AshleyLv/vue-drag-verify |
| vuex-persistedstate | 用於vuex持久化的組件 | https://github.com/robinvdvleuten/vuex-persistedstate |
| Element-ui | 適用於Web的Vue.js 2.0 UI工具包 | https://github.com/ElemeFE/element |
| iconfont | 好看又全面的字體圖標庫 | https://www.iconfont.cn/ |
開源協議
MIT LICENSE
無論是由於軟件，使用或其他方式產生的，與之有關或與之有關的合同，侵權或其他形式的任何索賠，損害或其他責任，作者或版權所有者概不負責。
