?
項目背景?
可行性方面
需求分析：
詳細設計：
數據庫設計
博客管理API的設計
標簽相關API
服務器端的實現
對數據庫操作進行封裝
對服務器操作進行封裝
客戶端實現
具體操作
使用markdown
具體實現
測試
項目效果展示
維護
完整代碼
項目背景?
? ? ? ?現在的時代信息越來越多，我們每時每刻都在學習和接受各種信息，我們要怎樣保存這些信息，并且 向他人展示，寫博客就是一個很好的方法。
? ? ? ? 現在有很多的博客網站就是實現這樣的功能，這個項目就是實現一個自己的博客網站，可以把我們平時的學習和生活記錄下來。
可行性方面
- 經濟可行性——低成本
- 操作可行性——簡單
- 技術可行性——借助其他工具
需求分析：
? ? ? ?支持單個用戶
? ? ? ?我們的客戶端是在瀏覽器上實現的，要在瀏覽器上進行對博客的操作，編輯，修改，刪除，增加等。
? ? ? ?服務器器端在Linux上實現，針對每一個客戶端的按鈕都要有對應的事件處理。
? ? ? ?存儲用MySQL數據庫，調用c/c++API進行對博客的管理
博客服務器端要實現的功能
- ?對博客的管理能力
- ?對標簽的管理能力
博客客戶端要實現的功能
- 博客標題列表頁面?
- 博客內容展示頁面
- 博客管理頁面
- 博客內容編輯頁面
數據存儲要實現的功能
- 服務器存儲 markdown 格式的數據
- ?前端通過 editor.md 這個工具將markdown的文檔內容提交給服務器, 或者解析服務器返回的 markdown 作為 前端頁面內容.?
詳細設計：
數據庫設計
? ? ? ?對于博客管理而言，一個博客除了自己的編號外，一但博客量比較大，我們還需要標簽來對其進行管理。所以我們的數據庫需要兩張表
對于博客表，那么它肯定有博客編號，標題，正文，創建時間，還有所對應的標簽信息
drop table if exists blog_table
create table blog_table(blog_id int(6) not null primary key auto_increment,title varchar(50),content text,tag_id int,create_time varchar(50));對于標簽表而言，我們只需要有標簽的編號，和標簽所對應的名字即可
drop table if exists tag_table
create table tag_table(tag_id int not null primary key auto_increment ,tag_name varchar(50)
);有了這兩張表后接下來我們就要實現服務器端的程序了
博客管理API的設計
?新增博客
?
POST/blog
{title:xxxx,content:xxxx,create_time:xxxx,tag_id:xxxxx,
}
成功返回一個:
HTTP/1.1 200 OK
{ok:truereason: " "?? ??? ?//失敗的原因
}
展示博客列表
?
GET/blog?? ??? ??? ??? ??? ?//獲取所有
GET/blog?tag_id = 1;?? ?//按照標簽來篩選HTTP/1.1 200 OK
[{blog_id:1,title:"我的第一篇博客",create_time:"2019/--/--"tag_id:1?? ?},
]
展示博客詳細內容
?
GET/blog/:blog_id?? ??? ?//冒號后面代表一個真正的博客id，是一個數字。類似于/blog/10HTTP/1.1 200 OK
{"blog_id":1,"title":"我的第一篇博客",create_time:"2019/--/--",tag_id:1
}
?刪除博客
?
DELETE/blog/:blog_idHTTP/1.1 200 OK
{ok:true;
}
?修改博客
?
PUT/blog/:blog_id
{title:"修改后的標題",content:"修改之后的正文",tag_id:"修改之后的tag_id",
}HTTP/1.1 200 OK
{ok:true
}?
標簽相關API
?新增標簽
?
POST/tag
{"tag_name": "新增的標簽名"
}HTTP/1.1 200 OK
{ok:true
}
?
刪除標簽
?
DELETE/tag/:tag_idHTTP/1.1 200 OK
{ok:true
}
查看所有標簽
?
GET/tagHTTP/1.1 200 OK
[{tag_id:1,tag_name:c++}
]服務器端的實現
由于數據庫封裝和服務器端封裝代碼比較多，所以另寫兩篇博客
對數據庫操作進行封裝
封裝數據庫
對服務器操作進行封裝
服務器封裝的鏈接
客戶端實現
HTML-----網頁的骨架
CSS-----網頁的樣式(大小/顏色/位置/邊框/...)
JavaScript-----網頁和用戶之間的交互動作
我并沒有專門學過前端，但是考慮到開發項目客戶端，我還是專門學了一些簡單前端知識
JS教程? ? ?css教程? ??HTML教程
最后綜合各種的前端開發語言，我還是決定選擇用JQuery+Vue.js來實現
使用 Vue.js
為什么使用Vue.js。？
因為它的開源社區是中文的，而且作者是中國人(尤雨溪)，既然是中國人肯定按照中國人的思維開發出的vue.js。所以因該用起來不是很難
網頁中需要動態交互的部分, 使用 JS 來實現. 但是原生的基于 Dom API 的交互方式比較麻煩, 因此 Vue.js 提供了更簡
單更方便的做法.
使用ajax來獲取數據
ajax具體操作學習----->學習網站
具體操作
使用markdown
提交，存儲博客的時候，都可以用markdown格式的數據來表示，展示的時候，就自動把markdown數據轉成html格式的數據
我們需要第三方庫來實現這樣的操作，Editor.md第三方的JS庫，完成markdown和html相互轉換，以及markdown在線編輯器的功能
具體的操作需要看官網介紹
http://editor.md.ipandao.com/1. 博客列表頁
2.博客詳情頁
以上實現由于html靜態網頁實在是代碼量比較大，不方便在此展示，只能放到GitHub上，如果有需要請自行下載
上面兩個頁面都是給大家看的
而下面的頁面則是只能自己看
3.博客管理頁面
刪除博客
編輯博客:點擊博客進入編輯頁面，編輯頁面中應該有一個
插入博客:markdown編輯器，編輯器里的內容已經是博客當前內容了，編輯完成后，點擊提交按鈕，就把服務器發送到服務器上
?
具體實現
由于前端代碼量過大，不易展示，訪問下面網站查看詳情
https://github.com/514467952/Private-blog_workstation.git測試
在完成三個面的實現后，我們需要對整個項目進行測
測試方式:在數據庫和服務器相應功能實現上，采用單元測試，且測試方法采用白盒測試
具體的測試代碼均在上面的網址。
文件加載測試：按鈕中實現跳轉頁面，確認是否能夠跳轉
總體測試:完整操作，驗證是否能和功能對應
項目效果展示
首頁展示
查看博客頁面
后臺管理博客頁面
后臺插入博客頁面
維護
- 這是一個輕量級的項目，目前只針對單人使用。以后等我技能提升后，會支持多用戶登陸并進行操作。
- 底層用的httplib的庫，這個底層實現了多線程，可以支持多用戶訪問。
- 目前實現的功能，尚且只有博客的增刪改查，雖然關于標簽的增改，后臺功能已實現，但由于本人前端編程語言并不是很熟所以還無法實現
- 博客的內容不易過長，因為本人端編程語言不是很熟，沒有實現翻頁的功能，
完整代碼
https://github.com/514467952/Private-blog_workstation.git
)
)
)
