前言
作為一個(gè)技術(shù)開發(fā)者婉烟，我們很有必要經(jīng)常歸納總結(jié)设江。而歸納總結(jié)最好的方式就是寫技術(shù)博文。強(qiáng)化自己的技術(shù)棧叉存。雖然在今天，各種可以寫技術(shù)的網(wǎng)站很多很多度帮。但是想擁有自己一片天地的朋友歼捏，還是可以搭建一個(gè)的。下面就是我自己學(xué)習(xí)React后重構(gòu)了自己的博客瞳秽。
該項(xiàng)目基于react+antd+dva+umi實(shí)現(xiàn)。項(xiàng)目已經(jīng)開源寂诱。
源代碼：https://github.com/immisso/Blog
線上預(yù)覽：https://www.immisso.com
效果圖
-
首頁
image -
文章詳情頁
image -
評(píng)論
image -
登錄
image
功能描述
已實(shí)現(xiàn)的功能
- 登錄
- 注冊
- 分類
- 文章列表
- 作者個(gè)人信息
- 點(diǎn)贊評(píng)論
- 留言
- 文章詳情
- 代碼高亮
- 文章詳情目錄
待實(shí)現(xiàn)功能
- 文章管理
- 發(fā)文
- 文檔類文章編寫功能
- ...
后期重構(gòu)
- hooks
技術(shù)棧
該項(xiàng)目采用前后端分離技術(shù)拂苹。目前github上暫時(shí)只開源了前端部分。服務(wù)端采用Python開發(fā)瓢棒，將會(huì)在后期陸續(xù)開源出來丘喻。為了保存網(wǎng)站的完整顯示。使用了mock數(shù)據(jù)泉粉。數(shù)據(jù)來源都是自己博客網(wǎng)站上的數(shù)據(jù)。主要功能實(shí)現(xiàn)模塊包括
react 16.8.6antd 3.19.5umi 2.7.7dva ^2.6.0-beta.6marked 0.7.0highlight.js 9.15.10
項(xiàng)目
該項(xiàng)目使用umi開發(fā)嗡靡，項(xiàng)目也是使用umi的腳手架創(chuàng)建，創(chuàng)建命令
yarn create umi
更多umi相關(guān)移步umi文檔
語法高亮
文章詳情頁代碼語法高亮歉井，采用highlight.js實(shí)現(xiàn)，通過marked模塊對markdown進(jìn)行轉(zhuǎn)化哩至。當(dāng)然語法高亮也可以通過prismjs實(shí)現(xiàn)蜜自。
最后
許多功能會(huì)后續(xù)逐漸完善，這不僅僅是一個(gè)小小的博客網(wǎng)站重荠。也是學(xué)習(xí)的一個(gè)歷程。逐漸提高自己的過程戈鲁。
