使用Vue、React和Koa開發個人部落格
前言
實習了大半年,又臨近畢業,一直想做一個屬於自己的部落格。於是就用Vue、React和Koa開發了一個服務端渲染的部落格系統。其中:
- 後端管理使用Vue開發
- 前端頁面使用React服務端渲染框架nextjs
- 介面服務使用Koa2 + mongodb + mongoose(使用nodemailer
當介面發生500
時向我傳送郵件通知)
專案地址是點我訪問專案地址,(不要臉地求star)。為了方便體驗(小弟不才,大佬們輕虐),可以點選訪問後端管理系統,在註冊使用者後,即可登入體驗,同時也可以釋出文章,然後在前端頁面就可以看到釋出的文章。(目前(2018-02-28)未備案,就簡單通過ip訪問即可)
效果預覽
1 後端管理頁面
後端管理頁面使用了vue、vuex、sass以及axios,其中模仿ElementUI的樣式開發了dialog
、loading
、confirm
、notofication
、messgae
等等元件,(感覺自己對vue元件的開發姿勢又稍微深入了一點點,畢竟學無止境)。以下為部分頁面截圖:
登入
個人中心
文章管理
新建文章
ECharts結合
2 前端頁面渲染
藉此機會想學習一下React
,於是前端頁面使用了React服務端渲染框架nextjs
,並使用了Redux
、axios
以及koa
(自定義服務所用)。前端頁面目前比較簡單,主要就是文章的讀取和渲染。以下為截圖:
首頁
文章詳情
結束語
這一次開發個人部落格,學習了很多,像是Vue元件開發
、檔案上傳
、上傳到七牛雲
以及react
和redux
的使用,再到使用koa2
、mongodb
寫介面,然後再到pm2守護程序
和配置nginx
等等。總之,學習到了很多,接下來我會整理思路,把這些總結總結分享出來,歡迎指正批評。
Github地址是這個elpase,求start,嘻嘻…